rspace-online/e2e/tests/shell.spec.ts

53 lines
2.0 KiB
TypeScript

import { test, expect } from "@playwright/test";
test.describe("Shell UI", () => {
test.beforeEach(async ({ page }) => {
await page.goto("/demo/rnotes");
});
test("header has logo, app switcher, identity, and space switcher", async ({ page }) => {
await expect(page.locator("header.rstack-header")).toBeVisible();
await expect(page.locator("header.rstack-header .rstack-header__logo")).toBeVisible();
await expect(page.locator("rstack-app-switcher")).toBeAttached();
await expect(page.locator("rstack-identity")).toBeAttached();
await expect(page.locator("rstack-space-switcher")).toBeAttached();
});
test("theme toggle switches data-theme attribute", async ({ page }) => {
// Get current theme
const initialTheme = await page.evaluate(() =>
document.documentElement.getAttribute("data-theme")
);
// Toggle theme via localStorage (same mechanism as the toggle button)
const newTheme = initialTheme === "dark" ? "light" : "dark";
await page.evaluate((t) => {
localStorage.setItem("canvas-theme", t);
document.documentElement.setAttribute("data-theme", t);
}, newTheme);
const currentTheme = await page.evaluate(() =>
document.documentElement.getAttribute("data-theme")
);
expect(currentTheme).toBe(newTheme);
});
test("tab bar renders on module pages", async ({ page }) => {
await expect(page.locator(".rstack-tab-row")).toBeAttached();
await expect(page.locator("rstack-tab-bar")).toBeAttached();
});
test('"Try Demo" button has data-hide when on demo space', async ({ page }) => {
const demoBtn = page.locator(".rstack-header__demo-btn");
await expect(demoBtn).toBeAttached();
// On demo space, the button should have data-hide
const hasDataHide = await demoBtn.evaluate((el) => el.hasAttribute("data-hide"));
expect(hasDataHide).toBe(true);
});
test("settings button exists", async ({ page }) => {
await expect(page.locator("#settings-btn")).toBeAttached();
});
});