Add snapshot test

This commit is contained in:
Johannes Marbach 2023-02-01 19:51:37 +01:00
parent d0de2a6851
commit c63daf62ed
2 changed files with 244 additions and 1 deletions

View file

@ -14,6 +14,8 @@ See the License for the specific language governing permissions and
limitations under the License.
*/
import React from "react";
import { render } from "@testing-library/react";
import { MatrixClient } from "matrix-js-sdk/src/client";
import { Room } from "matrix-js-sdk/src/models/room";
import { RoomHierarchy } from "matrix-js-sdk/src/room-hierarchy";
@ -22,8 +24,17 @@ import { IHierarchyRoom } from "matrix-js-sdk/src/@types/spaces";
import { MatrixClientPeg } from "../../../src/MatrixClientPeg";
import { mkStubRoom, stubClient } from "../../test-utils";
import dispatcher from "../../../src/dispatcher/dispatcher";
import { showRoom, toLocalRoom } from "../../../src/components/structures/SpaceHierarchy";
import { HierarchyLevel, showRoom, toLocalRoom } from "../../../src/components/structures/SpaceHierarchy";
import { Action } from "../../../src/dispatcher/actions";
import MatrixClientContext from "../../../src/contexts/MatrixClientContext";
import DMRoomMap from "../../../src/utils/DMRoomMap";
// Fake random strings to give a predictable snapshot for checkbox IDs
jest.mock("matrix-js-sdk/src/randomstring", () => {
return {
randomString: () => "abdefghi",
};
});
describe("SpaceHierarchy", () => {
describe("showRoom", () => {
@ -125,4 +136,77 @@ describe("SpaceHierarchy", () => {
expect(localRoomV3.room_id).toEqual(roomV3.roomId);
});
});
describe("<HierarchyLevel />", () => {
let client: MatrixClient;
let dmRoomMap: DMRoomMap;
let root: Room;
let room1: Room;
let room2: Room;
let hierarchyRoot: IHierarchyRoom
let hierarchyRoom1: IHierarchyRoom
let hierarchyRoom2: IHierarchyRoom
let roomHierarchy: RoomHierarchy;
beforeEach(() => {
stubClient();
client = MatrixClientPeg.get();
dmRoomMap = {
getUserIdForRoomId: jest.fn()
} as unknown as DMRoomMap;
jest.spyOn(DMRoomMap, "shared").mockReturnValue(dmRoomMap);
root = mkStubRoom("room-id-1", "Room 1", client);
room1 = mkStubRoom("room-id-2", "Room 2", client);
room2 = mkStubRoom("room-id-3", "Room 3", client);
hierarchyRoot = {
room_id: root.roomId,
num_joined_members: 1,
children_state: [{
state_key: room1.roomId,
content: { order: "1" }
}, {
state_key: room2.roomId,
content: { order: "2" }
}]
} as IHierarchyRoom
hierarchyRoom1 = { room_id: room1.roomId, num_joined_members: 2 } as IHierarchyRoom
hierarchyRoom2 = { room_id: root.roomId, num_joined_members: 3 } as IHierarchyRoom
roomHierarchy = {
roomMap: new Map([
[root.roomId, hierarchyRoot],
[room1.roomId, hierarchyRoom1],
[room2.roomId, hierarchyRoom2],
]),
isSuggested: jest.fn()
} as unknown as RoomHierarchy;
});
it("renders", () => {
const defaultProps = {
root: hierarchyRoot,
roomSet: new Set([hierarchyRoom1, hierarchyRoom2]),
hierarchy: roomHierarchy,
parents: new Set<string>(),
selectedMap: new Map<string, Set<string>>(),
onViewRoomClick: jest.fn(),
onJoinRoomClick: jest.fn(),
onToggleClick: jest.fn(),
};
const getComponent = (props = {}): React.ReactElement => (
<MatrixClientContext.Provider value={client}>
<HierarchyLevel {...defaultProps} {...props} />;
</MatrixClientContext.Provider>
);
const { container } = render(getComponent());
expect(container).toMatchSnapshot();
});
});
});

View file

@ -0,0 +1,159 @@
// Jest Snapshot v1, https://goo.gl/fbAQLP
exports[`SpaceHierarchy <HierarchyLevel /> renders 1`] = `
<div>
<li
class="mx_SpaceHierarchy_roomTileWrapper"
role="treeitem"
>
<div
class="mx_AccessibleButton mx_SpaceHierarchy_roomTile"
role="button"
tabindex="-1"
>
<div
class="mx_SpaceHierarchy_roomTile_item"
>
<div
class="mx_SpaceHierarchy_roomTile_avatar"
>
<img
alt=""
class="mx_BaseAvatar mx_BaseAvatar_image"
data-testid="avatar-img"
src="http://this.is.a.url/avatar.url/room.png"
style="width: 20px; height: 20px;"
/>
</div>
<div
class="mx_SpaceHierarchy_roomTile_name"
>
Unnamed Room
<div
class="mx_SpaceHierarchy_roomTile_joined"
>
Joined
</div>
</div>
<div
class="mx_SpaceHierarchy_roomTile_info"
>
2 members
·
<span
dir="auto"
/>
</div>
</div>
<div
class="mx_SpaceHierarchy_actions"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="-1"
>
View
</div>
<span
class="mx_Checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
id="checkbox_abdefghi"
tabindex="-1"
type="checkbox"
/>
<label
for="checkbox_abdefghi"
>
<div
class="mx_Checkbox_background"
>
<div
class="mx_Checkbox_checkmark"
/>
</div>
</label>
</span>
</div>
</div>
</li>
<li
class="mx_SpaceHierarchy_roomTileWrapper"
role="treeitem"
>
<div
class="mx_AccessibleButton mx_SpaceHierarchy_roomTile"
role="button"
tabindex="-1"
>
<div
class="mx_SpaceHierarchy_roomTile_item"
>
<div
class="mx_SpaceHierarchy_roomTile_avatar"
>
<img
alt=""
class="mx_BaseAvatar mx_BaseAvatar_image"
data-testid="avatar-img"
src="http://this.is.a.url/avatar.url/room.png"
style="width: 20px; height: 20px;"
/>
</div>
<div
class="mx_SpaceHierarchy_roomTile_name"
>
Unnamed Room
<div
class="mx_SpaceHierarchy_roomTile_joined"
>
Joined
</div>
</div>
<div
class="mx_SpaceHierarchy_roomTile_info"
>
3 members
·
<span
dir="auto"
/>
</div>
</div>
<div
class="mx_SpaceHierarchy_actions"
>
<div
class="mx_AccessibleButton mx_AccessibleButton_hasKind mx_AccessibleButton_kind_primary_outline"
role="button"
tabindex="-1"
>
View
</div>
<span
class="mx_Checkbox mx_Checkbox_hasKind mx_Checkbox_kind_solid"
>
<input
id="checkbox_abdefghi"
tabindex="-1"
type="checkbox"
/>
<label
for="checkbox_abdefghi"
>
<div
class="mx_Checkbox_background"
>
<div
class="mx_Checkbox_checkmark"
/>
</div>
</label>
</span>
</div>
</div>
</li>
;
</div>
`;