Use Compound buttons in auth screens (#32562)

* Use Compound buttons in auth screens Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Simplify Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Replace brandClass with testid Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix tests Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update screenshots Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Replace OIDC native Continue buttons too Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Fix contrast issues on legacy sso buttons Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Tidy css Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> * Update test Signed-off-by: Michael Telatynski <7t3chguy@gmail.com> --------- Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
2026-02-18 16:07:25 +00:00
parent 88b9605a9e
commit ba95f7f26b
17 changed files with 87 additions and 115 deletions
@@ -281,13 +281,13 @@ describe("Login", function () {
            ],
        });

-        const { container } = getComponent();
+        const { container, getByTestId } = getComponent();
        await waitForElementToBeRemoved(() => screen.queryAllByLabelText("Loading…"));

        for (const idp of idpsWithIcons) {
-            const ssoButton = container.querySelector(`.mx_SSOButton.mx_SSOButton_brand_${idp.brand}`);
+            const ssoButton = getByTestId(`idp-${idp.id}`);
            expect(ssoButton).toBeTruthy();
-            expect(ssoButton?.querySelector(`img[alt="${idp.brand}"]`)).toBeTruthy();
+            expect(ssoButton.childNodes[0]).toHaveAccessibleName(idp.brand);
        }

        const ssoButtons = container.querySelectorAll(".mx_SSOButton");