mirrors/element-web
1
0
Fork 0
mirror of https://github.com/element-hq/element-web synced 2024-11-21 16:55:34 +03:00
Code Issues Projects Releases Packages Wiki Activity

Update to React 18 (#24763)

Browse source 
* Upgrade target to es2021

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

* Upgrade target to es2021

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

* Upgrade to es2022

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

* Upgrade to es2022

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

* Fix babel config

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

* Fix babel config

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

* Fix React contexts

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

* Fix types

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

* Fix React state

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

* Iterate

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

* Update to React 18

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

* Update to React 18

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>

* Iterate

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

* Iterate

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

* Install @testing-library/dom

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>

* Iterate

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

* Update lockfile

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>

* 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>

* 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>

* Yarn lock update

* 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>

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski 2024-10-21 14:50:06 +01:00 committed by GitHub
parent 772019711d
commit d8800ef987
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
81 changed files with 1056 additions and 1403 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

23
package.json
View file

@ -74,13 +74,9 @@
"update:jitsi": "curl -s https://meet.element.io/libs/external_api.min.js > ./res/jitsi_external_api.min.js" "update:jitsi": "curl -s https://meet.element.io/libs/external_api.min.js > ./res/jitsi_external_api.min.js"
}, },
"resolutions": { "resolutions": {
"@types/react-dom": "17.0.25",
"@types/react": "17.0.83",
"@types/seedrandom": "3.0.8", "@types/seedrandom": "3.0.8",
"oidc-client-ts": "3.1.0", "oidc-client-ts": "3.1.0",
"jwt-decode": "4.0.0", "jwt-decode": "4.0.0",
"@floating-ui/react": "0.26.11",
"@radix-ui/react-id": "1.1.0",
"caniuse-lite": "1.0.30001668", "caniuse-lite": "1.0.30001668",
"wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0", "wrap-ansi-cjs": "npm:wrap-ansi@^7.0.0",
"wrap-ansi": "npm:wrap-ansi@^7.0.0" "wrap-ansi": "npm:wrap-ansi@^7.0.0"
@ -94,7 +90,6 @@
"@matrix-org/react-sdk-module-api": "^2.4.0", "@matrix-org/react-sdk-module-api": "^2.4.0",
"@matrix-org/spec": "^1.7.0", "@matrix-org/spec": "^1.7.0",
"@sentry/browser": "^8.0.0", "@sentry/browser": "^8.0.0",
"@testing-library/react-hooks": "^8.0.1",
"@vector-im/compound-design-tokens": "^1.8.0", "@vector-im/compound-design-tokens": "^1.8.0",
"@vector-im/compound-web": "^7.1.0", "@vector-im/compound-web": "^7.1.0",
"@zxcvbn-ts/core": "^3.0.4", "@zxcvbn-ts/core": "^3.0.4",
@ -141,10 +136,10 @@
"posthog-js": "1.157.2", "posthog-js": "1.157.2",
"qrcode": "1.5.4", "qrcode": "1.5.4",
"re-resizable": "6.9.17", "re-resizable": "6.9.17",
"react": "17.0.2", "react": "^18.3.1",
"react-beautiful-dnd": "^13.1.0", "react-beautiful-dnd": "^13.1.0",
"react-blurhash": "^0.3.0", "react-blurhash": "^0.3.0",
"react-dom": "17.0.2", "react-dom": "^18.3.1",
"react-focus-lock": "^2.5.1", "react-focus-lock": "^2.5.1",
"react-transition-group": "^4.4.1", "react-transition-group": "^4.4.1",
"rfc4648": "^1.4.0", "rfc4648": "^1.4.0",
@ -186,10 +181,10 @@
"@sentry/webpack-plugin": "^2.7.1", "@sentry/webpack-plugin": "^2.7.1",
"@stylistic/eslint-plugin": "^2.9.0", "@stylistic/eslint-plugin": "^2.9.0",
"@svgr/webpack": "^8.0.0", "@svgr/webpack": "^8.0.0",
"@testing-library/dom": "^9.0.0", "@testing-library/dom": "^10.4.0",
"@testing-library/jest-dom": "^6.0.0", "@testing-library/jest-dom": "^6.4.8",
"@testing-library/react": "^12.1.5", "@testing-library/react": "^16.0.0",
"@testing-library/user-event": "^14.4.3", "@testing-library/user-event": "^14.5.2",
"@types/commonmark": "^0.27.4", "@types/commonmark": "^0.27.4",
"@types/content-type": "^1.1.5", "@types/content-type": "^1.1.5",
"@types/counterpart": "^0.18.1", "@types/counterpart": "^0.18.1",
@ -211,9 +206,9 @@
"@types/node-fetch": "^2.6.2", "@types/node-fetch": "^2.6.2",
"@types/pako": "^2.0.0", "@types/pako": "^2.0.0",
"@types/qrcode": "^1.3.5", "@types/qrcode": "^1.3.5",
"@types/react": "17.0.83", "@types/react": "18.3.3",
"@types/react-beautiful-dnd": "^13.0.0", "@types/react-beautiful-dnd": "^13.0.0",
"@types/react-dom": "17.0.25", "@types/react-dom": "18.3.0",
"@types/react-transition-group": "^4.4.0", "@types/react-transition-group": "^4.4.0",
"@types/sanitize-html": "2.13.0", "@types/sanitize-html": "2.13.0",
"@types/sdp-transform": "^2.4.6", "@types/sdp-transform": "^2.4.6",
@ -260,7 +255,7 @@
"husky": "^9.0.0", "husky": "^9.0.0",
"jest": "^29.6.2", "jest": "^29.6.2",
"jest-canvas-mock": "^2.5.2", "jest-canvas-mock": "^2.5.2",
"jest-environment-jsdom": "^29.6.2", "jest-environment-jsdom": "^29.7.0",
"jest-mock": "^29.6.2", "jest-mock": "^29.6.2",
"jest-raw-loader": "^1.0.1", "jest-raw-loader": "^1.0.1",
"jsqr": "^1.4.0", "jsqr": "^1.4.0",

2
playwright/element-web-test.ts
View file

@ -224,7 +224,7 @@ export const test = base.extend<{
}, },
axe: async ({ page }, use) => { axe: async ({ page }, use) => {
await use(new AxeBuilder({ page }).exclude("[id^='floating-ui-']")); await use(new AxeBuilder({ page }).exclude("[data-floating-ui-portal]"));
}, },
checkA11y: async ({ axe }, use, testInfo) => checkA11y: async ({ axe }, use, testInfo) =>
use(async () => { use(async () => {

2
playwright/pages/ElementAppPage.ts
View file

@ -188,6 +188,6 @@ export class ElementAppPage {
"Element has no aria-labelledby or aria-describedy attributes! The tooltip should have added either one of these.", "Element has no aria-labelledby or aria-describedy attributes! The tooltip should have added either one of these.",
); );
} }
return this.page.locator(`#${labelledById ?? describedById}`); return this.page.locator(`id=${labelledById ?? describedById}`);
} }
} }

2
scripts/make-react-component.js
View file

@ -32,7 +32,7 @@ export default %%ComponentName%%;
`, `,
TEST: ` TEST: `
import React from "react"; import React from "react";
import { render } from "@testing-library/react"; import { render } from "jest-matrix-react";
import %%ComponentName%% from '%%RelativeComponentPath%%'; import %%ComponentName%% from '%%RelativeComponentPath%%';

3
src/@types/react.d.ts vendored
View file

@ -13,4 +13,7 @@ declare module "react" {
function forwardRef<T, P = {}>( function forwardRef<T, P = {}>(
render: (props: PropsWithChildren<P>, ref: React.ForwardedRef<T>) => React.ReactElement | null, render: (props: PropsWithChildren<P>, ref: React.ForwardedRef<T>) => React.ReactElement | null,
): (props: P & React.RefAttributes<T>) => React.ReactElement | null; ): (props: P & React.RefAttributes<T>) => React.ReactElement | null;
// Fix lazy types - https://stackoverflow.com/a/71017028
function lazy<T extends ComponentType<any>>(factory: () => Promise<{ default: T }>): T;
} }

9
src/NodeAnimator.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. Please see LICENSE files in the repository root for full details.
*/ */
import React, { Key, MutableRefObject, ReactElement, ReactFragment, ReactInstance, ReactPortal } from "react"; import React, { Key, MutableRefObject, ReactElement, ReactInstance } from "react";
import ReactDom from "react-dom"; import ReactDom from "react-dom";
interface IChildProps { interface IChildProps {
@ -24,7 +24,7 @@ interface IProps {
innerRef?: MutableRefObject<any>; innerRef?: MutableRefObject<any>;
} }
function isReactElement(c: ReactElement | ReactFragment | ReactPortal): c is ReactElement { function isReactElement(c: ReturnType<(typeof React.Children)["toArray"]>[number]): c is ReactElement {
return typeof c === "object" && "type" in c; return typeof c === "object" && "type" in c;
} }
@ -99,7 +99,8 @@ export default class NodeAnimator extends React.Component<IProps> {
} }
private collectNode(k: Key, node: React.ReactInstance, restingStyle: React.CSSProperties): void { private collectNode(k: Key, node: React.ReactInstance, restingStyle: React.CSSProperties): void {
if (node && this.nodes[k] === undefined && this.props.startStyles.length > 0) { const key = typeof k === "bigint" ? Number(k) : k;
if (node && this.nodes[key] === undefined && this.props.startStyles.length > 0) {
const startStyles = this.props.startStyles; const startStyles = this.props.startStyles;
const domNode = ReactDom.findDOMNode(node); const domNode = ReactDom.findDOMNode(node);
// start from startStyle 1: 0 is the one we gave it // start from startStyle 1: 0 is the one we gave it
@ -113,7 +114,7 @@ export default class NodeAnimator extends React.Component<IProps> {
this.applyStyles(domNode as HTMLElement, restingStyle); this.applyStyles(domNode as HTMLElement, restingStyle);
}, 0); }, 0);
} }
this.nodes[k] = node; this.nodes[key] = node;
if (this.props.innerRef) { if (this.props.innerRef) {
this.props.innerRef.current = node; this.props.innerRef.current = node;

1
src/async-components/structures/ErrorView.tsx
View file

@ -25,6 +25,7 @@ interface IProps {
title: string; title: string;
messages?: string[]; messages?: string[];
footer?: ReactNode; footer?: ReactNode;
children?: ReactNode;
} }
export const ErrorView: React.FC<IProps> = ({ title, messages, footer, children }) => { export const ErrorView: React.FC<IProps> = ({ title, messages, footer, children }) => {

2
src/components/views/auth/VectorAuthPage.tsx
View file

@ -10,7 +10,7 @@ import * as React from "react";
import SdkConfig from "../../../SdkConfig"; import SdkConfig from "../../../SdkConfig";
import VectorAuthFooter from "./VectorAuthFooter"; import VectorAuthFooter from "./VectorAuthFooter";
export default class VectorAuthPage extends React.PureComponent { export default class VectorAuthPage extends React.PureComponent<React.PropsWithChildren> {
private static welcomeBackgroundUrl?: string; private static welcomeBackgroundUrl?: string;
// cache the url as a static to prevent it changing without refreshing // cache the url as a static to prevent it changing without refreshing

1
src/components/views/dialogs/BaseDialog.tsx
View file

@ -120,7 +120,6 @@ export default class BaseDialog extends React.Component<IProps> {
onClick={this.onCancelClick} onClick={this.onCancelClick}
className="mx_Dialog_cancelButton" className="mx_Dialog_cancelButton"
aria-label={_t("dialog_close_label")} aria-label={_t("dialog_close_label")}
title={_t("action|close")}
placement="bottom" placement="bottom"
/> />
); );

2
src/languageHandler.tsx
View file

@ -436,7 +436,7 @@ export function replaceByRegexes(text: string, mapping: IVariables | Tags): stri
} }
if (shouldWrapInSpan) { if (shouldWrapInSpan) {
return React.createElement("span", null, ...output); return React.createElement("span", null, ...(output as Array<number | string | React.ReactNode>));
} else { } else {
return output.join(""); return output.join("");
} }

7
test/setupTests.ts
View file

@ -13,6 +13,13 @@ import { mocked } from "jest-mock";
import { PredictableRandom } from "./test-utils/predictableRandom"; // https://github.com/jsdom/jsdom/issues/2555 import { PredictableRandom } from "./test-utils/predictableRandom"; // https://github.com/jsdom/jsdom/issues/2555
declare global {
// eslint-disable-next-line no-var
var IS_REACT_ACT_ENVIRONMENT: boolean;
}
globalThis.IS_REACT_ACT_ENVIRONMENT = true;
// Fake random strings to give a predictable snapshot for IDs // Fake random strings to give a predictable snapshot for IDs
jest.mock("matrix-js-sdk/src/randomstring"); jest.mock("matrix-js-sdk/src/randomstring");
beforeEach(() => { beforeEach(() => {

1
test/test-utils/jest-matrix-react.tsx
View file

@ -27,6 +27,7 @@ const wrapWithTooltipProvider = (Wrapper: RenderOptions["wrapper"]) => {
const customRender = (ui: ReactElement, options: RenderOptions = {}) => { const customRender = (ui: ReactElement, options: RenderOptions = {}) => {
return render(ui, { return render(ui, {
legacyRoot: true,
...options, ...options,
wrapper: wrapWithTooltipProvider(options?.wrapper) as RenderOptions["wrapper"], wrapper: wrapWithTooltipProvider(options?.wrapper) as RenderOptions["wrapper"],
}) as ReturnType<typeof render>; }) as ReturnType<typeof render>;

19
test/unit-tests/async-components/dialogs/security/NewRecoveryMethodDialog-test.tsx
View file

@ -7,10 +7,9 @@
import React from "react"; import React from "react";
import { MatrixClient } from "matrix-js-sdk/src/matrix"; import { MatrixClient } from "matrix-js-sdk/src/matrix";
import { render, screen } from "jest-matrix-react"; import { render, screen, act } from "jest-matrix-react";
import { waitFor } from "@testing-library/dom"; import { waitFor } from "@testing-library/dom";
import userEvent from "@testing-library/user-event"; import userEvent from "@testing-library/user-event";
import { act } from "@testing-library/react-hooks/dom";
import NewRecoveryMethodDialog from "../../../../../src/async-components/views/dialogs/security/NewRecoveryMethodDialog"; import NewRecoveryMethodDialog from "../../../../../src/async-components/views/dialogs/security/NewRecoveryMethodDialog";
import { createTestClient } from "../../../../test-utils"; import { createTestClient } from "../../../../test-utils";
@ -55,15 +54,13 @@ describe("<NewRecoveryMethodDialog />", () => {
const onFinished = jest.fn(); const onFinished = jest.fn();
await act(async () => { const { asFragment } = renderComponent(onFinished);
const { asFragment } = renderComponent(onFinished); await waitFor(() =>
await waitFor(() => expect(
expect( screen.getByText("This session is encrypting history using the new recovery method."),
screen.getByText("This session is encrypting history using the new recovery method."), ).toBeInTheDocument(),
).toBeInTheDocument(), );
); expect(asFragment()).toMatchSnapshot();
expect(asFragment()).toMatchSnapshot();
});
await userEvent.click(screen.getByRole("button", { name: "Set up Secure Messages" })); await userEvent.click(screen.getByRole("button", { name: "Set up Secure Messages" }));
expect(onFinished).toHaveBeenCalled(); expect(onFinished).toHaveBeenCalled();

13
test/unit-tests/components/structures/MatrixChat-test.tsx
View file

@ -55,7 +55,7 @@ import * as Lifecycle from "../../../../src/Lifecycle";
import { SSO_HOMESERVER_URL_KEY, SSO_ID_SERVER_URL_KEY } from "../../../../src/BasePlatform"; import { SSO_HOMESERVER_URL_KEY, SSO_ID_SERVER_URL_KEY } from "../../../../src/BasePlatform";
import SettingsStore from "../../../../src/settings/SettingsStore"; import SettingsStore from "../../../../src/settings/SettingsStore";
import { SettingLevel } from "../../../../src/settings/SettingLevel"; import { SettingLevel } from "../../../../src/settings/SettingLevel";
import { MatrixClientPeg, MatrixClientPeg as peg } from "../../../../src/MatrixClientPeg"; import { MatrixClientPeg } from "../../../../src/MatrixClientPeg";
import DMRoomMap from "../../../../src/utils/DMRoomMap"; import DMRoomMap from "../../../../src/utils/DMRoomMap";
import { ReleaseAnnouncementStore } from "../../../../src/stores/ReleaseAnnouncementStore"; import { ReleaseAnnouncementStore } from "../../../../src/stores/ReleaseAnnouncementStore";
import { DRAFT_LAST_CLEANUP_KEY } from "../../../../src/DraftCleaner"; import { DRAFT_LAST_CLEANUP_KEY } from "../../../../src/DraftCleaner";
@ -933,17 +933,13 @@ describe("<MatrixChat />", () => {
// but as the exception was swallowed, the test was passing (see in `initClientCrypto`). // but as the exception was swallowed, the test was passing (see in `initClientCrypto`).
// There are several uses of the peg in the app, so during all these tests you might end-up // There are several uses of the peg in the app, so during all these tests you might end-up
// with a real client instead of the mocked one. Not sure how reliable all these tests are. // with a real client instead of the mocked one. Not sure how reliable all these tests are.
const originalReplace = peg.replaceUsingCreds; jest.spyOn(MatrixClientPeg, "replaceUsingCreds");
peg.replaceUsingCreds = jest.fn().mockResolvedValue(mockClient); jest.spyOn(MatrixClientPeg, "get").mockReturnValue(mockClient);
// @ts-ignore - need to mock this for the test
peg.matrixClient = mockClient;
const result = getComponent(); const result = getComponent();
await result.findByText("You're signed out"); await result.findByText("You're signed out");
expect(result.container).toMatchSnapshot(); expect(result.container).toMatchSnapshot();
peg.replaceUsingCreds = originalReplace;
}); });
}); });
@ -1492,8 +1488,6 @@ describe("<MatrixChat />", () => {
action: "start_mobile_registration", action: "start_mobile_registration",
}); });
await flushPromises();
return renderResult; return renderResult;
}; };
@ -1514,6 +1508,7 @@ describe("<MatrixChat />", () => {
enabledMobileRegistration(); enabledMobileRegistration();
await getComponentAndWaitForReady(); await getComponentAndWaitForReady();
await flushPromises();
expect(screen.getByTestId("mobile-register")).toBeInTheDocument(); expect(screen.getByTestId("mobile-register")).toBeInTheDocument();
}); });

