Apply aria-hidden to emoji in SAS verification (#31204)
* Apply aria-hidden to emoji in SAS verification So that for screen readers the canonical emoji description is preferred & we avoid the user being read each emoji twice. Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update snapshot Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --------- Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
committed by
GitHub
parent
f6e85a38d2
commit
8608268bc7
@@ -107,7 +107,9 @@ export default class VerificationShowSas extends React.Component<IProps, IState>
|
|||||||
if (this.props.sas.emoji) {
|
if (this.props.sas.emoji) {
|
||||||
const emojiBlocks = this.props.sas.emoji.map((emoji, i) => (
|
const emojiBlocks = this.props.sas.emoji.map((emoji, i) => (
|
||||||
<div className="mx_VerificationShowSas_emojiSas_block" key={i}>
|
<div className="mx_VerificationShowSas_emojiSas_block" key={i}>
|
||||||
<div className="mx_VerificationShowSas_emojiSas_emoji">{emoji[0]}</div>
|
<div className="mx_VerificationShowSas_emojiSas_emoji" aria-hidden={true}>
|
||||||
|
{emoji[0]}
|
||||||
|
</div>
|
||||||
<div className="mx_VerificationShowSas_emojiSas_label">{tEmoji(emoji, locale)}</div>
|
<div className="mx_VerificationShowSas_emojiSas_label">{tEmoji(emoji, locale)}</div>
|
||||||
</div>
|
</div>
|
||||||
));
|
));
|
||||||
|
|||||||
@@ -369,6 +369,7 @@ exports[`VerificationRequestDialog When other device accepted emoji, displays em
|
|||||||
class="mx_VerificationShowSas_emojiSas_block"
|
class="mx_VerificationShowSas_emojiSas_block"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
aria-hidden="true"
|
||||||
class="mx_VerificationShowSas_emojiSas_emoji"
|
class="mx_VerificationShowSas_emojiSas_emoji"
|
||||||
>
|
>
|
||||||
🐶
|
🐶
|
||||||
@@ -383,6 +384,7 @@ exports[`VerificationRequestDialog When other device accepted emoji, displays em
|
|||||||
class="mx_VerificationShowSas_emojiSas_block"
|
class="mx_VerificationShowSas_emojiSas_block"
|
||||||
>
|
>
|
||||||
<div
|
<div
|
||||||
|
aria-hidden="true"
|
||||||
class="mx_VerificationShowSas_emojiSas_emoji"
|
class="mx_VerificationShowSas_emojiSas_emoji"
|
||||||
>
|
>
|
||||||
🐱
|
🐱
|
||||||
|
|||||||
Reference in New Issue
Block a user