68 lines
2.6 KiB
TypeScript
68 lines
2.6 KiB
TypeScript
import { describe, expect, test } from "vitest";
|
|
import { screen } from "@testing-library/react";
|
|
import { userEvent } from "@testing-library/user-event";
|
|
import { UserMenu } from "../../../components/layout/UserMenu.tsx";
|
|
import { makeSession } from "../../fixtures.ts";
|
|
import { currentPath, renderApp, renderWithContexts } from "../../render.tsx";
|
|
import { AUTH_STORAGE_KEY } from "../../../utils/auth/storage.ts";
|
|
|
|
describe("UserMenu", () => {
|
|
test("opens, links to profile and playlists, closes on Escape and outside", async () => {
|
|
const user = userEvent.setup();
|
|
renderWithContexts(
|
|
<>
|
|
<UserMenu user={makeSession({ username: "ann" }).user} />
|
|
<p>outside</p>
|
|
</>,
|
|
);
|
|
const trigger = screen.getByRole("button", { name: "User menu" });
|
|
await user.click(trigger);
|
|
expect(trigger).toHaveAttribute("aria-expanded", "true");
|
|
expect(screen.getByRole("menuitem", { name: "@ann" })).toHaveAttribute(
|
|
"href",
|
|
"/@ann",
|
|
);
|
|
expect(screen.getByRole("menuitem", { name: "Playlists" })).toHaveAttribute(
|
|
"href",
|
|
"/@ann/playlists",
|
|
);
|
|
expect(screen.getByRole("menuitem", { name: "Settings" })).toHaveAttribute(
|
|
"href",
|
|
"/settings",
|
|
);
|
|
// The site's tools are for those who hold category:manage.
|
|
expect(screen.queryByRole("menuitem", { name: "Manage" })).toBeNull();
|
|
await user.keyboard("{Escape}");
|
|
expect(screen.queryByRole("menu")).not.toBeInTheDocument();
|
|
await user.click(trigger);
|
|
await user.click(screen.getByText("outside"));
|
|
expect(screen.queryByRole("menu")).not.toBeInTheDocument();
|
|
await user.click(trigger);
|
|
await user.click(screen.getByRole("menuitem", { name: "@ann" }));
|
|
expect(currentPath()).toBe("/@ann");
|
|
expect(screen.queryByRole("menu")).not.toBeInTheDocument();
|
|
});
|
|
|
|
test("links to /manage for those who hold category:manage", async () => {
|
|
const user = userEvent.setup();
|
|
renderWithContexts(
|
|
<UserMenu user={makeSession({ role: "admin" }).user} />,
|
|
);
|
|
await user.click(screen.getByRole("button", { name: "User menu" }));
|
|
expect(screen.getByRole("menuitem", { name: "Manage" })).toHaveAttribute(
|
|
"href",
|
|
"/manage",
|
|
);
|
|
});
|
|
|
|
test("logs out", async () => {
|
|
const session = makeSession({ username: "ann" });
|
|
renderApp(<UserMenu user={session.user} />, { session });
|
|
const user = userEvent.setup();
|
|
await user.click(screen.getByRole("button", { name: "User menu" }));
|
|
await user.click(screen.getByRole("menuitem", { name: "Log out" }));
|
|
expect(localStorage.getItem(AUTH_STORAGE_KEY)).toBeNull();
|
|
expect(screen.queryByRole("menu")).not.toBeInTheDocument();
|
|
});
|
|
});
|