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

Make tests more resilient for React 18 upgrade (#12861)

Browse source 
* Make tests more resilient for React 18 upgrade

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

* Iterate

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

* Iterate

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

* Iterate

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

* Iterate

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

* Delint

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2024-08-06 18:22:02 +01:00 • committed by GitHub
parent 4e4c5c7768
commit 8285283cc3
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
35 changed files with 313 additions and 290 deletions
Download patch file Download diff file Expand all files Collapse all files

80
test/components/views/settings/tabs/user/SessionManagerTab-test.tsx
View file

@ -15,7 +15,16 @@ limitations under the License.
*/
import React from "react";
import { act, fireEvent, render, RenderResult, screen } from "@testing-library/react";
import {
act,
fireEvent,
render,
RenderResult,
screen,
waitFor,
waitForElementToBeRemoved,
within,
} from "@testing-library/react";
import { DeviceInfo } from "matrix-js-sdk/src/crypto/deviceinfo";
import { logger } from "matrix-js-sdk/src/logger";
import { CryptoApi, DeviceVerificationStatus, VerificationRequest } from "matrix-js-sdk/src/crypto-api";
@ -146,7 +155,7 @@ describe("<SessionManagerTab />", () => {
// open device detail
const tile = getByTestId(`device-tile-${deviceId}`);
const label = isOpen ? "Hide details" : "Show details";
const toggle = tile.querySelector(`[aria-label="${label}"]`) as Element;
const toggle = within(tile).getByLabelText(label);
fireEvent.click(toggle);
};
@ -165,16 +174,14 @@ describe("<SessionManagerTab />", () => {
return getByTestId(`device-tile-${deviceId}`);
};
const setFilter = async (container: HTMLElement, option: DeviceSecurityVariation | string) =>
await act(async () => {
const dropdown = container.querySelector('[aria-label="Filter devices"]');
const setFilter = async (container: HTMLElement, option: DeviceSecurityVariation | string) => {
const dropdown = within(container).getByLabelText("Filter devices");
fireEvent.click(dropdown as Element);
// tick to let dropdown render
await flushPromises();
fireEvent.click(dropdown);
screen.getByRole("listbox");
fireEvent.click(container.querySelector(`#device-list-filter__${option}`) as Element);
});
fireEvent.click(screen.getByTestId(`filter-option-${option}`) as Element);
};
const isDeviceSelected = (
getByTestId: ReturnType<typeof render>["getByTestId"],
@ -920,37 +927,31 @@ describe("<SessionManagerTab />", () => {
it("deletes a device when interactive auth is not required", async () => {
mockClient.deleteMultipleDevices.mockResolvedValue({});
mockClient.getDevices
.mockResolvedValueOnce({
devices: [alicesDevice, alicesMobileDevice, alicesOlderMobileDevice],
})
// pretend it was really deleted on refresh
.mockResolvedValueOnce({
devices: [alicesDevice, alicesOlderMobileDevice],
});
const { getByTestId } = render(getComponent());
await act(async () => {
await flushPromises();
mockClient.getDevices.mockResolvedValue({
devices: [alicesDevice, alicesMobileDevice, alicesOlderMobileDevice],
});
toggleDeviceDetails(getByTestId, alicesMobileDevice.device_id);
const { getByTestId, findByTestId } = render(getComponent());
const deviceDetails = getByTestId(`device-detail-${alicesMobileDevice.device_id}`);
const signOutButton = deviceDetails.querySelector(
'[data-testid="device-detail-sign-out-cta"]',
) as Element;
fireEvent.click(signOutButton);
await waitForElementToBeRemoved(() => screen.queryAllByRole("progressbar"));
await toggleDeviceDetails(getByTestId, alicesMobileDevice.device_id);
await confirmSignout(getByTestId);
const signOutButton = await within(
await findByTestId(`device-detail-${alicesMobileDevice.device_id}`),
).findByTestId("device-detail-sign-out-cta");
// pretend it was really deleted on refresh
mockClient.getDevices.mockResolvedValueOnce({
devices: [alicesDevice, alicesOlderMobileDevice],
});
// sign out button is disabled with spinner
expect(
(deviceDetails.querySelector('[data-testid="device-detail-sign-out-cta"]') as Element).getAttribute(
"aria-disabled",
),
).toEqual("true");
const prom = waitFor(() => expect(signOutButton).toHaveAttribute("aria-disabled", "true"));
fireEvent.click(signOutButton);
await confirmSignout(getByTestId);
await prom;
// delete called
expect(mockClient.deleteMultipleDevices).toHaveBeenCalledWith(
[alicesMobileDevice.device_id],
@ -1008,9 +1009,7 @@ describe("<SessionManagerTab />", () => {
const { getByTestId, getByLabelText } = render(getComponent());
await act(async () => {
await flushPromises();
});
await act(flushPromises);
// reset mock count after initial load
mockClient.getDevices.mockClear();
@ -1570,9 +1569,7 @@ describe("<SessionManagerTab />", () => {
});
const { getByTestId, container } = render(getComponent());
await act(async () => {
await flushPromises();
});
await act(flushPromises);
// filter for inactive sessions
await setFilter(container, DeviceSecurityVariation.Inactive);
@ -1765,6 +1762,7 @@ describe("<SessionManagerTab />", () => {
await flushPromises();
fireEvent.click(getByText("Show QR code"));
await waitForElementToBeRemoved(() => screen.queryAllByRole("progressbar"));
await expect(findByTestId("login-with-qr")).resolves.toBeTruthy();
});