Revert "Make EC widget theme reactive - Update widget url when the theme chan…" (#12382)
This reverts commitc42562ef39. (cherry picked from commit75a989e409)
This commit is contained in:
Will Hunt
github-actions[bot]
parent
faf7b04899
commit
2603003745
7 changed files with 23 additions and 172 deletions
|
|
@ -19,7 +19,7 @@ import { jest } from "@jest/globals";
|
|||
import { Room, MatrixClient } from "matrix-js-sdk/src/matrix";
|
||||
import { ClientWidgetApi, IWidget, MatrixWidgetType } from "matrix-widget-api";
|
||||
import { Optional } from "matrix-events-sdk";
|
||||
import { act, render, RenderResult, waitFor } from "@testing-library/react";
|
||||
import { act, render, RenderResult } from "@testing-library/react";
|
||||
import userEvent from "@testing-library/user-event";
|
||||
import { SpiedFunction } from "jest-mock";
|
||||
import {
|
||||
|
|
@ -50,8 +50,6 @@ import { ElementWidget } from "../../../../src/stores/widgets/StopGapWidget";
|
|||
import { WidgetMessagingStore } from "../../../../src/stores/widgets/WidgetMessagingStore";
|
||||
import { ModuleRunner } from "../../../../src/modules/ModuleRunner";
|
||||
import { RoomPermalinkCreator } from "../../../../src/utils/permalinks/Permalinks";
|
||||
import { SettingLevel } from "../../../../src/settings/SettingLevel";
|
||||
import { WidgetType } from "../../../../src/widgets/WidgetType";
|
||||
|
||||
jest.mock("../../../../src/stores/OwnProfileStore", () => ({
|
||||
OwnProfileStore: {
|
||||
|
|
@ -70,7 +68,6 @@ describe("AppTile", () => {
|
|||
const resizeNotifier = new ResizeNotifier();
|
||||
let app1: IApp;
|
||||
let app2: IApp;
|
||||
let appElementCall: IApp;
|
||||
|
||||
const waitForRps = (roomId: string) =>
|
||||
new Promise<void>((resolve) => {
|
||||
|
|
@ -123,17 +120,6 @@ describe("AppTile", () => {
|
|||
creatorUserId: cli.getSafeUserId(),
|
||||
avatar_url: undefined,
|
||||
};
|
||||
appElementCall = {
|
||||
id: "1",
|
||||
eventId: "2",
|
||||
roomId: "r2",
|
||||
type: WidgetType.CALL.preferred,
|
||||
url: "https://example.com#theme=$org.matrix.msc2873.client_theme",
|
||||
name: "Element Call",
|
||||
creatorUserId: cli.getSafeUserId(),
|
||||
avatar_url: undefined,
|
||||
};
|
||||
|
||||
jest.spyOn(WidgetStore.instance, "getApps").mockImplementation((roomId: string): Array<IApp> => {
|
||||
if (roomId === "r1") return [app1];
|
||||
if (roomId === "r2") return [app2];
|
||||
|
|
@ -453,6 +439,7 @@ describe("AppTile", () => {
|
|||
expect(moveToContainerSpy).toHaveBeenCalledWith(r1, app1, Container.Top);
|
||||
});
|
||||
});
|
||||
|
||||
describe("with an existing widgetApi with requiresClient = false", () => {
|
||||
beforeEach(() => {
|
||||
const api = {
|
||||
|
|
@ -479,68 +466,6 @@ describe("AppTile", () => {
|
|||
});
|
||||
});
|
||||
|
||||
describe("with an element call widget", () => {
|
||||
beforeEach(() => {
|
||||
document.body.style.setProperty("--custom-color", "red");
|
||||
document.body.style.setProperty("normal-color", "blue");
|
||||
});
|
||||
it("should update the widget url on theme change", async () => {
|
||||
const renderResult = render(
|
||||
<MatrixClientContext.Provider value={cli}>
|
||||
<a href="http://themeb" data-mx-theme="light">
|
||||
A
|
||||
</a>
|
||||
<a href="http://themeA" data-mx-theme="dark">
|
||||
B
|
||||
</a>
|
||||
<AppTile key={appElementCall.id} app={appElementCall} room={r1} />
|
||||
</MatrixClientContext.Provider>,
|
||||
);
|
||||
await waitFor(() => {
|
||||
expect(renderResult.getByTestId("widget-app-tile").dataset.testWidgetUrl).toEqual(
|
||||
"https://example.com/?widgetId=1&parentUrl=http%3A%2F%2Flocalhost%2F#theme=light",
|
||||
);
|
||||
});
|
||||
await SettingsStore.setValue("theme", null, SettingLevel.DEVICE, "dark");
|
||||
await waitFor(() => {
|
||||
expect(renderResult.getByTestId("widget-app-tile").dataset.testWidgetUrl).toEqual(
|
||||
"https://example.com/?widgetId=1&parentUrl=http%3A%2F%2Flocalhost%2F#theme=dark",
|
||||
);
|
||||
});
|
||||
await SettingsStore.setValue("theme", null, SettingLevel.DEVICE, "light");
|
||||
await waitFor(() => {
|
||||
expect(renderResult.getByTestId("widget-app-tile").dataset.testWidgetUrl).toEqual(
|
||||
"https://example.com/?widgetId=1&parentUrl=http%3A%2F%2Flocalhost%2F#theme=light",
|
||||
);
|
||||
});
|
||||
});
|
||||
it("should not update the widget url for non Element Call widgets on theme change", async () => {
|
||||
const appNonElementCall = { ...appElementCall, type: MatrixWidgetType.Custom };
|
||||
const renderResult = render(
|
||||
<MatrixClientContext.Provider value={cli}>
|
||||
<a href="http://themeb" data-mx-theme="light">
|
||||
A
|
||||
</a>
|
||||
<a href="http://themeA" data-mx-theme="dark">
|
||||
B
|
||||
</a>
|
||||
<AppTile key={appNonElementCall.id} app={appNonElementCall} room={r1} />
|
||||
</MatrixClientContext.Provider>,
|
||||
);
|
||||
await waitFor(() => {
|
||||
expect(renderResult.getByTestId("widget-app-tile").dataset.testWidgetUrl).toEqual(
|
||||
"https://example.com/?widgetId=1&parentUrl=http%3A%2F%2Flocalhost%2F#theme=light",
|
||||
);
|
||||
});
|
||||
await SettingsStore.setValue("theme", null, SettingLevel.DEVICE, "dark");
|
||||
await waitFor(() => {
|
||||
expect(renderResult.getByTestId("widget-app-tile").dataset.testWidgetUrl).toEqual(
|
||||
"https://example.com/?widgetId=1&parentUrl=http%3A%2F%2Flocalhost%2F#theme=light",
|
||||
);
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
describe("for a persistent app", () => {
|
||||
let renderResult: RenderResult;
|
||||
|
||||
|
|
|
|||
|
|
@ -85,8 +85,6 @@ exports[`AppTile for a persistent app should render 1`] = `
|
|||
>
|
||||
<div
|
||||
class="mx_AppTile_persistedWrapper"
|
||||
data-test-widget-url="https://example.com/?widgetId=1&parentUrl=http%3A%2F%2Flocalhost%2F"
|
||||
data-testid="widget-app-tile"
|
||||
>
|
||||
<div />
|
||||
</div>
|
||||
|
|
@ -174,8 +172,6 @@ exports[`AppTile for a pinned widget should render 1`] = `
|
|||
</div>
|
||||
<div
|
||||
class="mx_AppTile_persistedWrapper"
|
||||
data-test-widget-url="https://example.com/?widgetId=1&parentUrl=http%3A%2F%2Flocalhost%2F"
|
||||
data-testid="widget-app-tile"
|
||||
>
|
||||
<div />
|
||||
</div>
|
||||
|
|
|
|||
|
|
@ -28,7 +28,6 @@ import { VoiceBroadcastInfoEventType, VoiceBroadcastRecording } from "../../../s
|
|||
import { SdkContextClass } from "../../../src/contexts/SDKContext";
|
||||
import ActiveWidgetStore from "../../../src/stores/ActiveWidgetStore";
|
||||
import SettingsStore from "../../../src/settings/SettingsStore";
|
||||
import * as Theme from "../../../src/theme";
|
||||
|
||||
jest.mock("matrix-widget-api/lib/ClientWidgetApi");
|
||||
|
||||
|
|
@ -64,46 +63,18 @@ describe("StopGapWidget", () => {
|
|||
widget.stopMessaging();
|
||||
});
|
||||
|
||||
describe("url template", () => {
|
||||
it("should replace parameters in widget url template", () => {
|
||||
const originalGetValue = SettingsStore.getValue;
|
||||
const spy = jest.spyOn(SettingsStore, "getValue").mockImplementation((setting) => {
|
||||
if (setting === "theme") return "my-theme-for-testing";
|
||||
return originalGetValue(setting);
|
||||
});
|
||||
expect(widget.embedUrl).toBe(
|
||||
"https://example.org/?user-id=%40userId%3Amatrix.org&device-id=ABCDEFGHI&base-url=https%3A%2F%2Fmatrix-client.matrix.org&theme=my-theme-for-testing&widgetId=test&parentUrl=http%3A%2F%2Flocalhost%2F",
|
||||
);
|
||||
spy.mockRestore();
|
||||
});
|
||||
it("should replace custom theme with light/dark", () => {
|
||||
const originalGetValue = SettingsStore.getValue;
|
||||
const spy = jest.spyOn(SettingsStore, "getValue").mockImplementation((setting) => {
|
||||
if (setting === "theme") return "custom-my-theme";
|
||||
return originalGetValue(setting);
|
||||
});
|
||||
jest.spyOn(Theme, "getCustomTheme").mockReturnValue({ is_dark: false } as unknown as Theme.CustomTheme);
|
||||
expect(widget.embedUrl).toBe(
|
||||
"https://example.org/?user-id=%40userId%3Amatrix.org&device-id=ABCDEFGHI&base-url=https%3A%2F%2Fmatrix-client.matrix.org&theme=light&widgetId=test&parentUrl=http%3A%2F%2Flocalhost%2F",
|
||||
);
|
||||
jest.spyOn(Theme, "getCustomTheme").mockReturnValue({ is_dark: true } as unknown as Theme.CustomTheme);
|
||||
expect(widget.embedUrl).toBe(
|
||||
"https://example.org/?user-id=%40userId%3Amatrix.org&device-id=ABCDEFGHI&base-url=https%3A%2F%2Fmatrix-client.matrix.org&theme=dark&widgetId=test&parentUrl=http%3A%2F%2Flocalhost%2F",
|
||||
);
|
||||
spy.mockRestore();
|
||||
});
|
||||
it("should replace parameters in widget popoutUrl template", () => {
|
||||
const originalGetValue = SettingsStore.getValue;
|
||||
const spy = jest.spyOn(SettingsStore, "getValue").mockImplementation((setting) => {
|
||||
if (setting === "theme") return "my-theme-for-testing";
|
||||
return originalGetValue(setting);
|
||||
});
|
||||
expect(widget.popoutUrl).toBe(
|
||||
"https://example.org/?user-id=%40userId%3Amatrix.org&device-id=ABCDEFGHI&base-url=https%3A%2F%2Fmatrix-client.matrix.org&theme=my-theme-for-testing",
|
||||
);
|
||||
spy.mockRestore();
|
||||
it("should replace parameters in widget url template", () => {
|
||||
const originGetValue = SettingsStore.getValue;
|
||||
const spy = jest.spyOn(SettingsStore, "getValue").mockImplementation((setting) => {
|
||||
if (setting === "theme") return "my-theme-for-testing";
|
||||
return originGetValue(setting);
|
||||
});
|
||||
expect(widget.embedUrl).toBe(
|
||||
"https://example.org/?user-id=%40userId%3Amatrix.org&device-id=ABCDEFGHI&base-url=https%3A%2F%2Fmatrix-client.matrix.org&theme=my-theme-for-testing&widgetId=test&parentUrl=http%3A%2F%2Flocalhost%2F",
|
||||
);
|
||||
spy.mockClear();
|
||||
});
|
||||
|
||||
it("feeds incoming to-device messages to the widget", async () => {
|
||||
const event = mkEvent({
|
||||
event: true,
|
||||
|
|
|
|||
Loading…
Add table
Add a link
Reference in a new issue