@cuppacue/cli 0.1.0

package/dist/markdown/__tests__/parser.test.js

@@ -0,0 +1,646 @@
+import { describe, it, expect, beforeEach } from "vitest";
+import { parseMarkdown } from "../parser.js";
+import { resetCounters } from "../id.js";
+describe("parseMarkdown", () => {
+    beforeEach(() => {
+        resetCounters();
+    });
+    it("splits scenes on ---", () => {
+        const md = `# Scene One
+
+---
+
+# Scene Two
+
+---
+
+# Scene Three`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes).toHaveLength(3);
+    });
+    it("maps H1 to title element", () => {
+        const { content } = parseMarkdown("# Hello World");
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("text");
+        expect(el).toHaveProperty("role", "title");
+        expect(el).toHaveProperty("content", "Hello World");
+    });
+    it("maps H2 to heading element", () => {
+        const { content } = parseMarkdown("## Section Title");
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("text");
+        expect(el).toHaveProperty("role", "heading");
+        expect(el).toHaveProperty("content", "Section Title");
+    });
+    it("maps H3 to subtitle element", () => {
+        const { content } = parseMarkdown("### A Subtitle");
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("text");
+        expect(el).toHaveProperty("role", "subtitle");
+    });
+    it("maps code fences to CodeElement", () => {
+        const { content } = parseMarkdown("```typescript\nconst x = 1;\n```");
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("code");
+        expect(el).toHaveProperty("language", "typescript");
+        expect(el).toHaveProperty("content", "const x = 1;");
+    });
+    it("maps blockquote to caption", () => {
+        const { content } = parseMarkdown("> A caption");
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("text");
+        expect(el).toHaveProperty("role", "caption");
+    });
+    it("maps unordered list to ListElement", () => {
+        const { content } = parseMarkdown("- One\n- Two\n- Three");
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("list");
+        expect(el).toHaveProperty("items", ["One", "Two", "Three"]);
+        expect(el).toHaveProperty("ordered", false);
+    });
+    it("maps ordered list", () => {
+        const { content } = parseMarkdown("1. First\n2. Second");
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("list");
+        expect(el).toHaveProperty("ordered", true);
+    });
+    it("generates unique IDs across elements", () => {
+        const { content } = parseMarkdown("# Title\n\n### Subtitle\n\nParagraph");
+        const ids = content.scenes[0].elements.map((el) => el.id);
+        const unique = new Set(ids);
+        expect(unique.size).toBe(ids.length);
+    });
+    it("maps image in paragraph to ImageElement", () => {
+        const { content } = parseMarkdown("![Alt text](image.png)");
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("image");
+        expect(el).toHaveProperty("src", "image.png");
+        expect(el).toHaveProperty("alt", "Alt text");
+    });
+    it("assigns layout to each scene", () => {
+        const { content } = parseMarkdown("# Title\n\n---\n\n## Heading\n\n- Item 1\n- Item 2");
+        expect(content.scenes[0].layout).toBe("intro");
+        expect(content.scenes[1].layout).toBe("header-body");
+    });
+    it("does not set position fields on elements", () => {
+        const { content } = parseMarkdown("# Title\n\n```ts\nconst x = 1;\n```");
+        for (const el of content.scenes[0].elements) {
+            expect(el).not.toHaveProperty("position");
+        }
+    });
+    // ── Speaker Notes ───────────────────────────────────────
+    it("extracts notes from HTML comment", () => {
+        const { content } = parseMarkdown("# Title\n\n<!-- notes: Remember to explain this -->");
+        expect(content.scenes[0].notes).toBe("Remember to explain this");
+    });
+    it("extracts multi-line notes", () => {
+        const { content } = parseMarkdown("# Title\n\n<!-- notes: Line one\nLine two\nLine three -->");
+        expect(content.scenes[0].notes).toBe("Line one\nLine two\nLine three");
+    });
+    it("does not render notes comment as element", () => {
+        const { content } = parseMarkdown("# Title\n\n<!-- notes: secret -->");
+        expect(content.scenes[0].elements).toHaveLength(1);
+        expect(content.scenes[0].elements[0].type).toBe("text");
+    });
+    it("scene without notes has no notes field", () => {
+        const { content } = parseMarkdown("# Title");
+        expect(content.scenes[0]).not.toHaveProperty("notes");
+    });
+    // ── Inline Formatting ────────────────────────────────────
+    it("preserves bold formatting in paragraph", () => {
+        const { content } = parseMarkdown("This is **bold** text");
+        const el = content.scenes[0].elements[0];
+        expect(el).toHaveProperty("content");
+        expect(el.content).toContain("<strong>bold</strong>");
+    });
+    it("preserves italic formatting", () => {
+        const { content } = parseMarkdown("This is *italic* text");
+        const el = content.scenes[0].elements[0];
+        expect(el.content).toContain("<em>italic</em>");
+    });
+    it("preserves inline code", () => {
+        const { content } = parseMarkdown("Use `const x = 1` here");
+        const el = content.scenes[0].elements[0];
+        expect(el.content).toContain("<code>const x = 1</code>");
+    });
+    it("preserves strikethrough", () => {
+        const { content } = parseMarkdown("This is ~~wrong~~ correct");
+        const el = content.scenes[0].elements[0];
+        expect(el.content).toContain("<del>wrong</del>");
+    });
+    it("preserves markdown links", () => {
+        const { content } = parseMarkdown("Visit [Google](https://google.com)");
+        const el = content.scenes[0].elements[0];
+        expect(el.content).toContain('<a href="https://google.com"');
+        expect(el.content).toContain("Google</a>");
+    });
+    it("preserves inline formatting in headings", () => {
+        const { content } = parseMarkdown("# Hello **World**");
+        const el = content.scenes[0].elements[0];
+        expect(el.content).toContain("<strong>World</strong>");
+    });
+    it("preserves inline formatting in list items", () => {
+        const { content } = parseMarkdown("- **Bold** item\n- *Italic* item");
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("list");
+        expect(el.items[0]).toContain("<strong>Bold</strong>");
+        expect(el.items[1]).toContain("<em>Italic</em>");
+    });
+    it("escapes HTML in text", () => {
+        const { content } = parseMarkdown("Use <script>alert('xss')</script> carefully");
+        const el = content.scenes[0].elements[0];
+        expect(el.content).not.toContain("<script>");
+        expect(el.content).toContain("&lt;script&gt;");
+    });
+    it("plain text without formatting is unchanged", () => {
+        const { content } = parseMarkdown("Plain text paragraph");
+        const el = content.scenes[0].elements[0];
+        expect(el.content).toBe("Plain text paragraph");
+    });
+    // ── Tables ───────────────────────────────────────────────
+    it("maps markdown table to TableElement", () => {
+        const md = "| Name | Age |\n| --- | --- |\n| Alice | 30 |\n| Bob | 25 |";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("table");
+        expect(el).toHaveProperty("headers", ["Name", "Age"]);
+        expect(el).toHaveProperty("rows", [["Alice", "30"], ["Bob", "25"]]);
+    });
+    it("preserves table column alignments", () => {
+        const md = "| Left | Center | Right |\n| :--- | :---: | ---: |\n| a | b | c |";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el.alignments).toEqual(["left", "center", "right"]);
+    });
+    it("supports inline formatting in table cells", () => {
+        const md = "| Feature | Status |\n| --- | --- |\n| **Bold** | *Done* |";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el.rows[0][0]).toContain("<strong>Bold</strong>");
+        expect(el.rows[0][1]).toContain("<em>Done</em>");
+    });
+    it("infers header-body layout for heading + table", () => {
+        const md = "## Comparison\n\n| A | B |\n| --- | --- |\n| 1 | 2 |";
+        const { content } = parseMarkdown(md);
+        expect(content.scenes[0].layout).toBe("header-body");
+    });
+    // ── Custom Element Types ────────────────────────────────────
+    it("maps ```mermaid to MermaidElement", () => {
+        const md = "```mermaid\nflowchart LR\n  A --> B\n```";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("mermaid");
+        expect(el).toHaveProperty("definition", "flowchart LR\n  A --> B");
+    });
+    it("maps ```chart:bar to ChartElement", () => {
+        const md = "```chart:bar\n| X | Y |\n| A | 10 |\n```";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("chart");
+        expect(el).toHaveProperty("chartType", "bar");
+    });
+    it("maps ```chart:pie to ChartElement", () => {
+        const md = "```chart:pie\n| Cat | Count |\n| Dogs | 60 |\n| Cats | 40 |\n```";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("chart");
+        expect(el).toHaveProperty("chartType", "pie");
+    });
+    it("maps ```cards to CardsElement", () => {
+        const md = "```cards\n- title: Fast\n  icon: zap\n  desc: Quick builds\n```";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("cards");
+        expect(el).toHaveProperty("cards");
+        expect(el.cards).toHaveLength(1);
+    });
+    it("maps ```stats to StatsElement", () => {
+        const md = "```stats\n- 100 | Users\n- 50 | Projects\n```";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("stats");
+        expect(el).toHaveProperty("stats");
+        expect(el.stats).toHaveLength(2);
+    });
+    it("maps ```terminal to TerminalElement", () => {
+        const md = "```terminal\n$ echo hello\nhello\n```";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("terminal");
+        expect(el).toHaveProperty("lines");
+        expect(el.lines).toHaveLength(2);
+    });
+    it("infers header-body layout for heading + custom element", () => {
+        const md = "## Metrics\n\n```stats\n- 100 | Users\n```";
+        const { content } = parseMarkdown(md);
+        expect(content.scenes[0].layout).toBe("header-body");
+    });
+    it("infers full layout for standalone custom element", () => {
+        const md = "```chart:bar\n| X | Y |\n| A | 10 |\n```";
+        const { content } = parseMarkdown(md);
+        expect(content.scenes[0].layout).toBe("full");
+    });
+    it("regular code blocks are not affected by custom parsing", () => {
+        const md = "```typescript\nconst x = 1;\n```";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("code");
+        expect(el).toHaveProperty("language", "typescript");
+    });
+    it("tracks local image resources", () => {
+        const md = "![arch](./images/arch.png)";
+        const { localResources } = parseMarkdown(md);
+        expect(localResources).toContain("./images/arch.png");
+    });
+    it("does not track external image URLs as resources", () => {
+        const md = "![logo](https://example.com/logo.png)";
+        const { localResources } = parseMarkdown(md);
+        expect(localResources).toHaveLength(0);
+    });
+    // ── Per-Slide Frontmatter ─────────────────────────────────
+    it("applies layout override from per-slide frontmatter", () => {
+        const md = `# Slide 1
+
+---
+layout: split
+---
+
+## Slide 2
+
+Some body text`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes).toHaveLength(2);
+        expect(content.scenes[1].layout).toBe("split");
+    });
+    it("applies background from per-slide frontmatter", () => {
+        const md = `# Slide 1
+
+---
+background: "#1a1a2e"
+---
+
+## Slide 2`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes[1].background).toBe("#1a1a2e");
+    });
+    it("applies transition from per-slide frontmatter", () => {
+        const md = `# Slide 1
+
+---
+transition: fade
+---
+
+## Slide 2`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes[1].transition).toEqual({ type: "fade" });
+    });
+    it("applies class from per-slide frontmatter", () => {
+        const md = `# Slide 1
+
+---
+class: emphasis
+---
+
+## Slide 2`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes[1].class).toBe("emphasis");
+    });
+    it("injects image element from frontmatter image field", () => {
+        const md = `# Slide 1
+
+---
+layout: image-right
+image: ./images/photo.jpg
+---
+
+## Slide 2`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes[1].layout).toBe("image-right");
+        const imgEl = content.scenes[1].elements.find(e => e.type === "image");
+        expect(imgEl).toBeDefined();
+        expect(imgEl).toHaveProperty("src", "./images/photo.jpg");
+    });
+    it("tracks frontmatter image as local resource", () => {
+        const md = `---
+layout: intro
+image: ./images/logo.png
+---
+
+# Title`;
+        const { localResources } = parseMarkdown(md);
+        expect(localResources).toContain("./images/logo.png");
+    });
+    it("slides without frontmatter still work normally", () => {
+        const md = `# Slide 1
+
+---
+
+## Slide 2
+
+- Item A
+- Item B`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes).toHaveLength(2);
+        expect(content.scenes[0].layout).toBe("intro");
+        expect(content.scenes[1].layout).toBe("header-body");
+    });
+    it("handles multiple slides with mixed frontmatter", () => {
+        const md = `# Title
+
+---
+layout: section
+---
+
+## Part One
+
+---
+
+## Part Two
+
+- Detail`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes).toHaveLength(3);
+        expect(content.scenes[0].layout).toBe("intro");
+        expect(content.scenes[1].layout).toBe("section");
+        expect(content.scenes[2].layout).toBe("header-body");
+    });
+    it("does not treat regular text with colons as frontmatter", () => {
+        const md = `# Slide 1
+
+---
+
+Author: John Doe wrote this
+
+---
+
+## Slide 3`;
+        const { content } = parseMarkdown(md);
+        // "Author:" is not a known FM key, so it's treated as slide content
+        expect(content.scenes).toHaveLength(3);
+        expect(content.scenes[1].elements.length).toBeGreaterThan(0);
+    });
+    // ── Background Image Resources ──────────────────────────────
+    it("tracks background image path as local resource", () => {
+        const md = `# Slide 1
+
+---
+background: ./images/hero.jpg
+---
+
+## Slide 2`;
+        const { localResources } = parseMarkdown(md);
+        expect(localResources).toContain("./images/hero.jpg");
+    });
+    it("does not track background color as resource", () => {
+        const md = `# Slide 1
+
+---
+background: "#1a1a2e"
+---
+
+## Slide 2`;
+        const { localResources } = parseMarkdown(md);
+        expect(localResources).toHaveLength(0);
+    });
+    it("does not track external background URL as resource", () => {
+        const md = `# Slide 1
+
+---
+background: https://example.com/hero.jpg
+---
+
+## Slide 2`;
+        const { localResources } = parseMarkdown(md);
+        expect(localResources).toHaveLength(0);
+    });
+    // ── Footer Directive ────────────────────────────────────
+    it("extracts footer from HTML comment directive", () => {
+        const { content } = parseMarkdown("# Title\n\n<!-- footer: Q4 2025 Report -->");
+        const footer = content.scenes[0].elements.find((e) => e.type === "text" && e.role === "footer");
+        expect(footer).toBeDefined();
+        expect(footer).toHaveProperty("content", "Q4 2025 Report");
+    });
+    it("footer element does not affect layout inference", () => {
+        const { content } = parseMarkdown("# Title\n\n<!-- footer: Some text -->");
+        // Title-only slide should still be intro, not header-body
+        expect(content.scenes[0].layout).toBe("intro");
+    });
+    // ── AccentBar Frontmatter ──────────────────────────────
+    it("applies accentBar from per-slide frontmatter", () => {
+        const md = `# Slide 1
+
+---
+accentBar: "#38bdf8"
+---
+
+## Slide 2`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes[1].accentBar).toBeDefined();
+        expect(content.scenes[1].accentBar.color).toBe("#38bdf8");
+    });
+    it("parses accentBar with position", () => {
+        const md = `# Slide 1
+
+---
+accentBar: "#38bdf8 bottom"
+---
+
+## Slide 2`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes[1].accentBar).toBeDefined();
+        expect(content.scenes[1].accentBar.color).toBe("#38bdf8");
+        expect(content.scenes[1].accentBar.position).toBe("bottom");
+    });
+    // ── Scene Templates ───────────────────────────────────────
+    it("auto-assigns intro template to first scene", () => {
+        const md = `# Title
+
+---
+
+## Content
+
+- Item 1
+
+---
+
+## Thank You`;
+        const { content } = parseMarkdown(md, { presentationTemplate: "tech-talk" });
+        expect(content.scenes[0].sceneTemplate).toBe("tech-talk/intro");
+    });
+    it("auto-assigns closing template to last scene", () => {
+        const md = `# Title
+
+---
+
+## Content
+
+- Item 1
+
+---
+
+## Thank You`;
+        const { content } = parseMarkdown(md, { presentationTemplate: "tech-talk" });
+        expect(content.scenes[2].sceneTemplate).toBe("tech-talk/closing");
+    });
+    it("auto-assigns section template to heading-only scenes", () => {
+        const md = `# Title
+
+---
+
+## Section Divider
+
+---
+
+## Content
+
+- Item 1
+
+---
+
+## Thank You`;
+        const { content } = parseMarkdown(md, { presentationTemplate: "tech-talk" });
+        expect(content.scenes[1].sceneTemplate).toBe("tech-talk/section");
+    });
+    it("auto-assigns content template to list scenes", () => {
+        const md = `# Title
+
+---
+
+## Content
+
+- Item 1
+- Item 2
+
+---
+
+## Thank You`;
+        const { content } = parseMarkdown(md, { presentationTemplate: "tech-talk" });
+        expect(content.scenes[1].sceneTemplate).toBe("tech-talk/content");
+    });
+    it("auto-assigns code template to scenes with code elements", () => {
+        const md = `# Title
+
+---
+
+## Example
+
+\`\`\`typescript
+const x = 1;
+\`\`\`
+
+---
+
+## Thank You`;
+        const { content } = parseMarkdown(md, { presentationTemplate: "tech-talk" });
+        expect(content.scenes[1].sceneTemplate).toBe("tech-talk/code");
+    });
+    it("code template takes priority over content when both code and list present", () => {
+        const md = `# Title
+
+---
+
+## Mixed
+
+- Point one
+
+\`\`\`typescript
+const x = 1;
+\`\`\`
+
+---
+
+## Thank You`;
+        const { content } = parseMarkdown(md, { presentationTemplate: "tech-talk" });
+        expect(content.scenes[1].sceneTemplate).toBe("tech-talk/code");
+    });
+    it("per-slide template override is not overwritten by auto-assignment", () => {
+        const md = `---
+template: custom/intro
+badge: "MY TALK"
+---
+
+# Title
+
+---
+
+## Thank You`;
+        const { content } = parseMarkdown(md, { presentationTemplate: "tech-talk" });
+        expect(content.scenes[0].sceneTemplate).toBe("custom/intro");
+        expect(content.scenes[0].templateData).toEqual({ badge: "MY TALK" });
+    });
+    it("collects templateData from frontmatter", () => {
+        const md = `---
+template: tech-talk/intro
+badge: "TECH TALK"
+footerKeywords: "Fast · Reliable · Open Source"
+---
+
+# Title`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes[0].sceneTemplate).toBe("tech-talk/intro");
+        expect(content.scenes[0].templateData).toEqual({
+            badge: "TECH TALK",
+            footerKeywords: "Fast · Reliable · Open Source",
+        });
+    });
+    it("non-templated presentations are unchanged", () => {
+        const md = `# Title
+
+---
+
+## Content
+
+- Item`;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes[0].sceneTemplate).toBeUndefined();
+        expect(content.scenes[1].sceneTemplate).toBeUndefined();
+    });
+    // ── Code Highlight Lines ─────────────────────────────────
+    it("parses highlight lines from code fence info string", () => {
+        const md = "```typescript {1-3,5}\nconst a = 1;\nconst b = 2;\nconst c = 3;\nconst d = 4;\nconst e = 5;\n```";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el.type).toBe("code");
+        expect(el).toHaveProperty("highlightLines", [1, 2, 3, 5]);
+        expect(el).toHaveProperty("language", "typescript");
+    });
+    it("parses single line highlight", () => {
+        const md = "```python {3}\nprint('a')\nprint('b')\nprint('c')\n```";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el).toHaveProperty("highlightLines", [3]);
+        expect(el).toHaveProperty("language", "python");
+    });
+    it("code without highlight lines has no highlightLines field", () => {
+        const md = "```typescript\nconst x = 1;\n```";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el).not.toHaveProperty("highlightLines");
+    });
+    it("parses multiple ranges in highlight lines", () => {
+        const md = "```js {1-2,4-6,8}\nline1\nline2\nline3\nline4\nline5\nline6\nline7\nline8\n```";
+        const { content } = parseMarkdown(md);
+        const el = content.scenes[0].elements[0];
+        expect(el).toHaveProperty("highlightLines", [1, 2, 4, 5, 6, 8]);
+    });
+    it("does not split on --- inside code fences", () => {
+        const md = `# Slide 1
+
+---
+
+## Slide 2
+
+\`\`\`markdown
+---
+layout: split
+---
+\`\`\``;
+        const { content } = parseMarkdown(md);
+        expect(content.scenes).toHaveLength(2);
+        // The code block should contain the --- lines
+        const codeEl = content.scenes[1].elements.find(e => e.type === "code");
+        expect(codeEl).toBeDefined();
+        expect(codeEl.content).toContain("---");
+    });
+});
+//# sourceMappingURL=parser.test.js.map