diff --git a/apps/web/src/components/mindmap/MermaidViewer.test.tsx b/apps/web/src/components/mindmap/MermaidViewer.test.tsx new file mode 100644 index 0000000..20f2d78 --- /dev/null +++ b/apps/web/src/components/mindmap/MermaidViewer.test.tsx @@ -0,0 +1,237 @@ +/** + * MermaidViewer XSS Protection Tests + * Tests defense-in-depth security layers for Mermaid diagram rendering + */ + +import { describe, it, expect, vi, beforeEach } from "vitest"; +import { render, waitFor } from "@testing-library/react"; +import { MermaidViewer } from "./MermaidViewer"; + +// Mock mermaid +vi.mock("mermaid", () => ({ + default: { + initialize: vi.fn(), + render: vi.fn(), + }, +})); + +describe("MermaidViewer XSS Protection", () => { + beforeEach(() => { + vi.clearAllMocks(); + }); + + describe("Script tag injection", () => { + it("should block script tags in labels", async () => { + const maliciousDiagram = `graph TD + A[""]`; + + const { container } = render(); + + await waitFor(() => { + const content = container.innerHTML; + // Should not contain script tags + expect(content).not.toContain(""]`; + + const { container } = render(); + + await waitFor(() => { + const content = container.innerHTML.toLowerCase(); + expect(content).not.toContain("'>"]`; + + const { container } = render(); + + await waitFor(() => { + const content = container.innerHTML; + expect(content).not.toContain("data:text/html"); + expect(content).not.toContain(""]`; + + const { container } = render(); + + await waitFor(() => { + const content = container.innerHTML; + // SVG should be sanitized to remove scripts + expect(content).not.toContain("Test", + bindFunctions: vi.fn(), + diagramType: "flowchart", + }); + + const { container } = render(); + + await waitFor(() => { + const content = container.innerHTML; + // DOMPurify should remove the script tag + expect(content).not.toContain("` +2. Event handlers: `` +3. JavaScript URLs: `javascript:alert(1)` +4. Data URLs: `data:text/html,` +5. SVG with embedded scripts +6. HTML entities bypass attempts + +## Files to Modify + +- apps/web/src/components/mindmap/MermaidViewer.tsx +- apps/web/src/components/mindmap/hooks/useGraphData.ts +- apps/web/src/components/mindmap/MermaidViewer.test.tsx (new)