nikrozman/element-web
1
0
Fork 0
Code Issues Actions 3 Packages Projects Releases Wiki Activity

Apply aria-hidden to emoji in SAS verification (#31204)

Browse Source 
* 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:
Michael Telatynski
2025-11-10 16:46:30 +00:00
committed by GitHub
parent f6e85a38d2
commit 8608268bc7
2 changed files with 5 additions and 1 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
src/components/views/verification/VerificationShowSas.tsx
View File

@@ -107,7 +107,9 @@ export default class VerificationShowSas extends React.Component<IProps, IState>
if (this.props.sas.emoji) {
const emojiBlocks = this.props.sas.emoji.map((emoji, 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>
));

2
test/unit-tests/components/views/dialogs/__snapshots__/VerificationRequestDialog-test.tsx.snap
View File

@@ -369,6 +369,7 @@ exports[`VerificationRequestDialog When other device accepted emoji, displays em
class="mx_VerificationShowSas_emojiSas_block"
>
<div
aria-hidden="true"
class="mx_VerificationShowSas_emojiSas_emoji"
>
🐶
@@ -383,6 +384,7 @@ exports[`VerificationRequestDialog When other device accepted emoji, displays em
class="mx_VerificationShowSas_emojiSas_block"
>
<div
aria-hidden="true"
class="mx_VerificationShowSas_emojiSas_emoji"
>
🐱