2
test/unit-tests/components/structures/__snapshots__/FilePanel-test.tsx.snap
View file

@ -19,7 +19,7 @@ exports[`FilePanel renders empty state 1`] = `
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"

50
test/unit-tests/components/structures/__snapshots__/RoomView-test.tsx.snap
View file

@ -62,7 +62,7 @@ exports[`RoomView for a local room in state CREATING should match the snapshot 1
style="--cpd-icon-button-size: 100%;" style="--cpd-icon-button-size: 100%;"
> >
<svg <svg
aria-labelledby="floating-ui-364" aria-labelledby=":rbc:"
fill="currentColor" fill="currentColor"
height="1em" height="1em"
viewBox="0 0 24 24" viewBox="0 0 24 24"
@ -78,7 +78,7 @@ exports[`RoomView for a local room in state CREATING should match the snapshot 1
<button <button
aria-disabled="false" aria-disabled="false"
aria-label="Voice call" aria-label="Voice call"
aria-labelledby="floating-ui-369" aria-labelledby=":rbh:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -103,7 +103,7 @@ exports[`RoomView for a local room in state CREATING should match the snapshot 1
</button> </button>
<button <button
aria-label="Room info" aria-label="Room info"
aria-labelledby="floating-ui-374" aria-labelledby=":rbm:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -128,7 +128,7 @@ exports[`RoomView for a local room in state CREATING should match the snapshot 1
</button> </button>
<button <button
aria-label="Threads" aria-label="Threads"
aria-labelledby="floating-ui-379" aria-labelledby=":rbr:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -157,7 +157,7 @@ exports[`RoomView for a local room in state CREATING should match the snapshot 1
> >
<div <div
aria-label="2 members" aria-label="2 members"
aria-labelledby="floating-ui-384" aria-labelledby=":rc0:"
class="mx_AccessibleButton mx_FacePile" class="mx_AccessibleButton mx_FacePile"
role="button" role="button"
tabindex="0" tabindex="0"
@ -280,7 +280,7 @@ exports[`RoomView for a local room in state ERROR should match the snapshot 1`]
style="--cpd-icon-button-size: 100%;" style="--cpd-icon-button-size: 100%;"
> >
<svg <svg
aria-labelledby="floating-ui-394" aria-labelledby=":rca:"
fill="currentColor" fill="currentColor"
height="1em" height="1em"
viewBox="0 0 24 24" viewBox="0 0 24 24"
@ -296,7 +296,7 @@ exports[`RoomView for a local room in state ERROR should match the snapshot 1`]
<button <button
aria-disabled="false" aria-disabled="false"
aria-label="Voice call" aria-label="Voice call"
aria-labelledby="floating-ui-399" aria-labelledby=":rcf:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -321,7 +321,7 @@ exports[`RoomView for a local room in state ERROR should match the snapshot 1`]
</button> </button>
<button <button
aria-label="Room info" aria-label="Room info"
aria-labelledby="floating-ui-404" aria-labelledby=":rck:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -346,7 +346,7 @@ exports[`RoomView for a local room in state ERROR should match the snapshot 1`]
</button> </button>
<button <button
aria-label="Threads" aria-label="Threads"
aria-labelledby="floating-ui-409" aria-labelledby=":rcp:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -375,7 +375,7 @@ exports[`RoomView for a local room in state ERROR should match the snapshot 1`]
> >
<div <div
aria-label="2 members" aria-label="2 members"
aria-labelledby="floating-ui-414" aria-labelledby=":rcu:"
class="mx_AccessibleButton mx_FacePile" class="mx_AccessibleButton mx_FacePile"
role="button" role="button"
tabindex="0" tabindex="0"
@ -583,7 +583,7 @@ exports[`RoomView for a local room in state NEW should match the snapshot 1`] =
style="--cpd-icon-button-size: 100%;" style="--cpd-icon-button-size: 100%;"
> >
<svg <svg
aria-labelledby="floating-ui-224" aria-labelledby=":r70:"
fill="currentColor" fill="currentColor"
height="1em" height="1em"
viewBox="0 0 24 24" viewBox="0 0 24 24"
@ -599,7 +599,7 @@ exports[`RoomView for a local room in state NEW should match the snapshot 1`] =
<button <button
aria-disabled="false" aria-disabled="false"
aria-label="Voice call" aria-label="Voice call"
aria-labelledby="floating-ui-229" aria-labelledby=":r75:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -624,7 +624,7 @@ exports[`RoomView for a local room in state NEW should match the snapshot 1`] =
</button> </button>
<button <button
aria-label="Room info" aria-label="Room info"
aria-labelledby="floating-ui-234" aria-labelledby=":r7a:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -649,7 +649,7 @@ exports[`RoomView for a local room in state NEW should match the snapshot 1`] =
</button> </button>
<button <button
aria-label="Threads" aria-label="Threads"
aria-labelledby="floating-ui-239" aria-labelledby=":r7f:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -678,7 +678,7 @@ exports[`RoomView for a local room in state NEW should match the snapshot 1`] =
> >
<div <div
aria-label="2 members" aria-label="2 members"
aria-labelledby="floating-ui-244" aria-labelledby=":r7k:"
class="mx_AccessibleButton mx_FacePile" class="mx_AccessibleButton mx_FacePile"
role="button" role="button"
tabindex="0" tabindex="0"
@ -963,7 +963,7 @@ exports[`RoomView for a local room in state NEW that is encrypted should match t
style="--cpd-icon-button-size: 100%;" style="--cpd-icon-button-size: 100%;"
> >
<svg <svg
aria-labelledby="floating-ui-294" aria-labelledby=":r96:"
fill="currentColor" fill="currentColor"
height="1em" height="1em"
viewBox="0 0 24 24" viewBox="0 0 24 24"
@ -979,7 +979,7 @@ exports[`RoomView for a local room in state NEW that is encrypted should match t
<button <button
aria-disabled="false" aria-disabled="false"
aria-label="Voice call" aria-label="Voice call"
aria-labelledby="floating-ui-299" aria-labelledby=":r9b:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -1004,7 +1004,7 @@ exports[`RoomView for a local room in state NEW that is encrypted should match t
</button> </button>
<button <button
aria-label="Room info" aria-label="Room info"
aria-labelledby="floating-ui-304" aria-labelledby=":r9g:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -1029,7 +1029,7 @@ exports[`RoomView for a local room in state NEW that is encrypted should match t
</button> </button>
<button <button
aria-label="Threads" aria-label="Threads"
aria-labelledby="floating-ui-309" aria-labelledby=":r9l:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -1058,7 +1058,7 @@ exports[`RoomView for a local room in state NEW that is encrypted should match t
> >
<div <div
aria-label="2 members" aria-label="2 members"
aria-labelledby="floating-ui-314" aria-labelledby=":r9q:"
class="mx_AccessibleButton mx_FacePile" class="mx_AccessibleButton mx_FacePile"
role="button" role="button"
tabindex="0" tabindex="0"
@ -1370,7 +1370,7 @@ exports[`RoomView video rooms should render joined video room view 1`] = `
> >
<button <button
aria-label="Room info" aria-label="Room info"
aria-labelledby="floating-ui-84" aria-labelledby=":r2k:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -1395,7 +1395,7 @@ exports[`RoomView video rooms should render joined video room view 1`] = `
</button> </button>
<button <button
aria-label="Chat" aria-label="Chat"
aria-labelledby="floating-ui-89" aria-labelledby=":r2p:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -1420,7 +1420,7 @@ exports[`RoomView video rooms should render joined video room view 1`] = `
</button> </button>
<button <button
aria-label="Threads" aria-label="Threads"
aria-labelledby="floating-ui-94" aria-labelledby=":r2u:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -1449,7 +1449,7 @@ exports[`RoomView video rooms should render joined video room view 1`] = `
> >
<div <div
aria-label="0 members" aria-label="0 members"
aria-labelledby="floating-ui-99" aria-labelledby=":r33:"
class="mx_AccessibleButton mx_FacePile" class="mx_AccessibleButton mx_FacePile"
role="button" role="button"
tabindex="0" tabindex="0"
@ -1487,7 +1487,7 @@ exports[`RoomView video rooms should render joined video room view 1`] = `
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-108" aria-labelledby=":r3c:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"

2
test/unit-tests/components/structures/__snapshots__/SpaceHierarchy-test.tsx.snap
View file

@ -393,7 +393,7 @@ exports[`SpaceHierarchy <SpaceHierarchy /> renders 1`] = `
Join Join
</div> </div>
<span <span
aria-labelledby="floating-ui-9" aria-labelledby=":r8:"
tabindex="0" tabindex="0"
> >
<span <span

4
test/unit-tests/components/structures/__snapshots__/ThreadPanel-test.tsx.snap
View file

@ -6,7 +6,7 @@ exports[`ThreadPanel Header expect that All filter for ThreadPanelHeader properl
class="mx_BaseCard_header_title" class="mx_BaseCard_header_title"
> >
<button <button
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 24px;" style="--cpd-icon-button-size: 24px;"
@ -41,7 +41,7 @@ exports[`ThreadPanel Header expect that My filter for ThreadPanelHeader properly
class="mx_BaseCard_header_title" class="mx_BaseCard_header_title"
> >
<button <button
aria-labelledby="floating-ui-6" aria-labelledby=":r6:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 24px;" style="--cpd-icon-button-size: 24px;"

4
test/unit-tests/components/views/avatars/__snapshots__/DecoratedRoomAvatar-test.tsx.snap
View file

@ -16,7 +16,7 @@ exports[`DecoratedRoomAvatar shows an avatar with globe icon and tooltip for pub
r r
</span> </span>
<div <div
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="mx_DecoratedRoomAvatar_icon mx_DecoratedRoomAvatar_icon_globe" class="mx_DecoratedRoomAvatar_icon mx_DecoratedRoomAvatar_icon_globe"
tabindex="0" tabindex="0"
/> />
@ -40,7 +40,7 @@ exports[`DecoratedRoomAvatar shows the presence indicator in a DM room that also
r r
</span> </span>
<div <div
aria-labelledby="floating-ui-6" aria-labelledby=":r6:"
class="mx_DecoratedRoomAvatar_icon mx_DecoratedRoomAvatar_icon_online" class="mx_DecoratedRoomAvatar_icon mx_DecoratedRoomAvatar_icon_online"
tabindex="0" tabindex="0"
/> />

6
test/unit-tests/components/views/avatars/__snapshots__/WithPresenceIndicator-test.tsx.snap
View file

@ -7,7 +7,7 @@ exports[`WithPresenceIndicator renders presence indicator with tooltip for DM ro
> >
<span /> <span />
<div <div
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="mx_WithPresenceIndicator_icon mx_WithPresenceIndicator_icon_online" class="mx_WithPresenceIndicator_icon mx_WithPresenceIndicator_icon_online"
style="width: 32px; height: 32px;" style="width: 32px; height: 32px;"
tabindex="0" tabindex="0"
@ -23,7 +23,7 @@ exports[`WithPresenceIndicator renders presence indicator with tooltip for DM ro
> >
<span /> <span />
<div <div
aria-labelledby="floating-ui-6" aria-labelledby=":r6:"
class="mx_WithPresenceIndicator_icon mx_WithPresenceIndicator_icon_offline" class="mx_WithPresenceIndicator_icon mx_WithPresenceIndicator_icon_offline"
style="width: 32px; height: 32px;" style="width: 32px; height: 32px;"
tabindex="0" tabindex="0"
@ -39,7 +39,7 @@ exports[`WithPresenceIndicator renders presence indicator with tooltip for DM ro
> >
<span /> <span />
<div <div
aria-labelledby="floating-ui-12" aria-labelledby=":rc:"
class="mx_WithPresenceIndicator_icon mx_WithPresenceIndicator_icon_away" class="mx_WithPresenceIndicator_icon mx_WithPresenceIndicator_icon_away"
style="width: 32px; height: 32px;" style="width: 32px; height: 32px;"
tabindex="0" tabindex="0"

2
test/unit-tests/components/views/beacon/__snapshots__/BeaconListItem-test.tsx.snap
View file

@ -32,7 +32,7 @@ exports[`<BeaconListItem /> when a beacon is live and has locations renders beac
class="mx_BeaconListItem_interactions" class="mx_BeaconListItem_interactions"
> >
<a <a
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
data-testid="open-location-in-osm" data-testid="open-location-in-osm"
href="https://www.openstreetmap.org/?mlat=51&mlon=41#map=16/51/41" href="https://www.openstreetmap.org/?mlat=51&mlon=41#map=16/51/41"
rel="noreferrer noopener" rel="noreferrer noopener"

6
test/unit-tests/components/views/beacon/__snapshots__/DialogSidebar-test.tsx.snap
View file

@ -47,9 +47,7 @@ exports[`<DialogSidebar /> renders sidebar correctly with beacons 1`] = `
data-type="round" data-type="round"
role="presentation" role="presentation"
style="--cpd-avatar-size: 32px;" style="--cpd-avatar-size: 32px;"
> />
</span>
<div <div
class="mx_BeaconListItem_info" class="mx_BeaconListItem_info"
> >
@ -74,7 +72,7 @@ exports[`<DialogSidebar /> renders sidebar correctly with beacons 1`] = `
class="mx_BeaconListItem_interactions" class="mx_BeaconListItem_interactions"
> >
<a <a
aria-labelledby="floating-ui-8" aria-labelledby=":r8:"
data-testid="open-location-in-osm" data-testid="open-location-in-osm"
href="https://www.openstreetmap.org/?mlat=51&mlon=41#map=16/51/41" href="https://www.openstreetmap.org/?mlat=51&mlon=41#map=16/51/41"
rel="noreferrer noopener" rel="noreferrer noopener"

2
test/unit-tests/components/views/beacon/__snapshots__/ShareLatestLocation-test.tsx.snap
View file

@ -3,7 +3,7 @@
exports[`<ShareLatestLocation /> renders share buttons when there is a location 1`] = ` exports[`<ShareLatestLocation /> renders share buttons when there is a location 1`] = `
<DocumentFragment> <DocumentFragment>
<a <a
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
data-testid="open-location-in-osm" data-testid="open-location-in-osm"
href="https://www.openstreetmap.org/?mlat=51&mlon=42#map=16/51/42" href="https://www.openstreetmap.org/?mlat=51&mlon=42#map=16/51/42"
rel="noreferrer noopener" rel="noreferrer noopener"

190
test/unit-tests/components/views/dialogs/SpotlightDialog-test.tsx
View file

@ -19,7 +19,7 @@ import {
} from "matrix-js-sdk/src/matrix"; } from "matrix-js-sdk/src/matrix";
import { KnownMembership } from "matrix-js-sdk/src/types"; import { KnownMembership } from "matrix-js-sdk/src/types";
import sanitizeHtml from "sanitize-html"; import sanitizeHtml from "sanitize-html";
import { fireEvent, render, screen } from "jest-matrix-react"; import { fireEvent, render, screen, waitFor } from "jest-matrix-react";
import SpotlightDialog from "../../../../../src/components/views/dialogs/spotlight/SpotlightDialog"; import SpotlightDialog from "../../../../../src/components/views/dialogs/spotlight/SpotlightDialog";
import { Filter } from "../../../../../src/components/views/dialogs/spotlight/Filter"; import { Filter } from "../../../../../src/components/views/dialogs/spotlight/Filter";
@ -149,6 +149,9 @@ describe("Spotlight Dialog", () => {
let mockedClient: MatrixClient; let mockedClient: MatrixClient;
beforeEach(() => { beforeEach(() => {
SdkConfig.reset();
localStorage.clear();
SettingsStore.reset();
mockedClient = mockClient({ rooms: [testPublicRoom], users: [testPerson] }); mockedClient = mockClient({ rooms: [testPublicRoom], users: [testPerson] });
testRoom = mkRoom(mockedClient, "!test23:example.com"); testRoom = mkRoom(mockedClient, "!test23:example.com");
mocked(testRoom.getMyMembership).mockReturnValue(KnownMembership.Join); mocked(testRoom.getMyMembership).mockReturnValue(KnownMembership.Join);
@ -193,10 +196,12 @@ describe("Spotlight Dialog", () => {
expect(filterChip).toBeInTheDocument(); expect(filterChip).toBeInTheDocument();
expect(filterChip.innerHTML).toContain("Public rooms"); expect(filterChip.innerHTML).toContain("Public rooms");
const content = document.querySelector("#mx_SpotlightDialog_content")!; await waitFor(() => {
const options = content.querySelectorAll("li.mx_SpotlightDialog_option"); const content = document.querySelector("#mx_SpotlightDialog_content")!;
expect(options.length).toBe(1); const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options[0].innerHTML).toContain(testPublicRoom.name); expect(options.length).toBe(1);
expect(options[0].innerHTML).toContain(testPublicRoom.name);
});
}); });
it("with people filter", async () => { it("with people filter", async () => {
@ -215,22 +220,18 @@ describe("Spotlight Dialog", () => {
expect(filterChip).toBeInTheDocument(); expect(filterChip).toBeInTheDocument();
expect(filterChip.innerHTML).toContain("People"); expect(filterChip.innerHTML).toContain("People");
const content = document.querySelector("#mx_SpotlightDialog_content")!; await waitFor(() => {
const options = content.querySelectorAll("li.mx_SpotlightDialog_option"); const content = document.querySelector("#mx_SpotlightDialog_content")!;
expect(options.length).toBeGreaterThanOrEqual(1); const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options[0]!.innerHTML).toContain(testPerson.display_name); expect(options.length).toBeGreaterThanOrEqual(1);
expect(options[0]!.innerHTML).toContain(testPerson.display_name);
});
}); });
}); });
describe("when MSC3946 dynamic room predecessors is enabled", () => { describe("when MSC3946 dynamic room predecessors is enabled", () => {
beforeEach(() => { beforeEach(async () => {
jest.spyOn(SettingsStore, "getValue").mockImplementation((settingName, roomId, excludeDefault) => { await SettingsStore.setValue("feature_dynamic_room_predecessors", null, SettingLevel.DEVICE, true);
if (settingName === "feature_dynamic_room_predecessors") {
return true;
} else {
return []; // SpotlightSearch.recentSearches
}
});
}); });
afterEach(() => { afterEach(() => {
@ -238,7 +239,7 @@ describe("Spotlight Dialog", () => {
}); });
it("should call getVisibleRooms with MSC3946 dynamic room predecessors", async () => { it("should call getVisibleRooms with MSC3946 dynamic room predecessors", async () => {
render(<SpotlightDialog onFinished={() => null} />); render(<SpotlightDialog onFinished={() => null} />, { legacyRoot: false });
jest.advanceTimersByTime(200); jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers(); await flushPromisesWithFakeTimers();
expect(mockedClient.getVisibleRooms).toHaveBeenCalledWith(true); expect(mockedClient.getVisibleRooms).toHaveBeenCalledWith(true);
@ -261,10 +262,12 @@ describe("Spotlight Dialog", () => {
expect(filterChip).toBeInTheDocument(); expect(filterChip).toBeInTheDocument();
expect(filterChip.innerHTML).toContain("Public rooms"); expect(filterChip.innerHTML).toContain("Public rooms");
const content = document.querySelector("#mx_SpotlightDialog_content")!; await waitFor(() => {
const options = content.querySelectorAll("li.mx_SpotlightDialog_option"); const content = document.querySelector("#mx_SpotlightDialog_content")!;
expect(options.length).toBe(1); const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options[0]!.innerHTML).toContain(testPublicRoom.name); expect(options.length).toBe(1);
expect(options[0]!.innerHTML).toContain(testPublicRoom.name);
});
// assert that getVisibleRooms is called without MSC3946 dynamic room predecessors // assert that getVisibleRooms is called without MSC3946 dynamic room predecessors
expect(mockedClient.getVisibleRooms).toHaveBeenCalledWith(false); expect(mockedClient.getVisibleRooms).toHaveBeenCalledWith(false);
@ -284,10 +287,12 @@ describe("Spotlight Dialog", () => {
expect(filterChip).toBeInTheDocument(); expect(filterChip).toBeInTheDocument();
expect(filterChip.innerHTML).toContain("People"); expect(filterChip.innerHTML).toContain("People");
const content = document.querySelector("#mx_SpotlightDialog_content")!; await waitFor(() => {
const options = content.querySelectorAll("li.mx_SpotlightDialog_option"); const content = document.querySelector("#mx_SpotlightDialog_content")!;
expect(options.length).toBeGreaterThanOrEqual(1); const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options[0]!.innerHTML).toContain(testPerson.display_name); expect(options.length).toBeGreaterThanOrEqual(1);
expect(options[0]!.innerHTML).toContain(testPerson.display_name);
});
}); });
}); });
@ -372,11 +377,13 @@ describe("Spotlight Dialog", () => {
jest.advanceTimersByTime(200); jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers(); await flushPromisesWithFakeTimers();
const content = document.querySelector("#mx_SpotlightDialog_content")!; await waitFor(() => {
const options = content.querySelectorAll("li.mx_SpotlightDialog_option"); const content = document.querySelector("#mx_SpotlightDialog_content")!;
expect(options.length).toBeGreaterThanOrEqual(2); const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options[0]).toHaveTextContent("User Alpha"); expect(options.length).toBeGreaterThanOrEqual(2);
expect(options[1]).toHaveTextContent("User Beta"); expect(options[0]).toHaveTextContent("User Alpha");
expect(options[1]).toHaveTextContent("User Beta");
});
}); });
it("should not filter out users sent by the server even if a local suggestion gets filtered out", async () => { it("should not filter out users sent by the server even if a local suggestion gets filtered out", async () => {
@ -397,11 +404,13 @@ describe("Spotlight Dialog", () => {
jest.advanceTimersByTime(200); jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers(); await flushPromisesWithFakeTimers();
const content = document.querySelector("#mx_SpotlightDialog_content")!; await waitFor(() => {
const options = content.querySelectorAll("li.mx_SpotlightDialog_option"); const content = document.querySelector("#mx_SpotlightDialog_content")!;
expect(options.length).toBeGreaterThanOrEqual(2); const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options[0]).toHaveTextContent(testPerson.display_name!); expect(options.length).toBeGreaterThanOrEqual(2);
expect(options[1]).toHaveTextContent("User Beta"); expect(options[0]).toHaveTextContent(testPerson.display_name!);
expect(options[1]).toHaveTextContent("User Beta");
});
}); });
it("show non-matching query members with DMs if they are present in the server search results", async () => { it("show non-matching query members with DMs if they are present in the server search results", async () => {
@ -419,11 +428,13 @@ describe("Spotlight Dialog", () => {
jest.advanceTimersByTime(200); jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers(); await flushPromisesWithFakeTimers();
const content = document.querySelector("#mx_SpotlightDialog_content")!; await waitFor(() => {
const options = content.querySelectorAll("li.mx_SpotlightDialog_option"); const content = document.querySelector("#mx_SpotlightDialog_content")!;
expect(options.length).toBeGreaterThanOrEqual(2); const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options[0]).toHaveTextContent(testDMUserId); expect(options.length).toBeGreaterThanOrEqual(2);
expect(options[1]).toHaveTextContent("Bob Wonder"); expect(options[0]).toHaveTextContent(testDMUserId);
expect(options[1]).toHaveTextContent("Bob Wonder");
});
}); });
it("don't sort the order of users sent by the server", async () => { it("don't sort the order of users sent by the server", async () => {
@ -441,11 +452,13 @@ describe("Spotlight Dialog", () => {
jest.advanceTimersByTime(200); jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers(); await flushPromisesWithFakeTimers();
const content = document.querySelector("#mx_SpotlightDialog_content")!; await waitFor(() => {
const options = content.querySelectorAll("li.mx_SpotlightDialog_option"); const content = document.querySelector("#mx_SpotlightDialog_content")!;
expect(options.length).toBeGreaterThanOrEqual(2); const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options[0]).toHaveTextContent("User Beta"); expect(options.length).toBeGreaterThanOrEqual(2);
expect(options[1]).toHaveTextContent("User Alpha"); expect(options[0]).toHaveTextContent("User Beta");
expect(options[1]).toHaveTextContent("User Alpha");
});
}); });
it("should start a DM when clicking a person", async () => { it("should start a DM when clicking a person", async () => {
@ -460,12 +473,13 @@ describe("Spotlight Dialog", () => {
jest.advanceTimersByTime(200); jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers(); await flushPromisesWithFakeTimers();
const options = document.querySelectorAll("li.mx_SpotlightDialog_option"); await waitFor(() => {
expect(options.length).toBeGreaterThanOrEqual(1); const options = document.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options[0]!.innerHTML).toContain(testPerson.display_name); expect(options.length).toBeGreaterThanOrEqual(1);
expect(options[0]!.innerHTML).toContain(testPerson.display_name);
fireEvent.click(options[0]!); fireEvent.click(options[0]!);
expect(startDmOnFirstMessage).toHaveBeenCalledWith(mockedClient, [new DirectoryMember(testPerson)]); expect(startDmOnFirstMessage).toHaveBeenCalledWith(mockedClient, [new DirectoryMember(testPerson)]);
});
}); });
it("should pass via of the server being explored when joining room from directory", async () => { it("should pass via of the server being explored when joining room from directory", async () => {
@ -481,20 +495,22 @@ describe("Spotlight Dialog", () => {
jest.advanceTimersByTime(200); jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers(); await flushPromisesWithFakeTimers();
const content = document.querySelector("#mx_SpotlightDialog_content")!; await waitFor(() => {
const options = content.querySelectorAll("li.mx_SpotlightDialog_option"); const content = document.querySelector("#mx_SpotlightDialog_content")!;
expect(options.length).toBe(1); const options = content.querySelectorAll("li.mx_SpotlightDialog_option");
expect(options[0].innerHTML).toContain(testPublicRoom.name); expect(options.length).toBe(1);
expect(options[0].innerHTML).toContain(testPublicRoom.name);
fireEvent.click(options[0].querySelector("[role='button']")!); fireEvent.click(options[0].querySelector("[role='button']")!);
expect(defaultDispatcher.dispatch).toHaveBeenCalledTimes(1); expect(defaultDispatcher.dispatch).toHaveBeenCalledTimes(1);
expect(defaultDispatcher.dispatch).toHaveBeenCalledWith( expect(defaultDispatcher.dispatch).toHaveBeenCalledWith(
expect.objectContaining({ expect.objectContaining({
action: "view_room", action: "view_room",
room_id: testPublicRoom.room_id, room_id: testPublicRoom.room_id,
via_servers: ["example.tld"], via_servers: ["example.tld"],
}), }),
); );
});
}); });
describe("nsfw public rooms filter", () => { describe("nsfw public rooms filter", () => {
@ -525,13 +541,9 @@ describe("Spotlight Dialog", () => {
guest_can_join: false, guest_can_join: false,
}; };
beforeEach(() => { beforeEach(async () => {
mockedClient = mockClient({ rooms: [nsfwNameRoom, nsfwTopicRoom, potatoRoom], users: [testPerson] }); mockedClient = mockClient({ rooms: [nsfwNameRoom, nsfwTopicRoom, potatoRoom], users: [testPerson] });
SettingsStore.setValue("SpotlightSearch.showNsfwPublicRooms", null, SettingLevel.DEVICE, false); await SettingsStore.setValue("SpotlightSearch.showNsfwPublicRooms", null, SettingLevel.DEVICE, false);
});
afterAll(() => {
SettingsStore.setValue("SpotlightSearch.showNsfwPublicRooms", null, SettingLevel.DEVICE, false);
}); });
it("does not display rooms with nsfw keywords in results when showNsfwPublicRooms is falsy", async () => { it("does not display rooms with nsfw keywords in results when showNsfwPublicRooms is falsy", async () => {
@ -541,22 +553,26 @@ describe("Spotlight Dialog", () => {
jest.advanceTimersByTime(200); jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers(); await flushPromisesWithFakeTimers();
expect(screen.getByText(potatoRoom.name!)).toBeInTheDocument(); await waitFor(() => {
expect(screen.queryByText(nsfwTopicRoom.name!)).not.toBeInTheDocument(); expect(screen.getByText(potatoRoom.name!)).toBeInTheDocument();
expect(screen.queryByText(nsfwTopicRoom.name!)).not.toBeInTheDocument(); expect(screen.queryByText(nsfwTopicRoom.name!)).not.toBeInTheDocument();
expect(screen.queryByText(nsfwTopicRoom.name!)).not.toBeInTheDocument();
});
}); });
it("displays rooms with nsfw keywords in results when showNsfwPublicRooms is truthy", async () => { it("displays rooms with nsfw keywords in results when showNsfwPublicRooms is truthy", async () => {
SettingsStore.setValue("SpotlightSearch.showNsfwPublicRooms", null, SettingLevel.DEVICE, true); await SettingsStore.setValue("SpotlightSearch.showNsfwPublicRooms", null, SettingLevel.DEVICE, true);
render(<SpotlightDialog initialFilter={Filter.PublicRooms} onFinished={() => null} />); render(<SpotlightDialog initialFilter={Filter.PublicRooms} onFinished={() => null} />);
// search is debounced // search is debounced
jest.advanceTimersByTime(200); jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers(); await flushPromisesWithFakeTimers();
expect(screen.getByText(nsfwTopicRoom.name!)).toBeInTheDocument(); await waitFor(() => {
expect(screen.getByText(nsfwNameRoom.name!)).toBeInTheDocument(); expect(screen.getByText(nsfwTopicRoom.name!)).toBeInTheDocument();
expect(screen.getByText(potatoRoom.name!)).toBeInTheDocument(); expect(screen.getByText(nsfwNameRoom.name!)).toBeInTheDocument();
expect(screen.getByText(potatoRoom.name!)).toBeInTheDocument();
});
}); });
}); });
@ -567,7 +583,7 @@ describe("Spotlight Dialog", () => {
jest.advanceTimersByTime(200); jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers(); await flushPromisesWithFakeTimers();
expect(screen.getByText("Failed to query public rooms")).toBeInTheDocument(); await waitFor(() => expect(screen.getByText("Failed to query public rooms")).toBeInTheDocument());
}); });
describe("knock rooms", () => { describe("knock rooms", () => {
@ -593,9 +609,7 @@ describe("Spotlight Dialog", () => {
describe("when disabling feature", () => { describe("when disabling feature", () => {
beforeEach(async () => { beforeEach(async () => {
jest.spyOn(SettingsStore, "getValue").mockImplementation((setting) => await SettingsStore.setValue("feature_ask_to_join", null, SettingLevel.DEVICE, false);
setting === "feature_ask_to_join" ? false : [],
);
render(<SpotlightDialog initialFilter={Filter.PublicRooms} onFinished={() => {}} />); render(<SpotlightDialog initialFilter={Filter.PublicRooms} onFinished={() => {}} />);
@ -603,7 +617,7 @@ describe("Spotlight Dialog", () => {
jest.advanceTimersByTime(200); jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers(); await flushPromisesWithFakeTimers();
fireEvent.click(screen.getByRole("button", { name: "View" })); fireEvent.click(await screen.findByRole("button", { name: "View" }));
}); });
it("should not skip to auto join", async () => { it("should not skip to auto join", async () => {
@ -617,18 +631,12 @@ describe("Spotlight Dialog", () => {
describe("when enabling feature", () => { describe("when enabling feature", () => {
beforeEach(async () => { beforeEach(async () => {
jest.spyOn(SettingsStore, "getValue").mockImplementation((setting) => await SettingsStore.setValue("feature_ask_to_join", null, SettingLevel.DEVICE, true);
setting === "feature_ask_to_join" ? true : [],
);
jest.spyOn(mockedClient, "getRoom").mockReturnValue(null); jest.spyOn(mockedClient, "getRoom").mockReturnValue(null);
render(<SpotlightDialog initialFilter={Filter.PublicRooms} onFinished={() => {}} />); render(<SpotlightDialog initialFilter={Filter.PublicRooms} onFinished={() => {}} />);
// search is debounced await waitFor(() => fireEvent.click(screen.getByRole("button", { name: "Ask to join" })));
jest.advanceTimersByTime(200);
await flushPromisesWithFakeTimers();
fireEvent.click(screen.getByRole("button", { name: "Ask to join" }));
}); });
it("should skip to auto join", async () => { it("should skip to auto join", async () => {

2
test/unit-tests/components/views/dialogs/__snapshots__/DevtoolsDialog-test.tsx.snap
View file

@ -33,7 +33,7 @@ exports[`DevtoolsDialog renders the devtools dialog 1`] = `
> >
Room ID: !id Room ID: !id
<div <div
aria-describedby="floating-ui-2" aria-describedby=":r2:"
aria-label="Copy" aria-label="Copy"
class="mx_AccessibleButton mx_CopyableText_copyButton" class="mx_AccessibleButton mx_CopyableText_copyButton"
role="button" role="button"

2
test/unit-tests/components/views/dialogs/__snapshots__/LogoutDialog-test.tsx.snap
View file

@ -73,7 +73,6 @@ exports[`LogoutDialog Prompts user to connect backup if there is a backup on the
</details> </details>
</div> </div>
<div <div
aria-describedby="floating-ui-22"
aria-label="Close dialog" aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton" class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button" role="button"
@ -161,7 +160,6 @@ exports[`LogoutDialog Prompts user to set up backup if there is no backup on the
</details> </details>
</div> </div>
<div <div
aria-describedby="floating-ui-28"
aria-label="Close dialog" aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton" class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button" role="button"

2
test/unit-tests/components/views/dialogs/__snapshots__/MessageEditHistoryDialog-test.tsx.snap
View file

@ -102,7 +102,6 @@ exports[`<MessageEditHistory /> should match the snapshot 1`] = `
</div> </div>
</div> </div>
<div <div
aria-describedby="floating-ui-2"
aria-label="Close dialog" aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton" class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button" role="button"
@ -316,7 +315,6 @@ exports[`<MessageEditHistory /> should support events with 1`] = `
</div> </div>
</div> </div>
<div <div
aria-describedby="floating-ui-8"
aria-label="Close dialog" aria-label="Close dialog"
class="mx_AccessibleButton mx_Dialog_cancelButton" class="mx_AccessibleButton mx_Dialog_cancelButton"
role="button" role="button"

2
test/unit-tests/components/views/dialogs/__snapshots__/ServerPickerDialog-test.tsx.snap
View file

@ -50,7 +50,7 @@ exports[`<ServerPickerDialog /> should render dialog 1`] = `
class="mx_StyledRadioButton_content" class="mx_StyledRadioButton_content"
> >
<span <span
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="mx_Login_underlinedServerName" class="mx_Login_underlinedServerName"
tabindex="0" tabindex="0"
> >

2
test/unit-tests/components/views/elements/SearchWarning-test.tsx
View file

@ -29,7 +29,7 @@ describe("<SearchWarning />", () => {
const { asFragment, getByRole } = render( const { asFragment, getByRole } = render(
<SearchWarning isRoomEncrypted={true} kind={WarningKind.Search} />, <SearchWarning isRoomEncrypted={true} kind={WarningKind.Search} />,
); );
expect(getByRole("img")).toHaveAttribute("src", "https://logo"); expect(getByRole("presentation")).toHaveAttribute("src", "https://logo");
expect(asFragment()).toMatchSnapshot(); expect(asFragment()).toMatchSnapshot();
}); });

6
test/unit-tests/components/views/elements/__snapshots__/AppTile-test.tsx.snap
View file

@ -30,7 +30,7 @@ exports[`AppTile destroys non-persisted right panel widget on room change 1`] =
/> />
</div> </div>
<button <button
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"
@ -356,8 +356,8 @@ exports[`AppTile for a pinned widget should render permission request 1`] = `
<span> <span>
Using this widget may share data Using this widget may share data
<div <div
aria-describedby="floating-ui-87" aria-describedby=":r2n:"
aria-labelledby="floating-ui-86" aria-labelledby=":r2m:"
class="mx_TextWithTooltip_target mx_TextWithTooltip_target--helpIcon" class="mx_TextWithTooltip_target mx_TextWithTooltip_target--helpIcon"
> >
<svg <svg

2
test/unit-tests/components/views/elements/__snapshots__/FacePile-test.tsx.snap
View file

@ -3,7 +3,7 @@
exports[`<FacePile /> renders with a tooltip 1`] = ` exports[`<FacePile /> renders with a tooltip 1`] = `
<DocumentFragment> <DocumentFragment>
<div <div
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="mx_AccessibleButton mx_FacePile" class="mx_AccessibleButton mx_FacePile"
role="button" role="button"
tabindex="0" tabindex="0"

2
test/unit-tests/components/views/elements/__snapshots__/ImageView-test.tsx.snap
View file

@ -21,7 +21,7 @@ exports[`<ImageView /> renders correctly 1`] = `
class="mx_ImageView_toolbar" class="mx_ImageView_toolbar"
> >
<div <div
aria-describedby="floating-ui-2" aria-describedby=":r2:"
aria-label="Zoom out" aria-label="Zoom out"
class="mx_AccessibleButton mx_ImageView_button mx_ImageView_button_zoomOut" class="mx_AccessibleButton mx_ImageView_button mx_ImageView_button_zoomOut"
role="button" role="button"

2
test/unit-tests/components/views/elements/__snapshots__/InfoTooltip-test.tsx.snap
View file

@ -3,7 +3,7 @@
exports[`InfoTooltip should show tooltip on hover 1`] = ` exports[`InfoTooltip should show tooltip on hover 1`] = `
<DocumentFragment> <DocumentFragment>
<div <div
aria-describedby="floating-ui-2" aria-describedby=":r2:"
class="mx_InfoTooltip" class="mx_InfoTooltip"
tabindex="0" tabindex="0"
> >

4
test/unit-tests/components/views/elements/__snapshots__/RoomFacePile-test.tsx.snap
View file

@ -3,8 +3,8 @@
exports[`<RoomFacePile /> renders 1`] = ` exports[`<RoomFacePile /> renders 1`] = `
<DocumentFragment> <DocumentFragment>
<div <div
aria-describedby="floating-ui-2" aria-describedby=":r1:"
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="mx_AccessibleButton mx_FacePile" class="mx_AccessibleButton mx_FacePile"
role="button" role="button"
tabindex="0" tabindex="0"

2
test/unit-tests/components/views/location/__snapshots__/LocationViewDialog-test.tsx.snap
View file

@ -23,7 +23,7 @@ exports[`<LocationViewDialog /> renders map correctly 1`] = `
class="mx_ZoomButtons" class="mx_ZoomButtons"
> >
<div <div
aria-describedby="floating-ui-6" aria-describedby=":r2:"
aria-label="Zoom in" aria-label="Zoom in"
class="mx_AccessibleButton mx_ZoomButtons_button" class="mx_AccessibleButton mx_ZoomButtons_button"
data-testid="map-zoom-in-button" data-testid="map-zoom-in-button"

4
test/unit-tests/components/views/messages/__snapshots__/MLocationBody-test.tsx.snap
View file

@ -34,7 +34,7 @@ exports[`MLocationBody <MLocationBody> without error renders map correctly 1`] =
class="mx_MLocationBody" class="mx_MLocationBody"
> >
<div <div
aria-labelledby="floating-ui-18" aria-labelledby=":ri:"
class="mx_MLocationBody_map" class="mx_MLocationBody_map"
> >
<div <div
@ -67,7 +67,7 @@ exports[`MLocationBody <MLocationBody> without error renders marker correctly fo
class="mx_MLocationBody" class="mx_MLocationBody"
> >
<div <div
aria-labelledby="floating-ui-30" aria-labelledby=":ru:"
class="mx_MLocationBody_map" class="mx_MLocationBody_map"
> >
<div <div

48
test/unit-tests/components/views/messages/__snapshots__/MPollBody-test.tsx.snap
View file

@ -506,9 +506,7 @@ exports[`MPollBody renders a poll that I have not voted in 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div
@ -552,9 +550,7 @@ exports[`MPollBody renders a poll that I have not voted in 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div
@ -598,9 +594,7 @@ exports[`MPollBody renders a poll that I have not voted in 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div
@ -644,9 +638,7 @@ exports[`MPollBody renders a poll that I have not voted in 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div
@ -922,9 +914,7 @@ exports[`MPollBody renders a poll with no votes 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div
@ -968,9 +958,7 @@ exports[`MPollBody renders a poll with no votes 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div
@ -1014,9 +1002,7 @@ exports[`MPollBody renders a poll with no votes 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div
@ -1060,9 +1046,7 @@ exports[`MPollBody renders a poll with no votes 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div
@ -1496,9 +1480,7 @@ exports[`MPollBody renders an undisclosed, unfinished poll 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div
@ -1542,9 +1524,7 @@ exports[`MPollBody renders an undisclosed, unfinished poll 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div
@ -1588,9 +1568,7 @@ exports[`MPollBody renders an undisclosed, unfinished poll 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div
@ -1634,9 +1612,7 @@ exports[`MPollBody renders an undisclosed, unfinished poll 1`] = `
</div> </div>
<div <div
class="mx_PollOption_optionVoteCount" class="mx_PollOption_optionVoteCount"
> />
</div>
</div> </div>
</div> </div>
<div <div

36
test/unit-tests/components/views/polls/pollHistory/PollListItemEnded-test.tsx
View file

@ -12,7 +12,6 @@ import { MatrixEvent, Poll, Room, M_TEXT } from "matrix-js-sdk/src/matrix";
import { PollListItemEnded } from "../../../../../../src/components/views/polls/pollHistory/PollListItemEnded"; import { PollListItemEnded } from "../../../../../../src/components/views/polls/pollHistory/PollListItemEnded";
import { import {
flushPromises,
getMockClientWithEventEmitter, getMockClientWithEventEmitter,
makePollEndEvent, makePollEndEvent,
makePollResponseEvent, makePollResponseEvent,
@ -20,7 +19,6 @@ import {
mockClientMethodsUser, mockClientMethodsUser,
mockIntlDateTimeFormat, mockIntlDateTimeFormat,
setupRoomWithPollEvents, setupRoomWithPollEvents,
unmockIntlDateTimeFormat,
} from "../../../../../test-utils"; } from "../../../../../test-utils";
describe("<PollListItemEnded />", () => { describe("<PollListItemEnded />", () => {
@ -54,14 +52,14 @@ describe("<PollListItemEnded />", () => {
const getComponent = (props: { event: MatrixEvent; poll: Poll }) => const getComponent = (props: { event: MatrixEvent; poll: Poll }) =>
render(<PollListItemEnded {...props} onClick={jest.fn()} />); render(<PollListItemEnded {...props} onClick={jest.fn()} />);
beforeAll(() => { beforeEach(() => {
// mock default locale to en-GB and set timezone // mock default locale to en-GB and set timezone
// so these tests run the same everywhere // so these tests run the same everywhere
mockIntlDateTimeFormat(); mockIntlDateTimeFormat();
}); });
afterAll(() => { afterEach(() => {
unmockIntlDateTimeFormat(); jest.resetAllMocks();
}); });
it("renders a poll with no responses", async () => { it("renders a poll with no responses", async () => {
@ -81,10 +79,8 @@ describe("<PollListItemEnded />", () => {
await setupRoomWithPollEvents([pollStartEvent], responses, [pollEndEvent], mockClient, room); await setupRoomWithPollEvents([pollStartEvent], responses, [pollEndEvent], mockClient, room);
const poll = room.polls.get(pollId)!; const poll = room.polls.get(pollId)!;
const { getByText } = getComponent({ event: pollStartEvent, poll }); const { getByText, findByText } = getComponent({ event: pollStartEvent, poll });
// fetch relations await expect(findByText("Final result based on 3 votes")).resolves.toBeInTheDocument();
await flushPromises();
expect(getByText("Final result based on 3 votes")).toBeInTheDocument();
// winning answer // winning answer
expect(getByText("Nissan Silvia S15")).toBeInTheDocument(); expect(getByText("Nissan Silvia S15")).toBeInTheDocument();
}); });
@ -99,10 +95,8 @@ describe("<PollListItemEnded />", () => {
await setupRoomWithPollEvents([pollStartEvent], responses, [pollEndEvent], mockClient, room); await setupRoomWithPollEvents([pollStartEvent], responses, [pollEndEvent], mockClient, room);
const poll = room.polls.get(pollId)!; const poll = room.polls.get(pollId)!;
const { getByText } = getComponent({ event: pollStartEvent, poll }); const { getByText, findByText } = getComponent({ event: pollStartEvent, poll });
// fetch relations await expect(findByText("Final result based on 4 votes")).resolves.toBeInTheDocument();
await flushPromises();
expect(getByText("Final result based on 4 votes")).toBeInTheDocument();
// both answers answer // both answers answer
expect(getByText("Nissan Silvia S15")).toBeInTheDocument(); expect(getByText("Nissan Silvia S15")).toBeInTheDocument();
expect(getByText("Mitsubishi Lancer Evolution IX")).toBeInTheDocument(); expect(getByText("Mitsubishi Lancer Evolution IX")).toBeInTheDocument();
@ -120,12 +114,10 @@ describe("<PollListItemEnded />", () => {
await setupRoomWithPollEvents([pollStartEvent], responses, [pollEndEvent], mockClient, room); await setupRoomWithPollEvents([pollStartEvent], responses, [pollEndEvent], mockClient, room);
const poll = room.polls.get(pollId)!; const poll = room.polls.get(pollId)!;
const { getByText } = getComponent({ event: pollStartEvent, poll }); const { getByText, findByText } = getComponent({ event: pollStartEvent, poll });
// fetch relations
await flushPromises();
// still only 3 unique votes // still only 3 unique votes
expect(getByText("Final result based on 3 votes")).toBeInTheDocument(); await expect(findByText("Final result based on 3 votes")).resolves.toBeInTheDocument();
// only latest vote counted // only latest vote counted
expect(getByText("Nissan Silvia S15")).toBeInTheDocument(); expect(getByText("Nissan Silvia S15")).toBeInTheDocument();
}); });
@ -139,12 +131,10 @@ describe("<PollListItemEnded />", () => {
await setupRoomWithPollEvents([pollStartEvent], responses, [pollEndEvent], mockClient, room); await setupRoomWithPollEvents([pollStartEvent], responses, [pollEndEvent], mockClient, room);
const poll = room.polls.get(pollId)!; const poll = room.polls.get(pollId)!;
const { getByText } = getComponent({ event: pollStartEvent, poll }); const { findByText } = getComponent({ event: pollStartEvent, poll });
// fetch relations
await flushPromises();
// invalid vote excluded // invalid vote excluded
expect(getByText("Final result based on 2 votes")).toBeInTheDocument(); await expect(findByText("Final result based on 2 votes")).resolves.toBeInTheDocument();
}); });
it("updates on new responses", async () => { it("updates on new responses", async () => {
@ -156,10 +146,8 @@ describe("<PollListItemEnded />", () => {
const poll = room.polls.get(pollId)!; const poll = room.polls.get(pollId)!;
const { getByText, queryByText, findByText } = getComponent({ event: pollStartEvent, poll }); const { getByText, queryByText, findByText } = getComponent({ event: pollStartEvent, poll });
// fetch relations
await flushPromises();
expect(getByText("Final result based on 2 votes")).toBeInTheDocument(); await expect(findByText("Final result based on 2 votes")).resolves.toBeInTheDocument();
await room.processPollEvents([ await room.processPollEvents([
makePollResponseEvent(pollId, [answerOne.id], "@han:domain.org", roomId, timestamp + 1), makePollResponseEvent(pollId, [answerOne.id], "@han:domain.org", roomId, timestamp + 1),

4
test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollHistory-test.tsx.snap
View file

@ -91,7 +91,7 @@ exports[`<PollHistory /> renders a list of active polls when there are polls in
tabindex="0" tabindex="0"
> >
<div <div
aria-labelledby="floating-ui-10" aria-labelledby=":ra:"
class="mx_PollListItem_content" class="mx_PollListItem_content"
> >
<span> <span>
@ -116,7 +116,7 @@ exports[`<PollHistory /> renders a list of active polls when there are polls in
tabindex="0" tabindex="0"
> >
<div <div
aria-labelledby="floating-ui-16" aria-labelledby=":rg:"
class="mx_PollListItem_content" class="mx_PollListItem_content"
> >
<span> <span>

2
test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollListItem-test.tsx.snap
View file

@ -10,7 +10,7 @@ exports[`<PollListItem /> renders a poll 1`] = `
tabindex="0" tabindex="0"
> >
<div <div
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="mx_PollListItem_content" class="mx_PollListItem_content"
> >
<span> <span>

2
test/unit-tests/components/views/polls/pollHistory/__snapshots__/PollListItemEnded-test.tsx.snap
View file

@ -10,7 +10,7 @@ exports[`<PollListItemEnded /> renders a poll with no responses 1`] = `
tabindex="0" tabindex="0"
> >
<div <div
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="mx_PollListItemEnded_content" class="mx_PollListItemEnded_content"
> >
<div <div

2
test/unit-tests/components/views/right_panel/__snapshots__/BaseCard-test.tsx.snap
View file

@ -19,7 +19,7 @@ exports[`<BaseCard /> should close when clicking X button 1`] = `
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"

4
test/unit-tests/components/views/right_panel/__snapshots__/ExtensionsCard-test.tsx.snap
View file

@ -19,7 +19,7 @@ exports[`<ExtensionsCard /> should render empty state 1`] = `
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"
@ -119,7 +119,7 @@ exports[`<ExtensionsCard /> should render widgets 1`] = `
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-6" aria-labelledby=":r6:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"

22
test/unit-tests/components/views/right_panel/__snapshots__/PinnedMessagesCard-test.tsx.snap
View file

@ -19,7 +19,7 @@ exports[`<PinnedMessagesCard /> should show the empty state when there are no pi
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-12" aria-labelledby=":re:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"
@ -100,7 +100,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-18" aria-labelledby=":rk:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"
@ -156,7 +156,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
class="mx_PinnedEventTile_top" class="mx_PinnedEventTile_top"
> >
<span <span
aria-labelledby="floating-ui-24" aria-labelledby=":rq:"
class="mx_PinnedEventTile_sender mx_Username_color3" class="mx_PinnedEventTile_sender mx_Username_color3"
> >
@alice:example.org @alice:example.org
@ -168,7 +168,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
aria-label="Open menu" aria-label="Open menu"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
data-state="closed" data-state="closed"
id="radix-2" id="radix-:rv:"
role="button" role="button"
style="--cpd-icon-button-size: 24px;" style="--cpd-icon-button-size: 24px;"
tabindex="0" tabindex="0"
@ -233,7 +233,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
class="mx_PinnedEventTile_top" class="mx_PinnedEventTile_top"
> >
<span <span
aria-labelledby="floating-ui-29" aria-labelledby=":r11:"
class="mx_PinnedEventTile_sender mx_Username_color3" class="mx_PinnedEventTile_sender mx_Username_color3"
> >
@alice:example.org @alice:example.org
@ -245,7 +245,7 @@ exports[`<PinnedMessagesCard /> should show two pinned messages 1`] = `
aria-label="Open menu" aria-label="Open menu"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
data-state="closed" data-state="closed"
id="radix-3" id="radix-:r16:"
role="button" role="button"
style="--cpd-icon-button-size: 24px;" style="--cpd-icon-button-size: 24px;"
tabindex="0" tabindex="0"
@ -319,7 +319,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-712" aria-labelledby=":rt2:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"
@ -375,7 +375,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
class="mx_PinnedEventTile_top" class="mx_PinnedEventTile_top"
> >
<span <span
aria-labelledby="floating-ui-718" aria-labelledby=":rt8:"
class="mx_PinnedEventTile_sender mx_Username_color3" class="mx_PinnedEventTile_sender mx_Username_color3"
> >
@alice:example.org @alice:example.org
@ -387,7 +387,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
aria-label="Open menu" aria-label="Open menu"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
data-state="closed" data-state="closed"
id="radix-218" id="radix-:rtd:"
role="button" role="button"
style="--cpd-icon-button-size: 24px;" style="--cpd-icon-button-size: 24px;"
tabindex="0" tabindex="0"
@ -452,7 +452,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
class="mx_PinnedEventTile_top" class="mx_PinnedEventTile_top"
> >
<span <span
aria-labelledby="floating-ui-723" aria-labelledby=":rtf:"
class="mx_PinnedEventTile_sender mx_Username_color3" class="mx_PinnedEventTile_sender mx_Username_color3"
> >
@alice:example.org @alice:example.org
@ -464,7 +464,7 @@ exports[`<PinnedMessagesCard /> unpin all should not allow to unpinall 1`] = `
aria-label="Open menu" aria-label="Open menu"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
data-state="closed" data-state="closed"
id="radix-219" id="radix-:rtk:"
role="button" role="button"
style="--cpd-icon-button-size: 24px;" style="--cpd-icon-button-size: 24px;"
tabindex="0" tabindex="0"

12
test/unit-tests/components/views/right_panel/__snapshots__/RoomSummaryCard-test.tsx.snap
View file

@ -15,7 +15,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
class="mx_BaseCard_header_spacer" class="mx_BaseCard_header_spacer"
/> />
<button <button
aria-labelledby="floating-ui-20" aria-labelledby=":rm:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"
@ -188,7 +188,7 @@ exports[`<RoomSummaryCard /> has button to edit topic 1`] = `
<input <input
aria-hidden="true" aria-hidden="true"
class="_input_qnvru_32" class="_input_qnvru_32"
id=":r3:" id=":rr:"
type="checkbox" type="checkbox"
/> />
<div <div
@ -669,7 +669,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
class="mx_BaseCard_header_spacer" class="mx_BaseCard_header_spacer"
/> />
<button <button
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"
@ -805,7 +805,7 @@ exports[`<RoomSummaryCard /> renders the room summary 1`] = `
<input <input
aria-hidden="true" aria-hidden="true"
class="_input_qnvru_32" class="_input_qnvru_32"
id=":r1:" id=":r5:"
type="checkbox" type="checkbox"
/> />
<div <div
@ -1286,7 +1286,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
class="mx_BaseCard_header_spacer" class="mx_BaseCard_header_spacer"
/> />
<button <button
aria-labelledby="floating-ui-10" aria-labelledby=":rb:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"
@ -1459,7 +1459,7 @@ exports[`<RoomSummaryCard /> renders the room topic in the summary 1`] = `
<input <input
aria-hidden="true" aria-hidden="true"
class="_input_qnvru_32" class="_input_qnvru_32"
id=":r2:" id=":rg:"
type="checkbox" type="checkbox"
/> />
<div <div

4
test/unit-tests/components/views/right_panel/__snapshots__/UserInfo-test.tsx.snap
View file

@ -88,7 +88,7 @@ exports[`<UserInfo /> with crypto enabled renders <BasicUserInfo /> 1`] = `
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-220" aria-labelledby=":r6s:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"
@ -402,7 +402,7 @@ exports[`<UserInfo /> with crypto enabled should render a deactivate button for
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-290" aria-labelledby=":r92:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"

2
test/unit-tests/components/views/rooms/RoomHeader/__snapshots__/VideoRoomChatButton-test.tsx.snap
View file

@ -3,7 +3,7 @@
exports[`<VideoRoomChatButton /> renders button with an unread marker when room is unread 1`] = ` exports[`<VideoRoomChatButton /> renders button with an unread marker when room is unread 1`] = `
<button <button
aria-label="Chat" aria-label="Chat"
aria-labelledby="floating-ui-6" aria-labelledby=":r6:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
data-indicator="default" data-indicator="default"
role="button" role="button"

16
test/unit-tests/components/views/rooms/__snapshots__/PinnedEventTile-test.tsx.snap
View file

@ -25,7 +25,7 @@ exports[`<PinnedEventTile /> should render pinned event 1`] = `
class="mx_PinnedEventTile_top" class="mx_PinnedEventTile_top"
> >
<span <span
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="mx_PinnedEventTile_sender mx_Username_color2" class="mx_PinnedEventTile_sender mx_Username_color2"
> >
@alice:server.org @alice:server.org
@ -37,7 +37,7 @@ exports[`<PinnedEventTile /> should render pinned event 1`] = `
aria-label="Open menu" aria-label="Open menu"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
data-state="closed" data-state="closed"
id="radix-0" id="radix-:r5:"
role="button" role="button"
style="--cpd-icon-button-size: 24px;" style="--cpd-icon-button-size: 24px;"
tabindex="0" tabindex="0"
@ -101,7 +101,7 @@ exports[`<PinnedEventTile /> should render pinned event with thread info 1`] = `
class="mx_PinnedEventTile_top" class="mx_PinnedEventTile_top"
> >
<span <span
aria-labelledby="floating-ui-6" aria-labelledby=":r8:"
class="mx_PinnedEventTile_sender mx_Username_color2" class="mx_PinnedEventTile_sender mx_Username_color2"
> >
@alice:server.org @alice:server.org
@ -113,7 +113,7 @@ exports[`<PinnedEventTile /> should render pinned event with thread info 1`] = `
aria-label="Open menu" aria-label="Open menu"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
data-state="closed" data-state="closed"
id="radix-2" id="radix-:rd:"
role="button" role="button"
style="--cpd-icon-button-size: 24px;" style="--cpd-icon-button-size: 24px;"
tabindex="0" tabindex="0"
@ -181,7 +181,7 @@ exports[`<PinnedEventTile /> should render pinned event with thread info 1`] = `
exports[`<PinnedEventTile /> should render the menu with all the options 1`] = ` exports[`<PinnedEventTile /> should render the menu with all the options 1`] = `
<div <div
aria-label="Open menu" aria-label="Open menu"
aria-labelledby="radix-8" aria-labelledby="radix-:r10:"
aria-orientation="vertical" aria-orientation="vertical"
class="_menu_1x5h1_17" class="_menu_1x5h1_17"
data-align="start" data-align="start"
@ -190,7 +190,7 @@ exports[`<PinnedEventTile /> should render the menu with all the options 1`] = `
data-side="right" data-side="right"
data-state="open" data-state="open"
dir="ltr" dir="ltr"
id="radix-9" id="radix-:r11:"
role="menu" role="menu"
style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;" style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;"
tabindex="-1" tabindex="-1"
@ -372,7 +372,7 @@ exports[`<PinnedEventTile /> should render the menu with all the options 1`] = `
exports[`<PinnedEventTile /> should render the menu without unpin and delete 1`] = ` exports[`<PinnedEventTile /> should render the menu without unpin and delete 1`] = `
<div <div
aria-label="Open menu" aria-label="Open menu"
aria-labelledby="radix-4" aria-labelledby="radix-:rl:"
aria-orientation="vertical" aria-orientation="vertical"
class="_menu_1x5h1_17" class="_menu_1x5h1_17"
data-align="start" data-align="start"
@ -381,7 +381,7 @@ exports[`<PinnedEventTile /> should render the menu without unpin and delete 1`]
data-side="right" data-side="right"
data-state="open" data-state="open"
dir="ltr" dir="ltr"
id="radix-5" id="radix-:rm:"
role="menu" role="menu"
style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;" style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;"
tabindex="-1" tabindex="-1"

9
test/unit-tests/components/views/rooms/__snapshots__/ReadReceiptGroup-test.tsx.snap
View file

@ -3,7 +3,8 @@
exports[`ReadReceiptGroup <ReadReceiptPerson /> should display a tooltip 1`] = ` exports[`ReadReceiptGroup <ReadReceiptPerson /> should display a tooltip 1`] = `
<div <div
class="_tooltip_1pslb_17" class="_tooltip_1pslb_17"
id="floating-ui-6" data-floating-ui-focusable=""
id=":r6:"
role="tooltip" role="tooltip"
style="position: absolute; left: 0px; top: 0px; transform: translate(0px, 0px);" style="position: absolute; left: 0px; top: 0px; transform: translate(0px, 0px);"
tabindex="-1" tabindex="-1"
@ -21,7 +22,7 @@ exports[`ReadReceiptGroup <ReadReceiptPerson /> should display a tooltip 1`] = `
stroke="none" stroke="none"
/> />
<clippath <clippath
id="floating-ui-9" id=":r9:"
> >
<rect <rect
height="10" height="10"
@ -32,13 +33,13 @@ exports[`ReadReceiptGroup <ReadReceiptPerson /> should display a tooltip 1`] = `
</clippath> </clippath>
</svg> </svg>
<span <span
id="floating-ui-4" id=":r4:"
> >
Alice Alice
</span> </span>
<span <span
class="_caption_1pslb_37 cpd-theme-dark" class="_caption_1pslb_37 cpd-theme-dark"
id="floating-ui-5" id=":r5:"
> >
@alice:example.org @alice:example.org
</span> </span>

8
test/unit-tests/components/views/rooms/__snapshots__/RoomHeader-test.tsx.snap
View file

@ -47,7 +47,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x);" style="--mx-flex-display: flex; --mx-flex-direction: row; --mx-flex-align: center; --mx-flex-justify: start; --mx-flex-gap: var(--cpd-space-2x);"
> >
<button <button
aria-labelledby="floating-ui-1180" aria-labelledby=":r154:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -73,7 +73,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
<button <button
aria-disabled="true" aria-disabled="true"
aria-label="There's no one here to call" aria-label="There's no one here to call"
aria-labelledby="floating-ui-1185" aria-labelledby=":r159:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -98,7 +98,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
</button> </button>
<button <button
aria-label="Room info" aria-label="Room info"
aria-labelledby="floating-ui-1190" aria-labelledby=":r15e:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -123,7 +123,7 @@ exports[`RoomHeader dm does not show the face pile for DMs 1`] = `
</button> </button>
<button <button
aria-label="Threads" aria-label="Threads"
aria-labelledby="floating-ui-1195" aria-labelledby=":r15j:"
class="_icon-button_bh2qc_17" class="_icon-button_bh2qc_17"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"

4
test/unit-tests/components/views/rooms/__snapshots__/ThirdPartyMemberInfo-test.tsx.snap
View file

@ -19,7 +19,7 @@ exports[`<ThirdPartyMemberInfo /> should render invite 1`] = `
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"
@ -93,7 +93,7 @@ exports[`<ThirdPartyMemberInfo /> should render invite when room in not availabl
</p> </p>
</div> </div>
<button <button
aria-labelledby="floating-ui-6" aria-labelledby=":r6:"
class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38" class="_icon-button_bh2qc_17 _subtle-bg_bh2qc_38"
data-testid="base-card-close-button" data-testid="base-card-close-button"
role="button" role="button"

3
test/unit-tests/components/views/rooms/wysiwyg_composer/hooks/usePlainTextListeners-test.tsx
View file

@ -6,8 +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. Please see LICENSE files in the repository root for full details.
*/ */
import { renderHook } from "@testing-library/react-hooks"; import { renderHook, act } from "jest-matrix-react";
import { act } from "jest-matrix-react";
import { usePlainTextListeners } from "../../../../../../../src/components/views/rooms/wysiwyg_composer/hooks/usePlainTextListeners"; import { usePlainTextListeners } from "../../../../../../../src/components/views/rooms/wysiwyg_composer/hooks/usePlainTextListeners";

2
test/unit-tests/components/views/settings/AddRemoveThreepids-test.tsx
View file

@ -49,7 +49,7 @@ describe("AddRemoveThreepids", () => {
clearAllModals(); clearAllModals();
}); });
const clientProviderWrapper: React.FC = ({ children }) => ( const clientProviderWrapper: React.FC = ({ children }: React.PropsWithChildren) => (
<MatrixClientContext.Provider value={client}>{children}</MatrixClientContext.Provider> <MatrixClientContext.Provider value={client}>{children}</MatrixClientContext.Provider>
); );

8
test/unit-tests/components/views/settings/CryptographyPanel-test.tsx
View file

@ -7,7 +7,7 @@ Please see LICENSE files in the repository root for full details.
*/ */
import React from "react"; import React from "react";
import { render } from "jest-matrix-react"; import { render, waitFor } from "jest-matrix-react";
import { MatrixClient } from "matrix-js-sdk/src/matrix"; import { MatrixClient } from "matrix-js-sdk/src/matrix";
import { mocked } from "jest-mock"; import { mocked } from "jest-mock";
@ -39,8 +39,7 @@ describe("CryptographyPanel", () => {
expect(codes[1].innerHTML).toEqual("<strong>...</strong>"); expect(codes[1].innerHTML).toEqual("<strong>...</strong>");
// Then the actual key // Then the actual key
await TestUtils.flushPromises(); await waitFor(() => expect(codes[1].innerHTML).toEqual(sessionKeyFormatted));
expect(codes[1].innerHTML).toEqual(sessionKeyFormatted);
}); });
it("handles errors fetching session key", async () => { it("handles errors fetching session key", async () => {
@ -62,7 +61,6 @@ describe("CryptographyPanel", () => {
expect(codes[1].innerHTML).toEqual("<strong>...</strong>"); expect(codes[1].innerHTML).toEqual("<strong>...</strong>");
// Then "not supported key // Then "not supported key
await TestUtils.flushPromises(); await waitFor(() => expect(codes[1].innerHTML).toEqual("<strong>&lt;not supported&gt;</strong>"));
expect(codes[1].innerHTML).toEqual("<strong>&lt;not supported&gt;</strong>");
}); });
}); });

20
test/unit-tests/components/views/settings/__snapshots__/LayoutSwitcher-test.tsx.snap
View file

@ -27,7 +27,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
<label <label
aria-label="Modern" aria-label="Modern"
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-0" for="radix-:r0:"
> >
<div <div
class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline" class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@ -38,7 +38,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
<input <input
checked="" checked=""
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-0" id="radix-:r0:"
name="layout" name="layout"
title="" title=""
type="radio" type="radio"
@ -154,7 +154,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
<label <label
aria-label="Message bubbles" aria-label="Message bubbles"
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-1" for="radix-:r9:"
> >
<div <div
class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline" class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@ -164,7 +164,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-1" id="radix-:r9:"
name="layout" name="layout"
title="" title=""
type="radio" type="radio"
@ -280,7 +280,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
<label <label
aria-label="IRC (experimental)" aria-label="IRC (experimental)"
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-2" for="radix-:ri:"
> >
<div <div
class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline" class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@ -290,7 +290,7 @@ exports[`<LayoutSwitcher /> should render 1`] = `
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-2" id="radix-:ri:"
name="layout" name="layout"
title="" title=""
type="radio" type="radio"
@ -414,9 +414,9 @@ exports[`<LayoutSwitcher /> should render 1`] = `
class="_container_qnvru_18" class="_container_qnvru_18"
> >
<input <input
aria-describedby="radix-3" aria-describedby="radix-:rs:"
class="_input_qnvru_32" class="_input_qnvru_32"
id="radix-4" id="radix-:rr:"
name="compactLayout" name="compactLayout"
title="" title=""
type="checkbox" type="checkbox"
@ -431,13 +431,13 @@ exports[`<LayoutSwitcher /> should render 1`] = `
> >
<label <label
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-4" for="radix-:rr:"
> >
Show compact text and messages Show compact text and messages
</label> </label>
<span <span
class="_message_dgy0u_98 _help-message_dgy0u_104" class="_message_dgy0u_98 _help-message_dgy0u_104"
id="radix-3" id="radix-:rs:"
> >
Modern layout must be selected to use this feature. Modern layout must be selected to use this feature.
</span> </span>

3
test/unit-tests/components/views/settings/__snapshots__/SecureBackupPanel-test.tsx.snap
View file

@ -39,7 +39,6 @@ exports[`<SecureBackupPanel /> handles error fetching backup 1`] = `
</th> </th>
<td> <td>
not found locally not found locally
</td> </td>
</tr> </tr>
<tr> <tr>
@ -117,7 +116,6 @@ exports[`<SecureBackupPanel /> suggests connecting session to key backup when ba
</th> </th>
<td> <td>
not found locally not found locally
</td> </td>
</tr> </tr>
<tr> <tr>
@ -168,7 +166,6 @@ exports[`<SecureBackupPanel /> suggests connecting session to key backup when ba
</td> </td>
</tr> </tr>
</table> </table>
<div /> <div />
</details> </details>
<div <div

76
test/unit-tests/components/views/settings/__snapshots__/ThemeChoicePanel-test.tsx.snap
View file

@ -32,7 +32,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
> >
<input <input
class="_input_qnvru_32" class="_input_qnvru_32"
id="radix-48" id="radix-:r28:"
name="systemTheme" name="systemTheme"
title="" title=""
type="checkbox" type="checkbox"
@ -47,7 +47,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
> >
<label <label
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-48" for="radix-:r28:"
> >
Match system theme Match system theme
</label> </label>
@ -69,7 +69,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
<input <input
checked="" checked=""
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-49" id="radix-:r29:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -85,7 +85,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-49" for="radix-:r29:"
> >
Light Light
</label> </label>
@ -102,7 +102,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-50" id="radix-:r2a:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -118,7 +118,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-50" for="radix-:r2a:"
> >
Dark Dark
</label> </label>
@ -135,7 +135,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-51" id="radix-:r2b:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -151,7 +151,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-51" for="radix-:r2b:"
> >
High contrast High contrast
</label> </label>
@ -168,7 +168,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-52" id="radix-:r2c:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -184,7 +184,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-52" for="radix-:r2c:"
> >
Alice theme Alice theme
</label> </label>
@ -202,7 +202,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
> >
<label <label
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-54" for="radix-:r2d:"
> >
Add custom theme Add custom theme
</label> </label>
@ -210,9 +210,9 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
class="_controls_1h4nb_17" class="_controls_1h4nb_17"
> >
<input <input
aria-describedby="radix-53" aria-describedby="radix-:r2e:"
class="_control_9gon8_18" class="_control_9gon8_18"
id="radix-54" id="radix-:r2d:"
name="input" name="input"
title="" title=""
value="" value=""
@ -220,7 +220,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
</div> </div>
<span <span
class="_message_dgy0u_98 _help-message_dgy0u_104" class="_message_dgy0u_98 _help-message_dgy0u_104"
id="radix-53" id="radix-:r2e:"
> >
Enter the URL of a custom theme you want to apply. Enter the URL of a custom theme you want to apply.
</span> </span>
@ -240,7 +240,7 @@ exports[`<ThemeChoicePanel /> custom theme should display custom theme 1`] = `
</span> </span>
<button <button
aria-label="Delete" aria-label="Delete"
aria-labelledby="floating-ui-24" aria-labelledby=":r2f:"
class="_icon-button_bh2qc_17 _destructive_bh2qc_83" class="_icon-button_bh2qc_17 _destructive_bh2qc_83"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -309,7 +309,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
> >
<input <input
class="_input_qnvru_32" class="_input_qnvru_32"
id="radix-32" id="radix-:r10:"
name="systemTheme" name="systemTheme"
title="" title=""
type="checkbox" type="checkbox"
@ -324,7 +324,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
> >
<label <label
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-32" for="radix-:r10:"
> >
Match system theme Match system theme
</label> </label>
@ -346,7 +346,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
<input <input
checked="" checked=""
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-33" id="radix-:r11:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -362,7 +362,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-33" for="radix-:r11:"
> >
Light Light
</label> </label>
@ -379,7 +379,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-34" id="radix-:r12:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -395,7 +395,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-34" for="radix-:r12:"
> >
Dark Dark
</label> </label>
@ -412,7 +412,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-35" id="radix-:r13:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -428,7 +428,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-35" for="radix-:r13:"
> >
High contrast High contrast
</label> </label>
@ -445,7 +445,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-36" id="radix-:r14:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -461,7 +461,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-36" for="radix-:r14:"
> >
Alice theme Alice theme
</label> </label>
@ -479,7 +479,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
> >
<label <label
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-38" for="radix-:r15:"
> >
Add custom theme Add custom theme
</label> </label>
@ -487,9 +487,9 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
class="_controls_1h4nb_17" class="_controls_1h4nb_17"
> >
<input <input
aria-describedby="radix-37" aria-describedby="radix-:r16:"
class="_control_9gon8_18" class="_control_9gon8_18"
id="radix-38" id="radix-:r15:"
name="input" name="input"
title="" title=""
value="" value=""
@ -497,7 +497,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
</div> </div>
<span <span
class="_message_dgy0u_98 _help-message_dgy0u_104" class="_message_dgy0u_98 _help-message_dgy0u_104"
id="radix-37" id="radix-:r16:"
> >
Enter the URL of a custom theme you want to apply. Enter the URL of a custom theme you want to apply.
</span> </span>
@ -517,7 +517,7 @@ exports[`<ThemeChoicePanel /> custom theme should render the custom theme sectio
</span> </span>
<button <button
aria-label="Delete" aria-label="Delete"
aria-labelledby="floating-ui-1" aria-labelledby=":r17:"
class="_icon-button_bh2qc_17 _destructive_bh2qc_83" class="_icon-button_bh2qc_17 _destructive_bh2qc_83"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -586,7 +586,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
> >
<input <input
class="_input_qnvru_32" class="_input_qnvru_32"
id="radix-0" id="radix-:r0:"
name="systemTheme" name="systemTheme"
title="" title=""
type="checkbox" type="checkbox"
@ -601,7 +601,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
> >
<label <label
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-0" for="radix-:r0:"
> >
Match system theme Match system theme
</label> </label>
@ -623,7 +623,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
<input <input
checked="" checked=""
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-1" id="radix-:r1:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -639,7 +639,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-1" for="radix-:r1:"
> >
Light Light
</label> </label>
@ -656,7 +656,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-2" id="radix-:r2:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -672,7 +672,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-2" for="radix-:r2:"
> >
Dark Dark
</label> </label>
@ -689,7 +689,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-3" id="radix-:r3:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -705,7 +705,7 @@ exports[`<ThemeChoicePanel /> renders the theme choice UI 1`] = `
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-3" for="radix-:r3:"
> >
High contrast High contrast
</label> </label>

4
test/unit-tests/components/views/settings/devices/__snapshots__/FilteredDeviceListHeader-test.tsx.snap
View file

@ -14,7 +14,7 @@ exports[`<FilteredDeviceListHeader /> renders correctly when all devices are sel
> >
<input <input
aria-label="Deselect all" aria-label="Deselect all"
aria-labelledby="floating-ui-6" aria-labelledby=":r6:"
checked="" checked=""
data-testid="device-select-all-checkbox" data-testid="device-select-all-checkbox"
id="device-select-all-checkbox" id="device-select-all-checkbox"
@ -59,7 +59,7 @@ exports[`<FilteredDeviceListHeader /> renders correctly when no devices are sele
> >
<input <input
aria-label="Select all" aria-label="Select all"
aria-labelledby="floating-ui-1" aria-labelledby=":r0:"
data-testid="device-select-all-checkbox" data-testid="device-select-all-checkbox"
id="device-select-all-checkbox" id="device-select-all-checkbox"
type="checkbox" type="checkbox"

6
test/unit-tests/components/views/settings/tabs/user/SessionManagerTab-test.tsx
View file

@ -915,7 +915,7 @@ describe("<SessionManagerTab />", () => {
const { getByTestId, findByTestId } = render(getComponent()); const { getByTestId, findByTestId } = render(getComponent());
await waitForElementToBeRemoved(() => screen.queryAllByRole("progressbar")); await waitForElementToBeRemoved(() => screen.queryAllByRole("progressbar"));
await toggleDeviceDetails(getByTestId, alicesMobileDevice.device_id); toggleDeviceDetails(getByTestId, alicesMobileDevice.device_id);
const signOutButton = await within( const signOutButton = await within(
await findByTestId(`device-detail-${alicesMobileDevice.device_id}`), await findByTestId(`device-detail-${alicesMobileDevice.device_id}`),
@ -1024,7 +1024,7 @@ describe("<SessionManagerTab />", () => {
fireEvent.submit(getByLabelText("Password")); fireEvent.submit(getByLabelText("Password"));
}); });
await flushPromises(); await act(flushPromises);
// called again with auth // called again with auth
expect(mockClient.deleteMultipleDevices).toHaveBeenCalledWith([alicesMobileDevice.device_id], { expect(mockClient.deleteMultipleDevices).toHaveBeenCalledWith([alicesMobileDevice.device_id], {
@ -1032,7 +1032,7 @@ describe("<SessionManagerTab />", () => {
type: "m.id.user", type: "m.id.user",
user: aliceId, user: aliceId,
}, },
password: "", password: "topsecret",
type: "m.login.password", type: "m.login.password",
}); });
// devices refreshed // devices refreshed

7
test/unit-tests/components/views/settings/tabs/user/VoiceUserSettingsTab-test.tsx
View file

@ -58,17 +58,16 @@ describe("<VoiceUserSettingsTab />", () => {
describe("devices", () => { describe("devices", () => {
it("renders dropdowns for input devices", async () => { it("renders dropdowns for input devices", async () => {
render(getComponent()); render(getComponent());
await flushPromises();
expect(screen.getByLabelText("Microphone")).toHaveDisplayValue(audioIn1.label); await expect(screen.findByLabelText("Microphone")).resolves.toHaveDisplayValue(audioIn1.label);
expect(screen.getByLabelText("Camera")).toHaveDisplayValue(videoIn1.label); await expect(screen.findByLabelText("Camera")).resolves.toHaveDisplayValue(videoIn1.label);
}); });
it("updates device", async () => { it("updates device", async () => {
render(getComponent()); render(getComponent());
await flushPromises(); await flushPromises();
fireEvent.change(screen.getByLabelText("Camera"), { target: { value: videoIn2.deviceId } }); fireEvent.change(await screen.findByLabelText("Camera"), { target: { value: videoIn2.deviceId } });
expect(MediaDeviceHandlerMock.instance.setDevice).toHaveBeenCalledWith( expect(MediaDeviceHandlerMock.instance.setDevice).toHaveBeenCalledWith(
videoIn2.deviceId, videoIn2.deviceId,

32
test/unit-tests/components/views/settings/tabs/user/__snapshots__/AppearanceUserSettingsTab-test.tsx.snap
View file

@ -46,7 +46,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
disabled="" disabled=""
id="radix-0" id="radix-:r0:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -62,7 +62,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-0" for="radix-:r0:"
> >
Light Light
</label> </label>
@ -80,7 +80,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
disabled="" disabled=""
id="radix-1" id="radix-:r1:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -96,7 +96,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-1" for="radix-:r1:"
> >
Dark Dark
</label> </label>
@ -114,7 +114,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
disabled="" disabled=""
id="radix-2" id="radix-:r2:"
name="themeSelector" name="themeSelector"
title="" title=""
type="radio" type="radio"
@ -130,7 +130,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
> >
<label <label
class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label" class="_label_dgy0u_67 mx_ThemeChoicePanel_themeSelector_Label"
for="radix-2" for="radix-:r2:"
> >
High contrast High contrast
</label> </label>
@ -170,7 +170,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
<label <label
aria-label="Modern" aria-label="Modern"
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-3" for="radix-:r3:"
> >
<div <div
class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline" class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@ -181,7 +181,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
<input <input
checked="" checked=""
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-3" id="radix-:r3:"
name="layout" name="layout"
title="" title=""
type="radio" type="radio"
@ -297,7 +297,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
<label <label
aria-label="Message bubbles" aria-label="Message bubbles"
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-4" for="radix-:rc:"
> >
<div <div
class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline" class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@ -307,7 +307,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-4" id="radix-:rc:"
name="layout" name="layout"
title="" title=""
type="radio" type="radio"
@ -423,7 +423,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
<label <label
aria-label="IRC (experimental)" aria-label="IRC (experimental)"
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-5" for="radix-:rl:"
> >
<div <div
class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline" class="mxLayoutSwitcher_LayoutSelector_LayoutRadio_inline"
@ -433,7 +433,7 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
> >
<input <input
class="_input_1vw5h_26" class="_input_1vw5h_26"
id="radix-5" id="radix-:rl:"
name="layout" name="layout"
title="" title=""
type="radio" type="radio"
@ -557,9 +557,9 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
class="_container_qnvru_18" class="_container_qnvru_18"
> >
<input <input
aria-describedby="radix-6" aria-describedby="radix-:rv:"
class="_input_qnvru_32" class="_input_qnvru_32"
id="radix-7" id="radix-:ru:"
name="compactLayout" name="compactLayout"
title="" title=""
type="checkbox" type="checkbox"
@ -574,13 +574,13 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
> >
<label <label
class="_label_dgy0u_67" class="_label_dgy0u_67"
for="radix-7" for="radix-:ru:"
> >
Show compact text and messages Show compact text and messages
</label> </label>
<span <span
class="_message_dgy0u_98 _help-message_dgy0u_104" class="_message_dgy0u_98 _help-message_dgy0u_104"
id="radix-6" id="radix-:rv:"
> >
Modern layout must be selected to use this feature. Modern layout must be selected to use this feature.
</span> </span>

1
test/unit-tests/components/views/settings/tabs/user/__snapshots__/SecurityUserSettingsTab-test.tsx.snap
View file

@ -129,7 +129,6 @@ exports[`<SecurityUserSettingsTab /> renders security section 1`] = `
</th> </th>
<td> <td>
not found locally not found locally
</td> </td>
</tr> </tr>
<tr> <tr>

2
test/unit-tests/components/views/settings/tabs/user/__snapshots__/SessionManagerTab-test.tsx.snap
View file

@ -370,7 +370,7 @@ exports[`<SessionManagerTab /> goes to filtered list from security recommendatio
> >
<input <input
aria-label="Select all" aria-label="Select all"
aria-labelledby="floating-ui-142" aria-labelledby=":r4e:"
data-testid="device-select-all-checkbox" data-testid="device-select-all-checkbox"
id="device-select-all-checkbox" id="device-select-all-checkbox"
type="checkbox" type="checkbox"

13
test/unit-tests/components/views/spaces/__snapshots__/SpacePanel-test.tsx.snap
View file

@ -229,12 +229,12 @@ exports[`<SpacePanel /> should show all activated MetaSpaces in the correct orde
class="mx_ThreadsActivityCentre_container" class="mx_ThreadsActivityCentre_container"
> >
<button <button
aria-controls="floating-ui-40" aria-controls=":r12:"
aria-describedby="floating-ui-40" aria-describedby=":r12:"
aria-expanded="true" aria-expanded="true"
aria-haspopup="dialog" aria-haspopup="dialog"
aria-label="Threads" aria-label="Threads"
aria-labelledby="floating-ui-33" aria-labelledby=":r14:"
class="_icon-button_bh2qc_17 mx_ThreadsActivityCentreButton" class="_icon-button_bh2qc_17 mx_ThreadsActivityCentreButton"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -258,6 +258,11 @@ exports[`<SpacePanel /> should show all activated MetaSpaces in the correct orde
</svg> </svg>
</div> </div>
</button> </button>
<span
aria-hidden="true"
style="border: 0px; height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: fixed; white-space: nowrap; width: 1px; top: 0px; left: 0px;"
tabindex="-1"
/>
<span <span
data-floating-ui-focus-guard="" data-floating-ui-focus-guard=""
data-type="outside" data-type="outside"
@ -266,7 +271,7 @@ exports[`<SpacePanel /> should show all activated MetaSpaces in the correct orde
tabindex="0" tabindex="0"
/> />
<span <span
aria-owns="undefined" aria-owns=":r19:"
style="border: 0px; height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: fixed; white-space: nowrap; width: 1px; top: 0px; left: 0px;" style="border: 0px; height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: fixed; white-space: nowrap; width: 1px; top: 0px; left: 0px;"
/> />
<span <span

72
test/unit-tests/components/views/spaces/__snapshots__/ThreadsActivityCentre-test.tsx.snap
View file

@ -2,7 +2,7 @@
exports[`ThreadsActivityCentre renders notifications matching the snapshot 1`] = ` exports[`ThreadsActivityCentre renders notifications matching the snapshot 1`] = `
<div <div
aria-labelledby="radix-16" aria-labelledby="radix-:r33:"
aria-orientation="vertical" aria-orientation="vertical"
class="_menu_1x5h1_17" class="_menu_1x5h1_17"
data-align="start" data-align="start"
@ -11,14 +11,14 @@ exports[`ThreadsActivityCentre renders notifications matching the snapshot 1`] =
data-side="top" data-side="top"
data-state="open" data-state="open"
dir="ltr" dir="ltr"
id="radix-17" id="radix-:r34:"
role="menu" role="menu"
style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;" style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;"
tabindex="-1" tabindex="-1"
> >
<h3 <h3
class="_typography_yh5dq_162 _font-body-sm-semibold_yh5dq_45 _title_1x5h1_83" class="_typography_yh5dq_162 _font-body-sm-semibold_yh5dq_45 _title_1x5h1_83"
id=":r6:" id=":r3b:"
> >
Threads activity Threads activity
</h3> </h3>
@ -145,15 +145,15 @@ exports[`ThreadsActivityCentre should close the release announcement when the TA
class="mx_ThreadsActivityCentre_container" class="mx_ThreadsActivityCentre_container"
> >
<button <button
aria-controls="radix-3" aria-controls="radix-:r1d:"
aria-disabled="false" aria-disabled="false"
aria-expanded="true" aria-expanded="true"
aria-haspopup="menu" aria-haspopup="menu"
aria-label="Threads" aria-label="Threads"
aria-labelledby="floating-ui-42" aria-labelledby=":r1e:"
class="_icon-button_bh2qc_17 mx_ThreadsActivityCentreButton" class="_icon-button_bh2qc_17 mx_ThreadsActivityCentreButton"
data-state="open" data-state="open"
id="radix-2" id="radix-:r1c:"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
tabindex="0" tabindex="0"
@ -183,10 +183,11 @@ exports[`ThreadsActivityCentre should close the release announcement when the TA
aria-hidden="true" aria-hidden="true"
data-aria-hidden="true" data-aria-hidden="true"
data-floating-ui-portal="" data-floating-ui-portal=""
id="floating-ui-46" id=":r1i:"
> >
<div <div
class="_tooltip_1pslb_17 _invisible_1pslb_30" class="_tooltip_1pslb_17 _invisible_1pslb_30"
data-floating-ui-focusable=""
style="position: absolute; left: 0px; top: 0px; transform: translate(6px, 5px);" style="position: absolute; left: 0px; top: 0px; transform: translate(6px, 5px);"
tabindex="-1" tabindex="-1"
> >
@ -203,7 +204,7 @@ exports[`ThreadsActivityCentre should close the release announcement when the TA
stroke="none" stroke="none"
/> />
<clippath <clippath
id="floating-ui-47" id=":r1j:"
> >
<rect <rect
height="10" height="10"
@ -214,7 +215,7 @@ exports[`ThreadsActivityCentre should close the release announcement when the TA
</clippath> </clippath>
</svg> </svg>
<span <span
id="floating-ui-42" id=":r1e:"
> >
Threads Threads
</span> </span>
@ -226,7 +227,7 @@ exports[`ThreadsActivityCentre should close the release announcement when the TA
style="position: fixed; left: 0px; top: 0px; transform: translate(0px, -8px); min-width: max-content; --radix-popper-available-width: 0px; --radix-popper-available-height: -8px; --radix-popper-anchor-width: 0px; --radix-popper-anchor-height: 0px; --radix-popper-transform-origin: 0% 0px;" style="position: fixed; left: 0px; top: 0px; transform: translate(0px, -8px); min-width: max-content; --radix-popper-available-width: 0px; --radix-popper-available-height: -8px; --radix-popper-anchor-width: 0px; --radix-popper-anchor-height: 0px; --radix-popper-transform-origin: 0% 0px;"
> >
<div <div
aria-labelledby="radix-2" aria-labelledby="radix-:r1c:"
aria-orientation="vertical" aria-orientation="vertical"
class="_menu_1x5h1_17" class="_menu_1x5h1_17"
data-align="start" data-align="start"
@ -235,14 +236,14 @@ exports[`ThreadsActivityCentre should close the release announcement when the TA
data-side="top" data-side="top"
data-state="open" data-state="open"
dir="ltr" dir="ltr"
id="radix-3" id="radix-:r1d:"
role="menu" role="menu"
style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;" style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;"
tabindex="-1" tabindex="-1"
> >
<h3 <h3
class="_typography_yh5dq_162 _font-body-sm-semibold_yh5dq_45 _title_1x5h1_83" class="_typography_yh5dq_162 _font-body-sm-semibold_yh5dq_45 _title_1x5h1_83"
id=":r1:" id=":r1k:"
> >
Threads activity Threads activity
</h3> </h3>
@ -269,7 +270,7 @@ exports[`ThreadsActivityCentre should close the release announcement when the TA
exports[`ThreadsActivityCentre should match snapshot when empty 1`] = ` exports[`ThreadsActivityCentre should match snapshot when empty 1`] = `
<div <div
aria-labelledby="radix-22" aria-labelledby="radix-:r3n:"
aria-orientation="vertical" aria-orientation="vertical"
class="_menu_1x5h1_17" class="_menu_1x5h1_17"
data-align="start" data-align="start"
@ -278,14 +279,14 @@ exports[`ThreadsActivityCentre should match snapshot when empty 1`] = `
data-side="top" data-side="top"
data-state="open" data-state="open"
dir="ltr" dir="ltr"
id="radix-23" id="radix-:r3o:"
role="menu" role="menu"
style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;" style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;"
tabindex="-1" tabindex="-1"
> >
<h3 <h3
class="_typography_yh5dq_162 _font-body-sm-semibold_yh5dq_45 _title_1x5h1_83" class="_typography_yh5dq_162 _font-body-sm-semibold_yh5dq_45 _title_1x5h1_83"
id=":r8:" id=":r3v:"
> >
Threads activity Threads activity
</h3> </h3>
@ -303,7 +304,7 @@ exports[`ThreadsActivityCentre should match snapshot when empty 1`] = `
exports[`ThreadsActivityCentre should order the room with the same notification level by most recent 1`] = ` exports[`ThreadsActivityCentre should order the room with the same notification level by most recent 1`] = `
<div <div
aria-labelledby="radix-24" aria-labelledby="radix-:r40:"
aria-orientation="vertical" aria-orientation="vertical"
class="_menu_1x5h1_17" class="_menu_1x5h1_17"
data-align="start" data-align="start"
@ -312,14 +313,14 @@ exports[`ThreadsActivityCentre should order the room with the same notification
data-side="top" data-side="top"
data-state="open" data-state="open"
dir="ltr" dir="ltr"
id="radix-25" id="radix-:r41:"
role="menu" role="menu"
style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;" style="outline: none; --radix-dropdown-menu-content-transform-origin: var(--radix-popper-transform-origin); --radix-dropdown-menu-content-available-width: var(--radix-popper-available-width); --radix-dropdown-menu-content-available-height: var(--radix-popper-available-height); --radix-dropdown-menu-trigger-width: var(--radix-popper-anchor-width); --radix-dropdown-menu-trigger-height: var(--radix-popper-anchor-height); pointer-events: auto;"
tabindex="-1" tabindex="-1"
> >
<h3 <h3
class="_typography_yh5dq_162 _font-body-sm-semibold_yh5dq_45 _title_1x5h1_83" class="_typography_yh5dq_162 _font-body-sm-semibold_yh5dq_45 _title_1x5h1_83"
id=":r9:" id=":r48:"
> >
Threads activity Threads activity
</h3> </h3>
@ -483,12 +484,12 @@ exports[`ThreadsActivityCentre should render the release announcement 1`] = `
class="mx_ThreadsActivityCentre_container" class="mx_ThreadsActivityCentre_container"
> >
<button <button
aria-controls="floating-ui-8" aria-controls=":ra:"
aria-describedby="floating-ui-8" aria-describedby=":ra:"
aria-expanded="true" aria-expanded="true"
aria-haspopup="dialog" aria-haspopup="dialog"
aria-label="Threads" aria-label="Threads"
aria-labelledby="floating-ui-10" aria-labelledby=":rc:"
class="_icon-button_bh2qc_17 mx_ThreadsActivityCentreButton" class="_icon-button_bh2qc_17 mx_ThreadsActivityCentreButton"
role="button" role="button"
style="--cpd-icon-button-size: 32px;" style="--cpd-icon-button-size: 32px;"
@ -512,6 +513,11 @@ exports[`ThreadsActivityCentre should render the release announcement 1`] = `
</svg> </svg>
</div> </div>
</button> </button>
<span
aria-hidden="true"
style="border: 0px; height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: fixed; white-space: nowrap; width: 1px; top: 0px; left: 0px;"
tabindex="-1"
/>
<span <span
data-floating-ui-focus-guard="" data-floating-ui-focus-guard=""
data-type="outside" data-type="outside"
@ -520,7 +526,7 @@ exports[`ThreadsActivityCentre should render the release announcement 1`] = `
tabindex="0" tabindex="0"
/> />
<span <span
aria-owns="floating-ui-15" aria-owns=":rh:"
style="border: 0px; height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: fixed; white-space: nowrap; width: 1px; top: 0px; left: 0px;" style="border: 0px; height: 1px; margin: -1px; overflow: hidden; padding: 0px; position: fixed; white-space: nowrap; width: 1px; top: 0px; left: 0px;"
/> />
<span <span
@ -535,10 +541,11 @@ exports[`ThreadsActivityCentre should render the release announcement 1`] = `
<div <div
data-floating-ui-inert="" data-floating-ui-inert=""
data-floating-ui-portal="" data-floating-ui-portal=""
id="floating-ui-14" id=":rg:"
> >
<div <div
class="_tooltip_1pslb_17 _invisible_1pslb_30" class="_tooltip_1pslb_17 _invisible_1pslb_30"
data-floating-ui-focusable=""
style="position: absolute; left: 0px; top: 0px; transform: translate(0px, 0px);" style="position: absolute; left: 0px; top: 0px; transform: translate(0px, 0px);"
tabindex="-1" tabindex="-1"
> >
@ -555,7 +562,7 @@ exports[`ThreadsActivityCentre should render the release announcement 1`] = `
stroke="none" stroke="none"
/> />
<clippath <clippath
id="floating-ui-16" id=":ri:"
> >
<rect <rect
height="10" height="10"
@ -566,7 +573,7 @@ exports[`ThreadsActivityCentre should render the release announcement 1`] = `
</clippath> </clippath>
</svg> </svg>
<span <span
id="floating-ui-10" id=":rc:"
> >
Threads Threads
</span> </span>
@ -574,7 +581,7 @@ exports[`ThreadsActivityCentre should render the release announcement 1`] = `
</div> </div>
<div <div
data-floating-ui-portal="" data-floating-ui-portal=""
id="floating-ui-15" id=":rh:"
> >
<span <span
data-floating-ui-focus-guard="" data-floating-ui-focus-guard=""
@ -585,10 +592,11 @@ exports[`ThreadsActivityCentre should render the release announcement 1`] = `
tabindex="0" tabindex="0"
/> />
<div <div
aria-describedby="floating-ui-7" aria-describedby=":r9:"
aria-labelledby="floating-ui-6" aria-labelledby=":r8:"
class="_content_1oa1y_17" class="_content_1oa1y_17"
id="floating-ui-8" data-floating-ui-focusable=""
id=":ra:"
role="dialog" role="dialog"
style="position: absolute; left: 0px; top: 0px; transform: translate(0px, 0px);" style="position: absolute; left: 0px; top: 0px; transform: translate(0px, 0px);"
tabindex="-1" tabindex="-1"
@ -606,7 +614,7 @@ exports[`ThreadsActivityCentre should render the release announcement 1`] = `
stroke="none" stroke="none"
/> />
<clippath <clippath
id="floating-ui-17" id=":rj:"
> >
<rect <rect
height="20" height="20"
@ -618,13 +626,13 @@ exports[`ThreadsActivityCentre should render the release announcement 1`] = `
</svg> </svg>
<h3 <h3
class="_typography_yh5dq_162 _font-body-lg-semibold_yh5dq_83 _header_1oa1y_46" class="_typography_yh5dq_162 _font-body-lg-semibold_yh5dq_83 _header_1oa1y_46"
id="floating-ui-6" id=":r8:"
> >
Threads Activity Centre Threads Activity Centre
</h3> </h3>
<span <span
class="_typography_yh5dq_162 _font-body-sm-regular_yh5dq_40 _description_1oa1y_52" class="_typography_yh5dq_162 _font-body-sm-regular_yh5dq_40 _description_1oa1y_52"
id="floating-ui-7" id=":r9:"
> >
Threads notifications have moved, find them here from now on. Threads notifications have moved, find them here from now on.
</span> </span>

3
test/unit-tests/components/views/spaces/useUnreadThreadRooms-test.tsx
View file

@ -7,7 +7,6 @@
*/ */
import React from "react"; import React from "react";
import { renderHook } from "@testing-library/react-hooks";
import { import {
MatrixClient, MatrixClient,
MatrixEventEvent, MatrixEventEvent,
@ -15,7 +14,7 @@ import {
PendingEventOrdering, PendingEventOrdering,
Room, Room,
} from "matrix-js-sdk/src/matrix"; } from "matrix-js-sdk/src/matrix";
import { act } from "jest-matrix-react"; import { renderHook, act } from "jest-matrix-react";
import MatrixClientContext from "../../../../../src/contexts/MatrixClientContext"; import MatrixClientContext from "../../../../../src/contexts/MatrixClientContext";
import { stubClient } from "../../../../test-utils"; import { stubClient } from "../../../../test-utils";

2
test/unit-tests/components/views/voip/VideoFeed-test.tsx
View file

@ -54,7 +54,7 @@ describe("VideoFeed", () => {
removeListener: jest.fn(), removeListener: jest.fn(),
}; };
render(<VideoFeed feed={feed as unknown as CallFeed} call={mockCall as unknown as MatrixCall} />); render(<VideoFeed feed={feed as unknown as CallFeed} call={mockCall as unknown as MatrixCall} />);
const avatarImg = screen.getByRole("img"); const avatarImg = screen.getByRole("presentation");
expect(avatarImg).toHaveAttribute("src", FAKE_AVATAR_URL); expect(avatarImg).toHaveAttribute("src", FAKE_AVATAR_URL);
}); });
}); });

2
test/unit-tests/hooks/room/useRoomThreadNotifications-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. Please see LICENSE files in the repository root for full details.
*/ */
import { renderHook } from "@testing-library/react-hooks/dom"; import { renderHook } from "jest-matrix-react";
import { MatrixClient, NotificationCountType, Room } from "matrix-js-sdk/src/matrix"; import { MatrixClient, NotificationCountType, Room } from "matrix-js-sdk/src/matrix";
import { useRoomThreadNotifications } from "../../../../src/hooks/room/useRoomThreadNotifications"; import { useRoomThreadNotifications } from "../../../../src/hooks/room/useRoomThreadNotifications";

2
test/unit-tests/hooks/useDebouncedCallback-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. Please see LICENSE files in the repository root for full details.
*/ */
import { renderHook } from "@testing-library/react-hooks"; import { renderHook } from "jest-matrix-react";
import { useDebouncedCallback } from "../../../src/hooks/spotlight/useDebouncedCallback"; import { useDebouncedCallback } from "../../../src/hooks/spotlight/useDebouncedCallback";

4
test/unit-tests/hooks/useLatestResult-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. Please see LICENSE files in the repository root for full details.
*/ */
import { renderHook, RenderHookResult } from "@testing-library/react-hooks/dom"; import { renderHook, RenderHookResult } from "jest-matrix-react";
import { useLatestResult } from "../../../src/hooks/useLatestResult"; import { useLatestResult } from "../../../src/hooks/useLatestResult";
@ -20,7 +20,7 @@ beforeEach(() => {
}); });
function simulateRequest( function simulateRequest(
hookResult: RenderHookResult<typeof useLatestResult, ReturnType<typeof useLatestResult>>["result"], hookResult: RenderHookResult<ReturnType<typeof useLatestResult>, typeof useLatestResult>["result"],
{ id, delayInMs, result }: { id: string; delayInMs: number; result: string }, { id, delayInMs, result }: { id: string; delayInMs: number; result: string },
) { ) {
const [setQuery, setResult] = hookResult.current; const [setQuery, setResult] = hookResult.current;

3
test/unit-tests/hooks/useNotificationSettings-test.tsx
View file

@ -6,8 +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. Please see LICENSE files in the repository root for full details.
*/ */
import { renderHook } from "@testing-library/react-hooks/dom"; import { waitFor, renderHook } from "jest-matrix-react";
import { waitFor } from "jest-matrix-react";
import { IPushRules, MatrixClient, PushRuleKind, RuleId } from "matrix-js-sdk/src/matrix"; import { IPushRules, MatrixClient, PushRuleKind, RuleId } from "matrix-js-sdk/src/matrix";
import { useNotificationSettings } from "../../../src/hooks/useNotificationSettings"; import { useNotificationSettings } from "../../../src/hooks/useNotificationSettings";

3
test/unit-tests/hooks/useProfileInfo-test.tsx
View file

@ -6,8 +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. Please see LICENSE files in the repository root for full details.
*/ */
import { waitFor } from "jest-matrix-react"; import { waitFor, renderHook, act } from "jest-matrix-react";
import { renderHook, act } from "@testing-library/react-hooks/dom";
import { MatrixClient } from "matrix-js-sdk/src/matrix"; import { MatrixClient } from "matrix-js-sdk/src/matrix";
import { useProfileInfo } from "../../../src/hooks/useProfileInfo"; import { useProfileInfo } from "../../../src/hooks/useProfileInfo";

3
test/unit-tests/hooks/usePublicRoomDirectory-test.tsx
View file

@ -6,8 +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. Please see LICENSE files in the repository root for full details.
*/ */
import { waitFor } from "jest-matrix-react"; import { waitFor, renderHook, act } from "jest-matrix-react";
import { renderHook, act } from "@testing-library/react-hooks/dom";
import { IRoomDirectoryOptions, MatrixClient } from "matrix-js-sdk/src/matrix"; import { IRoomDirectoryOptions, MatrixClient } from "matrix-js-sdk/src/matrix";
import { usePublicRoomDirectory } from "../../../src/hooks/usePublicRoomDirectory"; import { usePublicRoomDirectory } from "../../../src/hooks/usePublicRoomDirectory";

3
test/unit-tests/hooks/useRoomMembers-test.tsx
View file

@ -6,8 +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. Please see LICENSE files in the repository root for full details.
*/ */
import { waitFor } from "jest-matrix-react"; import { waitFor, renderHook, act } from "jest-matrix-react";
import { renderHook, act } from "@testing-library/react-hooks/dom";
import { MatrixClient, MatrixEvent, Room } from "matrix-js-sdk/src/matrix"; import { MatrixClient, MatrixEvent, Room } from "matrix-js-sdk/src/matrix";
import { KnownMembership } from "matrix-js-sdk/src/types"; import { KnownMembership } from "matrix-js-sdk/src/types";

3
test/unit-tests/hooks/useSlidingSyncRoomSearch-test.tsx
View file

@ -6,8 +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. Please see LICENSE files in the repository root for full details.
*/ */
import { waitFor } from "jest-matrix-react"; import { waitFor, renderHook, act } from "jest-matrix-react";
import { renderHook, act } from "@testing-library/react-hooks/dom";
import { mocked } from "jest-mock"; import { mocked } from "jest-mock";
import { SlidingSync } from "matrix-js-sdk/src/sliding-sync"; import { SlidingSync } from "matrix-js-sdk/src/sliding-sync";
import { Room } from "matrix-js-sdk/src/matrix"; import { Room } from "matrix-js-sdk/src/matrix";

2
test/unit-tests/hooks/useUnreadNotifications-test.ts
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. Please see LICENSE files in the repository root for full details.
*/ */
import { renderHook } from "@testing-library/react-hooks"; import { renderHook } from "jest-matrix-react";
import { EventStatus, NotificationCountType, PendingEventOrdering, Room } from "matrix-js-sdk/src/matrix"; import { EventStatus, NotificationCountType, PendingEventOrdering, Room } from "matrix-js-sdk/src/matrix";
import { KnownMembership } from "matrix-js-sdk/src/types"; import { KnownMembership } from "matrix-js-sdk/src/types";

3
test/unit-tests/hooks/useUserDirectory-test.tsx
View file

@ -6,8 +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. Please see LICENSE files in the repository root for full details.
*/ */
import { waitFor } from "jest-matrix-react"; import { waitFor, renderHook, act } from "jest-matrix-react";
import { renderHook, act } from "@testing-library/react-hooks/dom";
import { MatrixClient } from "matrix-js-sdk/src/matrix"; import { MatrixClient } from "matrix-js-sdk/src/matrix";
import { useUserDirectory } from "../../../src/hooks/useUserDirectory"; import { useUserDirectory } from "../../../src/hooks/useUserDirectory";

3
test/unit-tests/hooks/useUserOnboardingTasks-test.tsx
View file

@ -7,8 +7,7 @@ Please see LICENSE files in the repository root for full details.
*/ */
import React from "react"; import React from "react";
import { renderHook } from "@testing-library/react-hooks"; import { renderHook, waitFor } from "jest-matrix-react";
import { waitFor } from "jest-matrix-react";
import { useUserOnboardingTasks } from "../../../src/hooks/useUserOnboardingTasks"; import { useUserOnboardingTasks } from "../../../src/hooks/useUserOnboardingTasks";
import { useUserOnboardingContext } from "../../../src/hooks/useUserOnboardingContext"; import { useUserOnboardingContext } from "../../../src/hooks/useUserOnboardingContext";

3
test/unit-tests/hooks/useWindowWidth-test.ts
View file

@ -6,8 +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. Please see LICENSE files in the repository root for full details.
*/ */
import { renderHook } from "@testing-library/react-hooks"; import { renderHook, act } from "jest-matrix-react";
import { act } from "jest-matrix-react";
import UIStore, { UI_EVENTS } from "../../../src/stores/UIStore"; import UIStore, { UI_EVENTS } from "../../../src/stores/UIStore";
import { useWindowWidth } from "../../../src/hooks/useWindowWidth"; import { useWindowWidth } from "../../../src/hooks/useWindowWidth";

1
webpack.config.js
View file

@ -218,6 +218,7 @@ module.exports = (env, argv) => {
// and matrix-events-sdk & matrix-widget-api // and matrix-events-sdk & matrix-widget-api
"matrix-events-sdk": path.resolve(__dirname, "node_modules/matrix-events-sdk"), "matrix-events-sdk": path.resolve(__dirname, "node_modules/matrix-events-sdk"),
"matrix-widget-api": path.resolve(__dirname, "node_modules/matrix-widget-api"), "matrix-widget-api": path.resolve(__dirname, "node_modules/matrix-widget-api"),
"oidc-client-ts": path.resolve(__dirname, "node_modules/oidc-client-ts"),
// Define a variable so the i18n stuff can load // Define a variable so the i18n stuff can load
"$webapp": path.resolve(__dirname, "webapp"), "$webapp": path.resolve(__dirname, "webapp"),

1608
yarn.lock
View file

File diff suppressed because it is too large Load diff