chore: bump @testing-library/react 12.1.5 -> 16.0.0 (#8322)

This commit is contained in:
David Luzar
2024-08-06 15:17:42 +02:00
committed by GitHub
parent 3cf14c73a3
commit f19ce30dfe
52 changed files with 1035 additions and 978 deletions

View File

@@ -2,8 +2,8 @@ import React from "react";
import { DEFAULT_SIDEBAR } from "../../constants";
import { Excalidraw, Sidebar } from "../../index";
import {
act,
fireEvent,
GlobalTestState,
queryAllByTestId,
queryByTestId,
render,
@@ -11,39 +11,17 @@ import {
withExcalidrawDimensions,
} from "../../tests/test-utils";
import { vi } from "vitest";
import {
assertExcalidrawWithSidebar,
assertSidebarDockButton,
} from "./siderbar.test.helpers";
export const assertSidebarDockButton = async <T extends boolean>(
hasDockButton: T,
): Promise<
T extends false
? { dockButton: null; sidebar: HTMLElement }
: { dockButton: HTMLElement; sidebar: HTMLElement }
> => {
const sidebar =
GlobalTestState.renderResult.container.querySelector<HTMLElement>(
".sidebar",
);
expect(sidebar).not.toBe(null);
const dockButton = queryByTestId(sidebar!, "sidebar-dock");
if (hasDockButton) {
expect(dockButton).not.toBe(null);
return { dockButton: dockButton!, sidebar: sidebar! } as any;
}
expect(dockButton).toBe(null);
return { dockButton: null, sidebar: sidebar! } as any;
};
export const assertExcalidrawWithSidebar = async (
sidebar: React.ReactNode,
name: string,
test: () => void,
) => {
await render(
<Excalidraw initialData={{ appState: { openSidebar: { name } } }}>
{sidebar}
</Excalidraw>,
);
await withExcalidrawDimensions({ width: 1920, height: 1080 }, test);
const toggleSidebar = (
...args: Parameters<typeof window.h.app.toggleSidebar>
): Promise<boolean> => {
return act(() => {
return window.h.app.toggleSidebar(...args);
});
};
describe("Sidebar", () => {
@@ -103,7 +81,7 @@ describe("Sidebar", () => {
// toggle sidebar on
// -------------------------------------------------------------------------
expect(window.h.app.toggleSidebar({ name: "customSidebar" })).toBe(true);
expect(await toggleSidebar({ name: "customSidebar" })).toBe(true);
await waitFor(() => {
const node = container.querySelector("#test-sidebar-content");
@@ -112,7 +90,7 @@ describe("Sidebar", () => {
// toggle sidebar off
// -------------------------------------------------------------------------
expect(window.h.app.toggleSidebar({ name: "customSidebar" })).toBe(false);
expect(await toggleSidebar({ name: "customSidebar" })).toBe(false);
await waitFor(() => {
const node = container.querySelector("#test-sidebar-content");
@@ -121,9 +99,9 @@ describe("Sidebar", () => {
// force-toggle sidebar off (=> still hidden)
// -------------------------------------------------------------------------
expect(
window.h.app.toggleSidebar({ name: "customSidebar", force: false }),
).toBe(false);
expect(await toggleSidebar({ name: "customSidebar", force: false })).toBe(
false,
);
await waitFor(() => {
const node = container.querySelector("#test-sidebar-content");
@@ -132,12 +110,12 @@ describe("Sidebar", () => {
// force-toggle sidebar on
// -------------------------------------------------------------------------
expect(
window.h.app.toggleSidebar({ name: "customSidebar", force: true }),
).toBe(true);
expect(
window.h.app.toggleSidebar({ name: "customSidebar", force: true }),
).toBe(true);
expect(await toggleSidebar({ name: "customSidebar", force: true })).toBe(
true,
);
expect(await toggleSidebar({ name: "customSidebar", force: true })).toBe(
true,
);
await waitFor(() => {
const node = container.querySelector("#test-sidebar-content");
@@ -146,9 +124,7 @@ describe("Sidebar", () => {
// toggle library (= hide custom sidebar)
// -------------------------------------------------------------------------
expect(window.h.app.toggleSidebar({ name: DEFAULT_SIDEBAR.name })).toBe(
true,
);
expect(await toggleSidebar({ name: DEFAULT_SIDEBAR.name })).toBe(true);
await waitFor(() => {
const node = container.querySelector("#test-sidebar-content");
@@ -161,13 +137,13 @@ describe("Sidebar", () => {
// closing sidebar using `{ name: null }`
// -------------------------------------------------------------------------
expect(window.h.app.toggleSidebar({ name: "customSidebar" })).toBe(true);
expect(await toggleSidebar({ name: "customSidebar" })).toBe(true);
await waitFor(() => {
const node = container.querySelector("#test-sidebar-content");
expect(node).not.toBe(null);
});
expect(window.h.app.toggleSidebar({ name: null })).toBe(false);
expect(await toggleSidebar({ name: null })).toBe(false);
await waitFor(() => {
const node = container.querySelector("#test-sidebar-content");
expect(node).toBe(null);
@@ -321,6 +297,9 @@ describe("Sidebar", () => {
});
it("shouldn't be user-dockable when only `onDock` supplied w/o `docked`", async () => {
// we expect warnings in this test and don't want to pollute stdout
const mock = jest.spyOn(console, "warn").mockImplementation(() => {});
await render(
<Excalidraw
initialData={{ appState: { openSidebar: { name: "customSidebar" } } }}
@@ -341,6 +320,8 @@ describe("Sidebar", () => {
await assertSidebarDockButton(false);
},
);
mock.mockRestore();
});
});
@@ -367,9 +348,9 @@ describe("Sidebar", () => {
).toBeNull();
// open library sidebar
expect(
window.h.app.toggleSidebar({ name: "custom", tab: "library" }),
).toBe(true);
expect(await toggleSidebar({ name: "custom", tab: "library" })).toBe(
true,
);
expect(
container.querySelector<HTMLElement>(
"[role=tabpanel][data-testid=library]",
@@ -377,9 +358,9 @@ describe("Sidebar", () => {
).not.toBeNull();
// switch to comments tab
expect(
window.h.app.toggleSidebar({ name: "custom", tab: "comments" }),
).toBe(true);
expect(await toggleSidebar({ name: "custom", tab: "comments" })).toBe(
true,
);
expect(
container.querySelector<HTMLElement>(
"[role=tabpanel][data-testid=comments]",
@@ -387,9 +368,9 @@ describe("Sidebar", () => {
).not.toBeNull();
// toggle sidebar closed
expect(
window.h.app.toggleSidebar({ name: "custom", tab: "comments" }),
).toBe(false);
expect(await toggleSidebar({ name: "custom", tab: "comments" })).toBe(
false,
);
expect(
container.querySelector<HTMLElement>(
"[role=tabpanel][data-testid=comments]",
@@ -397,9 +378,9 @@ describe("Sidebar", () => {
).toBeNull();
// toggle sidebar open
expect(
window.h.app.toggleSidebar({ name: "custom", tab: "comments" }),
).toBe(true);
expect(await toggleSidebar({ name: "custom", tab: "comments" })).toBe(
true,
);
expect(
container.querySelector<HTMLElement>(
"[role=tabpanel][data-testid=comments]",