test(10-02): add SkillBrowser SSR smoke tests
- 4 node-environment tests using renderToStaticMarkup - Verifies page title, search input, refresh button, and tab labels render - Mocks react-query, router, context providers for SSR compatibility
This commit is contained in:
parent
7ad2671252
commit
daef2c24cb
1 changed files with 63 additions and 0 deletions
63
ui/src/pages/SkillBrowser.test.tsx
Normal file
63
ui/src/pages/SkillBrowser.test.tsx
Normal file
|
|
@ -0,0 +1,63 @@
|
|||
// @vitest-environment node
|
||||
|
||||
import { describe, expect, it, vi } from "vitest";
|
||||
import { renderToStaticMarkup } from "react-dom/server";
|
||||
|
||||
// Mock all external dependencies for SSR
|
||||
vi.mock("react-router-dom", () => ({
|
||||
Link: ({ to, children, ...props }: React.AnchorHTMLAttributes<HTMLAnchorElement> & { to: string; children?: React.ReactNode }) => <a href={to} {...props}>{children}</a>,
|
||||
useNavigate: () => () => {},
|
||||
}));
|
||||
|
||||
vi.mock("@/lib/router", () => ({
|
||||
Link: ({ to, children, ...props }: React.AnchorHTMLAttributes<HTMLAnchorElement> & { to: string; children?: React.ReactNode }) => <a href={to} {...props}>{children}</a>,
|
||||
useNavigate: () => () => {},
|
||||
}));
|
||||
|
||||
vi.mock("@tanstack/react-query", () => ({
|
||||
useQuery: () => ({ data: [], isLoading: false, isError: false }),
|
||||
useQueryClient: () => ({ invalidateQueries: () => {} }),
|
||||
useMutation: () => ({ mutate: () => {}, isPending: false }),
|
||||
}));
|
||||
|
||||
vi.mock("@/context/BreadcrumbContext", () => ({
|
||||
useBreadcrumbs: () => ({ setBreadcrumbs: () => {} }),
|
||||
}));
|
||||
|
||||
vi.mock("@/context/CompanyContext", () => ({
|
||||
useCompany: () => ({ selectedCompany: { id: "test", name: "Test Workspace", slug: "TST" } }),
|
||||
}));
|
||||
|
||||
vi.mock("@/context/ToastContext", () => ({
|
||||
useToast: () => ({ pushToast: () => {} }),
|
||||
}));
|
||||
|
||||
vi.mock("@/context/SidebarContext", () => ({
|
||||
useSidebar: () => ({ isMobile: false }),
|
||||
}));
|
||||
|
||||
import { SkillBrowser } from "./SkillBrowser";
|
||||
|
||||
describe("SkillBrowser", () => {
|
||||
it("renders page title", () => {
|
||||
const html = renderToStaticMarkup(<SkillBrowser />);
|
||||
expect(html).toContain("Skills");
|
||||
});
|
||||
|
||||
it("renders Browse tab content", () => {
|
||||
const html = renderToStaticMarkup(<SkillBrowser />);
|
||||
expect(html).toContain("Search skills");
|
||||
});
|
||||
|
||||
it("renders Refresh registry button", () => {
|
||||
const html = renderToStaticMarkup(<SkillBrowser />);
|
||||
expect(html).toContain("Refresh registry");
|
||||
});
|
||||
|
||||
it("renders tab labels", () => {
|
||||
const html = renderToStaticMarkup(<SkillBrowser />);
|
||||
expect(html).toContain("Browse");
|
||||
expect(html).toContain("Installed");
|
||||
expect(html).toContain("Trending");
|
||||
});
|
||||
});
|
||||
Loading…
Add table
Reference in a new issue