From 7e4bbfebc62e9e3acf27235df354494bff04a9bb Mon Sep 17 00:00:00 2001
From: Marco Zehe <marcozehe@mailbox.org>
Date: Fri, 14 Feb 2020 12:34:22 +0100
Subject: [PATCH] Don't speak the outgoing message if it is in the Sending
 state.

Signed-off-by: Marco Zehe <marcozehe@mailbox.org>
---
 src/components/views/rooms/EventTile.js | 11 +++++++----
 1 file changed, 7 insertions(+), 4 deletions(-)

diff --git a/src/components/views/rooms/EventTile.js b/src/components/views/rooms/EventTile.js
index 916ddc3c5b..ba27c7c276 100644
--- a/src/components/views/rooms/EventTile.js
+++ b/src/components/views/rooms/EventTile.js
@@ -671,6 +671,9 @@ export default createReactClass({
             mx_EventTile_redacted: isRedacted,
         });
 
+        // If the tile is in the Sending state, don't speak the message.
+        const suppressSpeech = (isSending) ? "off" : undefined;
+
         let permalink = "#";
         if (this.props.permalinkCreator) {
             permalink = this.props.permalinkCreator.forEvent(this.props.mxEvent.getId());
@@ -789,7 +792,7 @@ export default createReactClass({
             case 'notif': {
                 const room = this.context.getRoom(this.props.mxEvent.getRoomId());
                 return (
-                    <div className={classes}>
+                    <div className={classes} aria-live={suppressSpeech}>
                         <div className="mx_EventTile_roomName">
                             <a href={permalink} onClick={this.onPermalinkClicked}>
                                 { room ? room.name : '' }
@@ -815,7 +818,7 @@ export default createReactClass({
             }
             case 'file_grid': {
                 return (
-                    <div className={classes}>
+                    <div className={classes} aria-live={suppressSpeech}>
                         <div className="mx_EventTile_line">
                             <EventTileType ref={this._tile}
                                            mxEvent={this.props.mxEvent}
@@ -851,7 +854,7 @@ export default createReactClass({
                     );
                 }
                 return (
-                    <div className={classes}>
+                    <div className={classes} aria-live={suppressSpeech}>
                         { avatar }
                         { sender }
                         <div className="mx_EventTile_reply">
@@ -879,7 +882,7 @@ export default createReactClass({
                 );
                 // tab-index=-1 to allow it to be focusable but do not add tab stop for it, primarily for screen readers
                 return (
-                    <div className={classes} tabIndex={-1}>
+                    <div className={classes} tabIndex={-1} aria-live={suppressSpeech}>
                         <div className="mx_EventTile_msgOption">
                             { readAvatars }
                         </div>