From 7e4bbfebc62e9e3acf27235df354494bff04a9bb Mon Sep 17 00:00:00 2001 From: Marco Zehe Date: Fri, 14 Feb 2020 12:34:22 +0100 Subject: [PATCH 1/4] Don't speak the outgoing message if it is in the Sending state. Signed-off-by: Marco Zehe --- 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 ( -
+
{ room ? room.name : '' } @@ -815,7 +818,7 @@ export default createReactClass({ } case 'file_grid': { return ( -
+
+
{ avatar } { sender }
@@ -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 ( -
+
{ readAvatars }
From 636b0236b666fbe70442f41c7c32c8696548ed2c Mon Sep 17 00:00:00 2001 From: Marco Zehe Date: Wed, 15 Jul 2020 19:02:00 +0200 Subject: [PATCH 2/4] Update to use more strict rules for suppressing Signed-off-by: Marco Zehe --- src/components/views/rooms/EventTile.js | 11 +++++------ 1 file changed, 5 insertions(+), 6 deletions(-) diff --git a/src/components/views/rooms/EventTile.js b/src/components/views/rooms/EventTile.js index d8cd126964..43ab7c6b22 100644 --- a/src/components/views/rooms/EventTile.js +++ b/src/components/views/rooms/EventTile.js @@ -686,8 +686,7 @@ export default createReactClass({ }); // If the tile is in the Sending state, don't speak the message. - const ariaLive = (isSending) ? "off" : undefined; - const ariaBusy = (isSending) ? "true" : undefined; + const ariaLive = (this.props.eventSendStatus !== null) ? 'off' : undefined; let permalink = "#"; if (this.props.permalinkCreator) { @@ -823,7 +822,7 @@ export default createReactClass({ case 'notif': { const room = this.context.getRoom(this.props.mxEvent.getRoomId()); return ( -
+
{ room ? room.name : '' } @@ -849,7 +848,7 @@ export default createReactClass({ } case 'file_grid': { return ( -
+
+
{ ircTimestamp } { avatar } { sender } @@ -915,7 +914,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 ( -
+
{ ircTimestamp }
{ readAvatars } From 7c1935a44e5b7d91a50a3c5e0fc6dac859a53333 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Wed, 22 Jul 2020 11:10:55 +0100 Subject: [PATCH 3/4] Key EventTile's using txnId if it is set to prevent a remount Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/structures/MessagePanel.js | 14 ++++++-------- 1 file changed, 6 insertions(+), 8 deletions(-) diff --git a/src/components/structures/MessagePanel.js b/src/components/structures/MessagePanel.js index 7567786af3..230d136e04 100644 --- a/src/components/structures/MessagePanel.js +++ b/src/components/structures/MessagePanel.js @@ -346,9 +346,9 @@ export default class MessagePanel extends React.Component { } } - _isUnmounting() { + _isUnmounting = () => { return !this._isMounted; - } + }; // TODO: Implement granular (per-room) hide options _shouldShowEvent(mxEv) { @@ -571,12 +571,10 @@ export default class MessagePanel extends React.Component { const readReceipts = this._readReceiptsByEvent[eventId]; - // Dev note: `this._isUnmounting.bind(this)` is important - it ensures that - // the function is run in the context of this class and not EventTile, therefore - // ensuring the right `this._mounted` variable is used by read receipts (which - // don't update their position if we, the MessagePanel, is unmounting). + // use txnId as key if available so that we don't remount during sending ret.push( -
  • @@ -590,7 +588,7 @@ export default class MessagePanel extends React.Component { readReceipts={readReceipts} readReceiptMap={this._readReceiptMap} showUrlPreview={this.props.showUrlPreview} - checkUnmounting={this._isUnmounting.bind(this)} + checkUnmounting={this._isUnmounting} eventSendStatus={mxEv.getAssociatedStatus()} tileShape={this.props.tileShape} isTwelveHour={this.props.isTwelveHour} From 862856d3be19ec4487e442fef655be0ccd23bc27 Mon Sep 17 00:00:00 2001 From: Michael Telatynski <7t3chguy@gmail.com> Date: Fri, 24 Jul 2020 00:03:42 +0100 Subject: [PATCH 4/4] Also add aria-atomic=true Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --- src/components/views/rooms/EventTile.js | 8 ++++---- 1 file changed, 4 insertions(+), 4 deletions(-) diff --git a/src/components/views/rooms/EventTile.js b/src/components/views/rooms/EventTile.js index 43ab7c6b22..123319be75 100644 --- a/src/components/views/rooms/EventTile.js +++ b/src/components/views/rooms/EventTile.js @@ -822,7 +822,7 @@ export default createReactClass({ case 'notif': { const room = this.context.getRoom(this.props.mxEvent.getRoomId()); return ( -