Improve randomString mock for better snapshots (#11375)

This commit is contained in:
Michael Telatynski
2023-08-09 09:39:48 +01:00
committed by GitHub
parent c3574c2050
commit 57a0d99dc8
49 changed files with 133 additions and 256 deletions
@@ -21,13 +21,6 @@ import * as TestUtils from "../../../test-utils";
import FontScalingPanel from "../../../../src/components/views/settings/FontScalingPanel";
import SettingsStore from "../../../../src/settings/SettingsStore";
// Fake random strings to give a predictable snapshot
jest.mock("matrix-js-sdk/src/randomstring", () => {
return {
randomString: () => "abdefghi",
};
});
describe("FontScalingPanel", () => {
it("renders the font scaling UI", () => {
TestUtils.stubClient();
@@ -45,11 +45,6 @@ jest.mock("matrix-js-sdk/src/logger");
// Avoid indirectly importing any eagerly created stores that would require extra setup
jest.mock("../../../../src/Notifier");
// Fake random strings to give a predictable snapshot for IDs
jest.mock("matrix-js-sdk/src/randomstring", () => ({
randomString: jest.fn(),
}));
const masterRule: IPushRule = {
actions: [PushRuleActionName.DontNotify],
conditions: [],
@@ -20,13 +20,6 @@ import { render } from "@testing-library/react";
import * as TestUtils from "../../../test-utils";
import ThemeChoicePanel from "../../../../src/components/views/settings/ThemeChoicePanel";
// Fake random strings to give a predictable snapshot
jest.mock("matrix-js-sdk/src/randomstring", () => {
return {
randomString: () => "abdefghi",
};
});
describe("ThemeChoicePanel", () => {
it("renders the theme choice UI", () => {
TestUtils.stubClient();
@@ -74,11 +74,11 @@ exports[`FontScalingPanel renders the font scaling UI 1`] = `
class="mx_Checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
id="checkbox_abdefghi"
id="checkbox_vY7Q4uEh9K"
type="checkbox"
/>
<label
for="checkbox_abdefghi"
for="checkbox_vY7Q4uEh9K"
>
<div
class="mx_Checkbox_background"
@@ -19,11 +19,6 @@ import React from "react";
import FilteredDeviceListHeader from "../../../../../src/components/views/settings/devices/FilteredDeviceListHeader";
// Fake random strings to give a predictable snapshot for IDs
jest.mock("matrix-js-sdk/src/randomstring", () => ({
randomString: () => "abdefghi",
}));
describe("<FilteredDeviceListHeader />", () => {
const defaultProps = {
selectedDeviceCount: 0,
@@ -7,7 +7,7 @@ exports[`<FilteredDeviceListHeader /> renders correctly when all devices are sel
data-testid="test123"
>
<div
aria-describedby="mx_TooltipTarget_abdefghi"
aria-describedby="mx_TooltipTarget_vY7Q4uEh"
tabindex="0"
>
<span
@@ -52,7 +52,7 @@ exports[`<FilteredDeviceListHeader /> renders correctly when no devices are sele
data-testid="test123"
>
<div
aria-describedby="mx_TooltipTarget_abdefghi"
aria-describedby="mx_TooltipTarget_vY7Q4uEh"
tabindex="0"
>
<span
@@ -22,26 +22,9 @@ import NotificationSettings2 from "../../../../../src/components/views/settings/
import MatrixClientContext from "../../../../../src/contexts/MatrixClientContext";
import { MatrixClientPeg } from "../../../../../src/MatrixClientPeg";
import { StandardActions } from "../../../../../src/notifications/StandardActions";
import { PredictableRandom } from "../../../../predictableRandom";
import { mkMessage, stubClient } from "../../../../test-utils";
import Mock = jest.Mock;
const mockRandom = new PredictableRandom();
// Fake random strings to give a predictable snapshot for IDs
jest.mock("matrix-js-sdk/src/randomstring", () => ({
randomString: jest.fn((len): string => {
const chars = "ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789";
let ret = "";
for (let i = 0; i < len; ++i) {
ret += chars.charAt(Math.floor(mockRandom.get() * chars.length));
}
return ret;
}),
}));
const waitForUpdate = (): Promise<void> => new Promise((resolve) => setTimeout(resolve));
const labelGlobalMute = "Enable notifications for this account";
@@ -80,8 +63,6 @@ describe("<Notifications />", () => {
cli.deletePushRule = jest.fn(cli.deletePushRule).mockResolvedValue({});
cli.removePusher = jest.fn(cli.removePusher).mockResolvedValue({});
cli.setPusher = jest.fn(cli.setPusher).mockResolvedValue({});
mockRandom.reset();
});
it("matches the snapshot", async () => {
@@ -26,7 +26,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
class="mx_SettingsFlag_label"
>
<div
id="mx_LabelledToggleSwitch_7Qu"
id="mx_LabelledToggleSwitch_vY7Q4uEh9K38"
>
Enable notifications for this account
</div>
@@ -34,7 +34,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<div
aria-checked="true"
aria-disabled="true"
aria-labelledby="mx_LabelledToggleSwitch_7Qu"
aria-labelledby="mx_LabelledToggleSwitch_vY7Q4uEh9K38"
class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on"
role="switch"
tabindex="0"
@@ -51,7 +51,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
class="mx_SettingsFlag_label"
>
<div
id="mx_LabelledToggleSwitch_QUoKa"
id="mx_LabelledToggleSwitch_QgU2PomxwKpa"
>
Enable desktop notifications for this session
</div>
@@ -59,7 +59,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<div
aria-checked="false"
aria-disabled="false"
aria-labelledby="mx_LabelledToggleSwitch_QUoKa"
aria-labelledby="mx_LabelledToggleSwitch_QgU2PomxwKpa"
class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
role="switch"
tabindex="0"
@@ -76,7 +76,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
class="mx_SettingsFlag_label"
>
<div
id="mx_LabelledToggleSwitch_eB"
id="mx_LabelledToggleSwitch_6hpi3YEetmBG"
>
Show message preview in desktop notification
</div>
@@ -84,7 +84,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<div
aria-checked="false"
aria-disabled="false"
aria-labelledby="mx_LabelledToggleSwitch_eB"
aria-labelledby="mx_LabelledToggleSwitch_6hpi3YEetmBG"
class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
role="switch"
tabindex="0"
@@ -101,7 +101,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
class="mx_SettingsFlag_label"
>
<div
id="mx_LabelledToggleSwitch_yfi"
id="mx_LabelledToggleSwitch_4yVCeEefiPqp"
>
Enable audible notifications for this session
</div>
@@ -109,7 +109,7 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<div
aria-checked="true"
aria-disabled="false"
aria-labelledby="mx_LabelledToggleSwitch_yfi"
aria-labelledby="mx_LabelledToggleSwitch_4yVCeEefiPqp"
class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
role="switch"
tabindex="0"
@@ -246,11 +246,11 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<input
checked=""
disabled=""
id="checkbox_MRMG"
id="checkbox_MRMwbPDmfG"
type="checkbox"
/>
<label
for="checkbox_MRMG"
for="checkbox_MRMwbPDmfG"
>
<div
class="mx_Checkbox_background"
@@ -280,11 +280,11 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<input
checked=""
disabled=""
id="checkbox_W9"
id="checkbox_tmGQvdMWe9"
type="checkbox"
/>
<label
for="checkbox_W9"
for="checkbox_tmGQvdMWe9"
>
<div
class="mx_Checkbox_background"
@@ -314,11 +314,11 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<input
checked=""
disabled=""
id="checkbox_A5Cs"
id="checkbox_54DVIAu5Cs"
type="checkbox"
/>
<label
for="checkbox_A5Cs"
for="checkbox_54DVIAu5Cs"
>
<div
class="mx_Checkbox_background"
@@ -365,11 +365,11 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<input
checked=""
disabled=""
id="checkbox_RDn"
id="checkbox_iHRD7nyrA2"
type="checkbox"
/>
<label
for="checkbox_RDn"
for="checkbox_iHRD7nyrA2"
>
<div
class="mx_Checkbox_background"
@@ -398,11 +398,11 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
>
<input
disabled=""
id="checkbox_jV"
id="checkbox_ohjWVJIPau"
type="checkbox"
/>
<label
for="checkbox_jV"
for="checkbox_ohjWVJIPau"
>
<div
class="mx_Checkbox_background"
@@ -432,11 +432,11 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<input
checked=""
disabled=""
id="checkbox_1Oid"
id="checkbox_y1OmnTidX4"
type="checkbox"
/>
<label
for="checkbox_1Oid"
for="checkbox_y1OmnTidX4"
>
<div
class="mx_Checkbox_background"
@@ -504,11 +504,11 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<input
checked=""
disabled=""
id="checkbox_PW"
id="checkbox_ePDS0OpWwA"
type="checkbox"
/>
<label
for="checkbox_PW"
for="checkbox_ePDS0OpWwA"
>
<div
class="mx_Checkbox_background"
@@ -538,11 +538,11 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<input
checked=""
disabled=""
id="checkbox_N"
id="checkbox_HG75JNTNkN"
type="checkbox"
/>
<label
for="checkbox_N"
for="checkbox_HG75JNTNkN"
>
<div
class="mx_Checkbox_background"
@@ -572,11 +572,11 @@ exports[`<Notifications /> correctly handles the loading/disabled state 1`] = `
<input
checked=""
disabled=""
id="checkbox_4rTRs"
id="checkbox_U64raTLcRs"
type="checkbox"
/>
<label
for="checkbox_4rTRs"
for="checkbox_U64raTLcRs"
>
<div
class="mx_Checkbox_background"
@@ -745,7 +745,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
class="mx_SettingsFlag_label"
>
<div
id="mx_LabelledToggleSwitch_7Qu"
id="mx_LabelledToggleSwitch_vY7Q4uEh9K38"
>
Enable notifications for this account
</div>
@@ -753,7 +753,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
<div
aria-checked="true"
aria-disabled="false"
aria-labelledby="mx_LabelledToggleSwitch_7Qu"
aria-labelledby="mx_LabelledToggleSwitch_vY7Q4uEh9K38"
class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
role="switch"
tabindex="0"
@@ -770,7 +770,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
class="mx_SettingsFlag_label"
>
<div
id="mx_LabelledToggleSwitch_QUoKa"
id="mx_LabelledToggleSwitch_QgU2PomxwKpa"
>
Enable desktop notifications for this session
</div>
@@ -778,7 +778,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
<div
aria-checked="false"
aria-disabled="false"
aria-labelledby="mx_LabelledToggleSwitch_QUoKa"
aria-labelledby="mx_LabelledToggleSwitch_QgU2PomxwKpa"
class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
role="switch"
tabindex="0"
@@ -795,7 +795,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
class="mx_SettingsFlag_label"
>
<div
id="mx_LabelledToggleSwitch_eB"
id="mx_LabelledToggleSwitch_6hpi3YEetmBG"
>
Show message preview in desktop notification
</div>
@@ -803,7 +803,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
<div
aria-checked="false"
aria-disabled="false"
aria-labelledby="mx_LabelledToggleSwitch_eB"
aria-labelledby="mx_LabelledToggleSwitch_6hpi3YEetmBG"
class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_enabled"
role="switch"
tabindex="0"
@@ -820,7 +820,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
class="mx_SettingsFlag_label"
>
<div
id="mx_LabelledToggleSwitch_yfi"
id="mx_LabelledToggleSwitch_4yVCeEefiPqp"
>
Enable audible notifications for this session
</div>
@@ -828,7 +828,7 @@ exports[`<Notifications /> matches the snapshot 1`] = `
<div
aria-checked="true"
aria-disabled="false"
aria-labelledby="mx_LabelledToggleSwitch_yfi"
aria-labelledby="mx_LabelledToggleSwitch_4yVCeEefiPqp"
class="mx_AccessibleButton mx_ToggleSwitch mx_ToggleSwitch_on mx_ToggleSwitch_enabled"
role="switch"
tabindex="0"
@@ -961,11 +961,11 @@ exports[`<Notifications /> matches the snapshot 1`] = `
>
<input
checked=""
id="checkbox_MRMG"
id="checkbox_MRMwbPDmfG"
type="checkbox"
/>
<label
for="checkbox_MRMG"
for="checkbox_MRMwbPDmfG"
>
<div
class="mx_Checkbox_background"
@@ -994,11 +994,11 @@ exports[`<Notifications /> matches the snapshot 1`] = `
>
<input
checked=""
id="checkbox_W9"
id="checkbox_tmGQvdMWe9"
type="checkbox"
/>
<label
for="checkbox_W9"
for="checkbox_tmGQvdMWe9"
>
<div
class="mx_Checkbox_background"
@@ -1027,11 +1027,11 @@ exports[`<Notifications /> matches the snapshot 1`] = `
>
<input
checked=""
id="checkbox_A5Cs"
id="checkbox_54DVIAu5Cs"
type="checkbox"
/>
<label
for="checkbox_A5Cs"
for="checkbox_54DVIAu5Cs"
>
<div
class="mx_Checkbox_background"
@@ -1077,11 +1077,11 @@ exports[`<Notifications /> matches the snapshot 1`] = `
>
<input
checked=""
id="checkbox_RDn"
id="checkbox_iHRD7nyrA2"
type="checkbox"
/>
<label
for="checkbox_RDn"
for="checkbox_iHRD7nyrA2"
>
<div
class="mx_Checkbox_background"
@@ -1109,11 +1109,11 @@ exports[`<Notifications /> matches the snapshot 1`] = `
class="mx_Checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
id="checkbox_jV"
id="checkbox_ohjWVJIPau"
type="checkbox"
/>
<label
for="checkbox_jV"
for="checkbox_ohjWVJIPau"
>
<div
class="mx_Checkbox_background"
@@ -1142,11 +1142,11 @@ exports[`<Notifications /> matches the snapshot 1`] = `
>
<input
checked=""
id="checkbox_1Oid"
id="checkbox_y1OmnTidX4"
type="checkbox"
/>
<label
for="checkbox_1Oid"
for="checkbox_y1OmnTidX4"
>
<div
class="mx_Checkbox_background"
@@ -1213,11 +1213,11 @@ exports[`<Notifications /> matches the snapshot 1`] = `
>
<input
checked=""
id="checkbox_PW"
id="checkbox_ePDS0OpWwA"
type="checkbox"
/>
<label
for="checkbox_PW"
for="checkbox_ePDS0OpWwA"
>
<div
class="mx_Checkbox_background"
@@ -1246,11 +1246,11 @@ exports[`<Notifications /> matches the snapshot 1`] = `
>
<input
checked=""
id="checkbox_N"
id="checkbox_HG75JNTNkN"
type="checkbox"
/>
<label
for="checkbox_N"
for="checkbox_HG75JNTNkN"
>
<div
class="mx_Checkbox_background"
@@ -1279,11 +1279,11 @@ exports[`<Notifications /> matches the snapshot 1`] = `
>
<input
checked=""
id="checkbox_4rTRs"
id="checkbox_U64raTLcRs"
type="checkbox"
/>
<label
for="checkbox_4rTRs"
for="checkbox_U64raTLcRs"
>
<div
class="mx_Checkbox_background"
@@ -1523,11 +1523,11 @@ exports[`<Notifications /> matches the snapshot 1`] = `
class="mx_Checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
id="checkbox_Yn"
id="checkbox_QRlYy75nfv"
type="checkbox"
/>
<label
for="checkbox_Yn"
for="checkbox_QRlYy75nfv"
>
<div
class="mx_Checkbox_background"
@@ -21,11 +21,6 @@ import { MatrixClient } from "matrix-js-sdk/src/matrix";
import AppearanceUserSettingsTab from "../../../../../../src/components/views/settings/tabs/user/AppearanceUserSettingsTab";
import { withClientContextRenderOptions, stubClient } from "../../../../../test-utils";
// Fake random strings to give a predictable snapshot
jest.mock("matrix-js-sdk/src/randomstring", () => ({
randomString: () => "abdefghi",
}));
describe("AppearanceUserSettingsTab", () => {
let client: MatrixClient;
@@ -54,11 +54,6 @@ import { getClientInformationEventType } from "../../../../../../src/utils/devic
mockPlatformPeg();
// Fake random strings to give a predictable snapshot for IDs
jest.mock("matrix-js-sdk/src/randomstring", () => ({
randomString: () => "abdefghi",
}));
describe("<SessionManagerTab />", () => {
const aliceId = "@alice:server.org";
const deviceId = "alices_device";
@@ -24,12 +24,6 @@ import { MetaSpace } from "../../../../../../src/stores/spaces";
import { SettingLevel } from "../../../../../../src/settings/SettingLevel";
import { flushPromises } from "../../../../../test-utils";
// used by checkbox to relate labels to inputs
// make it stable for snapshot testing
jest.mock("matrix-js-sdk/src/randomstring", () => ({
randomString: jest.fn().mockReturnValue("abcd"),
}));
describe("<SidebarUserSettingsTab />", () => {
beforeEach(() => {
jest.spyOn(PosthogTrackers, "trackInteraction").mockClear();
@@ -303,11 +303,11 @@ exports[`AppearanceUserSettingsTab should render 1`] = `
class="mx_Checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
id="checkbox_abdefghi"
id="checkbox_vY7Q4uEh9K"
type="checkbox"
/>
<label
for="checkbox_abdefghi"
for="checkbox_vY7Q4uEh9K"
>
<div
class="mx_Checkbox_background"
@@ -328,7 +328,7 @@ exports[`<SessionManagerTab /> goes to filtered list from security recommendatio
class="mx_FilteredDeviceListHeader"
>
<div
aria-describedby="mx_TooltipTarget_abdefghi"
aria-describedby="mx_TooltipTarget_vY7Q4uEh"
tabindex="0"
>
<span
@@ -49,11 +49,11 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings 1`] = `
<input
checked=""
disabled=""
id="checkbox_abcd"
id="checkbox_vY7Q4uEh9K"
type="checkbox"
/>
<label
for="checkbox_abcd"
for="checkbox_vY7Q4uEh9K"
>
<div
class="mx_Checkbox_background"
@@ -82,11 +82,11 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings 1`] = `
>
<input
data-testid="mx_SidebarUserSettingsTab_homeAllRoomsCheckbox"
id="checkbox_abcd"
id="checkbox_38QgU2Pomx"
type="checkbox"
/>
<label
for="checkbox_abcd"
for="checkbox_38QgU2Pomx"
>
<div
class="mx_Checkbox_background"
@@ -113,11 +113,11 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings 1`] = `
class="mx_Checkbox mx_SidebarUserSettingsTab_checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
id="checkbox_abcd"
id="checkbox_wKpa6hpi3Y"
type="checkbox"
/>
<label
for="checkbox_abcd"
for="checkbox_wKpa6hpi3Y"
>
<div
class="mx_Checkbox_background"
@@ -145,11 +145,11 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings 1`] = `
class="mx_Checkbox mx_SidebarUserSettingsTab_checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
id="checkbox_abcd"
id="checkbox_EetmBG4yVC"
type="checkbox"
/>
<label
for="checkbox_abcd"
for="checkbox_EetmBG4yVC"
>
<div
class="mx_Checkbox_background"
@@ -177,11 +177,11 @@ exports[`<SidebarUserSettingsTab /> renders sidebar settings 1`] = `
class="mx_Checkbox mx_SidebarUserSettingsTab_checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
id="checkbox_abcd"
id="checkbox_eEefiPqpMR"
type="checkbox"
/>
<label
for="checkbox_abcd"
for="checkbox_eEefiPqpMR"
>
<div
class="mx_Checkbox_background"