44 lines
1.4 KiB
TypeScript
44 lines
1.4 KiB
TypeScript
import { renderToString } from "react-dom/server";
|
|
import { describe, expect, test } from "vitest";
|
|
import { AppStateView } from "./App";
|
|
|
|
describe("React app dashboard state view", () => {
|
|
test("renders loading dashboard state", () => {
|
|
const html = renderToString(
|
|
<AppStateView
|
|
dashboard={{
|
|
state: "loading",
|
|
title: "Loading Dashboard",
|
|
subtitle: "Fetching active model",
|
|
message: "Waiting for the active dashboard document.",
|
|
}}
|
|
/>,
|
|
);
|
|
|
|
expect(html).toContain("Loading Dashboard");
|
|
expect(html).toContain("Fetching active model");
|
|
});
|
|
|
|
test("renders an accessible theme toggle with the active theme", () => {
|
|
const html = renderToString(
|
|
<AppStateView
|
|
dashboard={{
|
|
state: "loading",
|
|
title: "Loading Dashboard",
|
|
subtitle: "Fetching active model",
|
|
message: "Waiting for the active dashboard document.",
|
|
}}
|
|
theme="dark"
|
|
onThemeChange={() => undefined}
|
|
/>,
|
|
);
|
|
|
|
expect(html).toContain('data-ui-theme-toggle="true"');
|
|
expect(html).toContain('data-ui-theme-current="dark"');
|
|
expect(html).toContain('aria-label="Light theme"');
|
|
expect(html).toContain('aria-pressed="false"');
|
|
expect(html).toContain("Theme");
|
|
expect(html).toContain("Dark");
|
|
expect(html).toContain("Light");
|
|
});
|
|
});
|