Improve screen reader accessibility of auth pages (#31236)

* 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>
2025-11-14 12:46:15 +00:00
parent 333bec33ee
commit ac0a91be9e
9 changed files with 33 additions and 18 deletions
@@ -129,6 +129,7 @@ test.describe("Login", () => {
            await expect(page.getByRole("heading", { name: "Welcome to Element!" })).toBeVisible();

            // Start the login process
+            await expect(axe).toHaveNoViolations();
            await page.getByRole("link", { name: "Sign in" }).click();

            // first pick the homeserver, as otherwise the user picker won't be visible
@@ -148,8 +149,6 @@ test.describe("Login", () => {
            await selectHomeserver(page, homeserver.baseUrl);

            await expect(page.getByRole("textbox", { name: "Username" })).toBeVisible();
-            // Disabled because flaky - see https://github.com/vector-im/element-web/issues/24688
-            // cy.percySnapshot("Login");
            await expect(axe).toHaveNoViolations();

            await page.getByRole("textbox", { name: "Username" }).fill(credentials.username);