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>
This commit is contained in:
Michael Telatynski
2026-02-18 16:07:25 +00:00
committed by GitHub
parent 88b9605a9e
commit ba95f7f26b
17 changed files with 87 additions and 115 deletions
@@ -1269,7 +1269,7 @@ describe("<MatrixChat />", () => {
fireEvent.change(screen.getByLabelText("Password"), { target: { value: password } });
// sign in button is an input
fireEvent.click(screen.getByDisplayValue("Sign in"));
fireEvent.click(screen.getByRole("button", { name: "Sign in" }));
};
beforeEach(() => {
@@ -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");