imterah/element-portable
1
0
Fork 0
Code Issues Pull requests Projects Releases Packages Wiki Activity Actions

Upgrade to latest compound-web package (#84)

Browse source 
* Upgrade to latest compound-web package

* Use a custom render function for jest tests

This way we don't need to manually wrap our components with
<TooltipProvider>

* Pin wrap-ansi to fix broken yarn install

* Add playwright helper to find tooltip from element

and use it in the failing test

* Exclude floating-ui divs/spans from axe testing

This is rendered outside .MatrixChat by compound and contains all the
tooltips.

* Wrap outermost components with TooltipProvider

* Remove onChange and use onSelect for toggle

* Fix jest tests and update snapshots

* Use vector-im/matrix-wysiwig

---------

Co-authored-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
R Midhun Suresh 2024-10-14 21:41:58 +05:30 • committed by GitHub
parent 3bc0439fd2
commit 91e84f7951
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
389 changed files with 1261 additions and 1084 deletions
Download patch file Download diff file Expand all files Collapse all files

38
test/components/views/settings/AddRemoveThreepids-test.tsx
View file

@ -6,7 +6,7 @@ SPDX-License-Identifier: AGPL-3.0-only OR GPL-3.0-only
Please see LICENSE files in the repository root for full details.
*/
import { render, screen, waitFor } from "@testing-library/react";
import { render, screen, waitFor } from "jest-matrix-react";
import { MatrixClient, ThreepidMedium } from "matrix-js-sdk/src/matrix";
import React from "react";
import userEvent from "@testing-library/user-event";
@ -209,7 +209,7 @@ describe("AddRemoveThreepids", () => {
},
);
const countryDropdown = screen.getByRole("button", { name: "Country Dropdown" });
const countryDropdown = screen.getByRole("button", { name: /Country Dropdown/ });
await userEvent.click(countryDropdown);
const gbOption = screen.getByRole("option", { name: "🇬🇧 United Kingdom (+44)" });
await userEvent.click(gbOption);
@ -217,10 +217,10 @@ describe("AddRemoveThreepids", () => {
const input = screen.getByRole("textbox", { name: "Phone Number" });
await userEvent.type(input, PHONE1_LOCALNUM);
const addButton = screen.getByRole("button", { name: "Add" });
const addButton = screen.getByRole("button", { name: /Add/ });
userEvent.click(addButton);
const continueButton = await screen.findByRole("button", { name: "Continue" });
const continueButton = await screen.findByRole("button", { name: /Continue/ });
await expect(continueButton).toHaveAttribute("aria-disabled", "true");
@ -252,7 +252,7 @@ describe("AddRemoveThreepids", () => {
});
expect(onChangeFn).toHaveBeenCalled();
});
}, 10000);
it("should display an error if the code is incorrect", async () => {
const onChangeFn = jest.fn();
@ -281,12 +281,12 @@ describe("AddRemoveThreepids", () => {
const input = screen.getByRole("textbox", { name: "Phone Number" });
await userEvent.type(input, PHONE1_LOCALNUM);
const countryDropdown = screen.getByRole("button", { name: "Country Dropdown" });
const countryDropdown = screen.getByRole("button", { name: /Country Dropdown/ });
await userEvent.click(countryDropdown);
const gbOption = screen.getByRole("option", { name: "🇬🇧 United Kingdom (+44)" });
await userEvent.click(gbOption);
const addButton = screen.getByRole("button", { name: "Add" });
const addButton = screen.getByRole("button", { name: /Add/ });
await userEvent.click(addButton);
mocked(client).addThreePidOnly.mockRejectedValueOnce(new Error("Unauthorized"));
@ -294,7 +294,7 @@ describe("AddRemoveThreepids", () => {
const verificationInput = screen.getByRole("textbox", { name: "Verification code" });
await userEvent.type(verificationInput, "123457");
const continueButton = screen.getByRole("button", { name: "Continue" });
const continueButton = screen.getByRole("button", { name: /Continue/ });
await userEvent.click(continueButton);
expect(createDialogFn).toHaveBeenCalledWith(expect.anything(), {
@ -320,12 +320,12 @@ describe("AddRemoveThreepids", () => {
},
);
const removeButton = screen.getByRole("button", { name: "Remove" });
const removeButton = screen.getByRole("button", { name: /Remove/ });
await userEvent.click(removeButton);
expect(screen.getByText(`Remove ${EMAIL1.address}?`)).toBeVisible();
const confirmRemoveButton = screen.getByRole("button", { name: "Remove" });
const confirmRemoveButton = screen.getByRole("button", { name: /Remove/ });
await userEvent.click(confirmRemoveButton);
expect(client.deleteThreePid).toHaveBeenCalledWith(ThreepidMedium.Email, EMAIL1.address);
@ -347,12 +347,12 @@ describe("AddRemoveThreepids", () => {
},
);
const removeButton = screen.getByRole("button", { name: "Remove" });
const removeButton = screen.getByRole("button", { name: /Remove/ });
await userEvent.click(removeButton);
expect(screen.getByText(`Remove ${EMAIL1.address}?`)).toBeVisible();
const confirmRemoveButton = screen.getByRole("button", { name: "Cancel" });
const confirmRemoveButton = screen.getByRole("button", { name: /Cancel/ });
await userEvent.click(confirmRemoveButton);
expect(screen.queryByText(`Remove ${EMAIL1.address}?`)).not.toBeInTheDocument();
@ -376,12 +376,12 @@ describe("AddRemoveThreepids", () => {
},
);
const removeButton = screen.getByRole("button", { name: "Remove" });
const removeButton = screen.getByRole("button", { name: /Remove/ });
await userEvent.click(removeButton);
expect(screen.getByText(`Remove ${PHONE1.address}?`)).toBeVisible();
const confirmRemoveButton = screen.getByRole("button", { name: "Remove" });
const confirmRemoveButton = screen.getByRole("button", { name: /Remove/ });
await userEvent.click(confirmRemoveButton);
expect(client.deleteThreePid).toHaveBeenCalledWith(ThreepidMedium.Phone, PHONE1.address);
@ -408,7 +408,7 @@ describe("AddRemoveThreepids", () => {
);
expect(screen.getByText(EMAIL1.address)).toBeVisible();
const shareButton = screen.getByRole("button", { name: "Share" });
const shareButton = screen.getByRole("button", { name: /Share/ });
await userEvent.click(shareButton);
expect(screen.getByText("Verify the link in your inbox")).toBeVisible();
@ -421,7 +421,7 @@ describe("AddRemoveThreepids", () => {
MOCK_IDENTITY_ACCESS_TOKEN,
);
const completeButton = screen.getByRole("button", { name: "Complete" });
const completeButton = screen.getByRole("button", { name: /Complete/ });
await userEvent.click(completeButton);
expect(client.bindThreePid).toHaveBeenCalledWith({
@ -459,7 +459,7 @@ describe("AddRemoveThreepids", () => {
);
expect(screen.getByText(PHONE1.address)).toBeVisible();
const shareButton = screen.getByRole("button", { name: "Share" });
const shareButton = screen.getByRole("button", { name: /Share/ });
await userEvent.click(shareButton);
expect(screen.getByText("Please enter verification code sent via text.")).toBeVisible();
@ -503,7 +503,7 @@ describe("AddRemoveThreepids", () => {
);
expect(screen.getByText(EMAIL1.address)).toBeVisible();
const revokeButton = screen.getByRole("button", { name: "Revoke" });
const revokeButton = screen.getByRole("button", { name: /Revoke/ });
await userEvent.click(revokeButton);
expect(client.unbindThreePid).toHaveBeenCalledWith(ThreepidMedium.Email, EMAIL1.address);
@ -526,7 +526,7 @@ describe("AddRemoveThreepids", () => {
);
expect(screen.getByText(PHONE1.address)).toBeVisible();
const revokeButton = screen.getByRole("button", { name: "Revoke" });
const revokeButton = screen.getByRole("button", { name: /Revoke/ });
await userEvent.click(revokeButton);
expect(client.unbindThreePid).toHaveBeenCalledWith(ThreepidMedium.Phone, PHONE1.address);