2022-02-09 16:21:40 +00:00
|
|
|
/*
|
|
|
|
Copyright 2022 The Matrix.org Foundation C.I.C.
|
|
|
|
|
|
|
|
Licensed under the Apache License, Version 2.0 (the "License");
|
|
|
|
you may not use this file except in compliance with the License.
|
|
|
|
You may obtain a copy of the License at
|
|
|
|
|
|
|
|
http://www.apache.org/licenses/LICENSE-2.0
|
|
|
|
|
|
|
|
Unless required by applicable law or agreed to in writing, software
|
|
|
|
distributed under the License is distributed on an "AS IS" BASIS,
|
|
|
|
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
|
|
|
|
See the License for the specific language governing permissions and
|
|
|
|
limitations under the License.
|
|
|
|
*/
|
|
|
|
|
2022-12-12 11:24:14 +00:00
|
|
|
import React from "react";
|
2023-05-17 14:18:21 +00:00
|
|
|
import { render, screen, fireEvent, act } from "@testing-library/react";
|
2022-12-12 11:24:14 +00:00
|
|
|
import { mocked } from "jest-mock";
|
2023-06-28 13:05:36 +00:00
|
|
|
import { MatrixClient, Room } from "matrix-js-sdk/src/matrix";
|
2022-02-09 16:21:40 +00:00
|
|
|
|
2022-12-27 07:39:26 +00:00
|
|
|
import UnwrappedSpacePanel from "../../../../src/components/views/spaces/SpacePanel";
|
2022-12-12 11:24:14 +00:00
|
|
|
import { MatrixClientPeg } from "../../../../src/MatrixClientPeg";
|
2023-02-13 11:39:16 +00:00
|
|
|
import { MetaSpace, SpaceKey } from "../../../../src/stores/spaces";
|
2022-12-12 11:24:14 +00:00
|
|
|
import { shouldShowComponent } from "../../../../src/customisations/helpers/UIComponents";
|
|
|
|
import { UIComponent } from "../../../../src/settings/UIFeature";
|
2023-05-17 14:18:21 +00:00
|
|
|
import { mkStubRoom, wrapInSdkContext } from "../../../test-utils";
|
2022-12-27 07:39:26 +00:00
|
|
|
import { SdkContextClass } from "../../../../src/contexts/SDKContext";
|
2023-05-17 14:18:21 +00:00
|
|
|
import SpaceStore from "../../../../src/stores/spaces/SpaceStore";
|
|
|
|
import DMRoomMap from "../../../../src/utils/DMRoomMap";
|
2023-06-28 13:05:36 +00:00
|
|
|
import { SpaceNotificationState } from "../../../../src/stores/notifications/SpaceNotificationState";
|
2023-05-17 14:18:21 +00:00
|
|
|
|
|
|
|
// DND test utilities based on
|
|
|
|
// https://github.com/colinrobertbrooks/react-beautiful-dnd-test-utils/issues/18#issuecomment-1373388693
|
|
|
|
enum Keys {
|
|
|
|
SPACE = 32,
|
|
|
|
ARROW_LEFT = 37,
|
|
|
|
ARROW_UP = 38,
|
|
|
|
ARROW_RIGHT = 39,
|
|
|
|
ARROW_DOWN = 40,
|
|
|
|
}
|
|
|
|
|
|
|
|
enum DragDirection {
|
|
|
|
LEFT = Keys.ARROW_LEFT,
|
|
|
|
UP = Keys.ARROW_UP,
|
|
|
|
RIGHT = Keys.ARROW_RIGHT,
|
|
|
|
DOWN = Keys.ARROW_DOWN,
|
|
|
|
}
|
|
|
|
|
|
|
|
// taken from https://github.com/hello-pangea/dnd/blob/main/test/unit/integration/util/controls.ts#L20
|
|
|
|
const createTransitionEndEvent = (): Event => {
|
|
|
|
const event = new Event("transitionend", {
|
|
|
|
bubbles: true,
|
|
|
|
cancelable: true,
|
|
|
|
}) as TransitionEvent;
|
|
|
|
|
|
|
|
// cheating and adding property to event as
|
|
|
|
// TransitionEvent constructor does not exist.
|
|
|
|
// This is needed because of the following check
|
|
|
|
// https://github.com/atlassian/react-beautiful-dnd/blob/master/src/view/draggable/draggable.jsx#L130
|
|
|
|
// eslint-disable-next-line @typescript-eslint/no-explicit-any
|
|
|
|
(event as any).propertyName = "transform";
|
|
|
|
|
|
|
|
return event;
|
|
|
|
};
|
|
|
|
|
|
|
|
const pickUp = async (element: HTMLElement) => {
|
|
|
|
fireEvent.keyDown(element, {
|
|
|
|
keyCode: Keys.SPACE,
|
|
|
|
});
|
|
|
|
await screen.findByText(/You have lifted an item/i);
|
|
|
|
|
|
|
|
act(() => {
|
|
|
|
jest.runOnlyPendingTimers();
|
|
|
|
});
|
|
|
|
};
|
|
|
|
|
|
|
|
const move = async (element: HTMLElement, direction: DragDirection) => {
|
|
|
|
fireEvent.keyDown(element, {
|
|
|
|
keyCode: direction,
|
|
|
|
});
|
|
|
|
await screen.findByText(/(You have moved the item | has been combined with)/i);
|
|
|
|
};
|
|
|
|
|
|
|
|
const drop = async (element: HTMLElement) => {
|
|
|
|
fireEvent.keyDown(element, {
|
|
|
|
keyCode: Keys.SPACE,
|
|
|
|
});
|
|
|
|
fireEvent(element.parentElement!, createTransitionEndEvent());
|
|
|
|
|
|
|
|
await screen.findByText(/You have dropped the item/i);
|
|
|
|
};
|
2022-02-09 16:21:40 +00:00
|
|
|
|
2022-12-12 11:24:14 +00:00
|
|
|
jest.mock("../../../../src/stores/spaces/SpaceStore", () => {
|
2022-02-09 16:21:40 +00:00
|
|
|
// eslint-disable-next-line @typescript-eslint/no-var-requires
|
|
|
|
const EventEmitter = require("events");
|
|
|
|
class MockSpaceStore extends EventEmitter {
|
2023-02-13 11:39:16 +00:00
|
|
|
invitedSpaces: SpaceKey[] = [];
|
|
|
|
enabledMetaSpaces: MetaSpace[] = [];
|
|
|
|
spacePanelSpaces: string[] = [];
|
2022-12-12 11:24:14 +00:00
|
|
|
activeSpace: SpaceKey = "!space1";
|
2023-06-28 13:05:36 +00:00
|
|
|
getChildSpaces = () => [] as Room[];
|
|
|
|
getNotificationState = () => null as SpaceNotificationState | null;
|
2023-05-17 14:18:21 +00:00
|
|
|
setActiveSpace = jest.fn();
|
|
|
|
moveRootSpace = jest.fn();
|
2022-02-09 16:21:40 +00:00
|
|
|
}
|
|
|
|
return {
|
|
|
|
instance: new MockSpaceStore(),
|
|
|
|
};
|
|
|
|
});
|
|
|
|
|
2022-12-12 11:24:14 +00:00
|
|
|
jest.mock("../../../../src/customisations/helpers/UIComponents", () => ({
|
2022-02-09 16:21:40 +00:00
|
|
|
shouldShowComponent: jest.fn(),
|
|
|
|
}));
|
|
|
|
|
2022-12-12 11:24:14 +00:00
|
|
|
describe("<SpacePanel />", () => {
|
2022-02-09 16:21:40 +00:00
|
|
|
const mockClient = {
|
2022-12-12 11:24:14 +00:00
|
|
|
getUserId: jest.fn().mockReturnValue("@test:test"),
|
2023-02-28 08:55:59 +00:00
|
|
|
getSafeUserId: jest.fn().mockReturnValue("@test:test"),
|
2023-05-17 14:18:21 +00:00
|
|
|
mxcUrlToHttp: jest.fn(),
|
|
|
|
getRoom: jest.fn(),
|
2022-02-09 16:21:40 +00:00
|
|
|
isGuest: jest.fn(),
|
|
|
|
getAccountData: jest.fn(),
|
2023-05-17 14:18:21 +00:00
|
|
|
on: jest.fn(),
|
|
|
|
removeListener: jest.fn(),
|
2022-02-09 16:21:40 +00:00
|
|
|
} as unknown as MatrixClient;
|
2022-12-27 07:39:26 +00:00
|
|
|
const SpacePanel = wrapInSdkContext(UnwrappedSpacePanel, SdkContextClass.instance);
|
2022-02-09 16:21:40 +00:00
|
|
|
|
|
|
|
beforeAll(() => {
|
2022-12-12 11:24:14 +00:00
|
|
|
jest.spyOn(MatrixClientPeg, "get").mockReturnValue(mockClient);
|
2023-06-15 07:46:19 +00:00
|
|
|
jest.spyOn(MatrixClientPeg, "safeGet").mockReturnValue(mockClient);
|
2022-02-09 16:21:40 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
beforeEach(() => {
|
|
|
|
mocked(shouldShowComponent).mockClear().mockReturnValue(true);
|
|
|
|
});
|
|
|
|
|
2022-12-12 11:24:14 +00:00
|
|
|
describe("create new space button", () => {
|
|
|
|
it("renders create space button when UIComponent.CreateSpaces component should be shown", () => {
|
2022-10-17 16:42:04 +00:00
|
|
|
render(<SpacePanel />);
|
|
|
|
screen.getByTestId("create-space-button");
|
2022-02-09 16:21:40 +00:00
|
|
|
});
|
|
|
|
|
2022-12-12 11:24:14 +00:00
|
|
|
it("does not render create space button when UIComponent.CreateSpaces component should not be shown", () => {
|
2022-02-09 16:21:40 +00:00
|
|
|
mocked(shouldShowComponent).mockReturnValue(false);
|
2022-10-17 16:42:04 +00:00
|
|
|
render(<SpacePanel />);
|
2022-02-09 16:21:40 +00:00
|
|
|
expect(shouldShowComponent).toHaveBeenCalledWith(UIComponent.CreateSpaces);
|
2022-10-17 16:42:04 +00:00
|
|
|
expect(screen.queryByTestId("create-space-button")).toBeFalsy();
|
2022-02-09 16:21:40 +00:00
|
|
|
});
|
|
|
|
|
2022-12-12 11:24:14 +00:00
|
|
|
it("opens context menu on create space button click", () => {
|
2022-10-17 16:42:04 +00:00
|
|
|
render(<SpacePanel />);
|
|
|
|
fireEvent.click(screen.getByTestId("create-space-button"));
|
|
|
|
screen.getByTestId("create-space-button");
|
2022-02-09 16:21:40 +00:00
|
|
|
});
|
|
|
|
});
|
2023-05-17 14:18:21 +00:00
|
|
|
|
|
|
|
it("should allow rearranging via drag and drop", async () => {
|
|
|
|
(SpaceStore.instance.spacePanelSpaces as any) = [
|
|
|
|
mkStubRoom("!room1:server", "Room 1", mockClient),
|
|
|
|
mkStubRoom("!room2:server", "Room 2", mockClient),
|
|
|
|
mkStubRoom("!room3:server", "Room 3", mockClient),
|
|
|
|
];
|
2023-05-23 15:24:12 +00:00
|
|
|
DMRoomMap.makeShared(mockClient);
|
2023-05-17 14:18:21 +00:00
|
|
|
jest.useFakeTimers();
|
|
|
|
|
|
|
|
const { getByLabelText } = render(<SpacePanel />);
|
|
|
|
|
|
|
|
const room1 = getByLabelText("Room 1");
|
|
|
|
await pickUp(room1);
|
|
|
|
await move(room1, DragDirection.DOWN);
|
|
|
|
await drop(room1);
|
|
|
|
|
|
|
|
expect(SpaceStore.instance.moveRootSpace).toHaveBeenCalledWith(0, 1);
|
|
|
|
});
|
2022-02-09 16:21:40 +00:00
|
|
|
});
|