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

Improve screen reader accessibility of auth pages (#31236)

Browse Source 
* Improve screen reader accessibility of auth pages

Using a combination of auto-focus + aria-live to ensure content is read as the states progress

For https://element-io.atlassian.net/browse/PSB-971

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshot

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Iterate

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update snapshots

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Fix double landmark

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>

* Update screenshot

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-14 12:46:15 +00:00
committed by GitHub
parent 333bec33ee
commit ac0a91be9e
9 changed files with 33 additions and 18 deletions
Download Patch File Download Diff File Expand all files Collapse all files

4
test/unit-tests/components/views/auth/__snapshots__/AuthPage-test.tsx.snap
View File

@@ -13,9 +13,11 @@ exports[`<AuthPage /> should match snapshot 1`] = `
class="mx_AuthPage_modalBlur"
style="position: absolute; top: 0px; right: 0px; bottom: 0px; left: 0px; filter: blur(40px);"
/>
<div
<main
aria-live="polite"
class="mx_AuthPage_modalContent"
style="display: flex; z-index: 1; border-radius: 8px; background: rgba(255, 255, 255, 0.59);"
tabindex="-1"
/>
</div>
<footer