1
0
mirror of https://github.com/matrix-org/matrix-react-sdk.git synced 2025-07-30 02:21:17 +03:00

Fix regression around CSS stacking contexts and PIP widgets (#12094)

* Fix CSS stacking contexts for Dialogs & PersistedElement

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

* Switch to PersistedElement sharing a CSS stacking context for z-index to continue functioning

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

* Fix Widget PIP overlay being under the widget and dragging being broken

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

* Fix border-radius on widget pip

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

* Fix majority of tests

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

* Fix jest retryTimes applying outside of CI

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

* Fix remaining tests

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

* Fix React unique key warnings

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

* Fix sticker picker

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

* id not class

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

* Fix widget pip button colour in light theme

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

* Revert unrelated change

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

---------

Signed-off-by: Michael Telatynski <7t3chguy@gmail.com>
This commit is contained in:
Michael Telatynski
2024-01-08 12:11:44 +00:00
committed by GitHub
parent 896d890198
commit 57da29de58
9 changed files with 101 additions and 45 deletions

View File

@ -64,6 +64,16 @@ import { WidgetType } from "../../../src/widgets/WidgetType";
import { SdkContextClass } from "../../../src/contexts/SDKContext";
import { ElementWidgetActions } from "../../../src/stores/widgets/ElementWidgetActions";
jest.mock("../../../src/stores/OwnProfileStore", () => ({
OwnProfileStore: {
instance: {
isProfileInfoFetched: true,
removeListener: jest.fn(),
getHttpAvatarUrl: jest.fn().mockReturnValue("http://avatar_url"),
},
},
}));
describe("PipContainer", () => {
useMockedCalls();
jest.spyOn(HTMLMediaElement.prototype, "play").mockImplementation(async () => {});
@ -91,6 +101,8 @@ describe("PipContainer", () => {
stubClient();
client = mocked(MatrixClientPeg.safeGet());
client.getUserId.mockReturnValue("@alice:example.org");
client.getSafeUserId.mockReturnValue("@alice:example.org");
DMRoomMap.makeShared(client);
room = new Room("!1:example.org", client, "@alice:example.org", {
@ -161,6 +173,7 @@ describe("PipContainer", () => {
if (!(call instanceof MockedCall)) throw new Error("Failed to create call");
const widget = new Widget(call.widget);
WidgetStore.instance.addVirtualWidget(call.widget, room.roomId);
WidgetMessagingStore.instance.storeMessaging(widget, room.roomId, {
stop: () => {},
} as unknown as ClientWidgetApi);
@ -175,6 +188,7 @@ describe("PipContainer", () => {
cleanup();
call.destroy();
ActiveWidgetStore.instance.destroyPersistentWidget(widget.id, room.roomId);
WidgetStore.instance.removeVirtualWidget(widget.id, room.roomId);
};
const withWidget = async (fn: () => Promise<void>): Promise<void> => {
@ -265,7 +279,7 @@ describe("PipContainer", () => {
const widget = WidgetStore.instance.addVirtualWidget(
{
id: "1",
creatorUserId: "@alice:exaxmple.org",
creatorUserId: "@alice:example.org",
type: WidgetType.CUSTOM.preferred,
url: "https://example.org",
name: "Example widget",
@ -279,7 +293,7 @@ describe("PipContainer", () => {
// The return button should maximize the widget
const moveSpy = jest.spyOn(WidgetLayoutStore.instance, "moveToContainer");
await user.click(screen.getByRole("button", { name: "Back" }));
await user.click(await screen.findByRole("button", { name: "Back" }));
expect(moveSpy).toHaveBeenCalledWith(room, widget, Container.Center);
expect(screen.queryByRole("button", { name: "Leave" })).toBeNull();
@ -295,7 +309,7 @@ describe("PipContainer", () => {
const widget = WidgetStore.instance.addVirtualWidget(
{
id: "1",
creatorUserId: "@alice:exaxmple.org",
creatorUserId: "@alice:example.org",
type: WidgetType.JITSI.preferred,
url: "https://meet.example.org",
name: "Jitsi example",
@ -310,7 +324,7 @@ describe("PipContainer", () => {
// The return button should view the room
const dispatcherSpy = jest.fn();
const dispatcherRef = defaultDispatcher.register(dispatcherSpy);
await user.click(screen.getByRole("button", { name: "Back" }));
await user.click(await screen.findByRole("button", { name: "Back" }));
expect(dispatcherSpy).toHaveBeenCalledWith({
action: Action.ViewRoom,
room_id: room.roomId,