zombie-mermaid 4.2.2 → 4.2.3

package/src/__tests__/statements.test.ts

@@ -1,264 +0,0 @@
-/**
- * Tests for issue #181 — semicolon-separated statements.
- *
- * `detectDiagramType` isolated the header by splitting on `[\n;]`, so
- * `sequenceDiagram;A->>B: Hi` routed to the sequence pipeline — but every
- * parser then split the body on newlines only, discarding everything after
- * the header and rendering an empty diagram. The same gap existed on the
- * flowchart path, where `flowchart TD;A-->B` instead threw
- * "Invalid mermaid header".
- *
- * `splitStatements` is now the single definition of "what is one statement",
- * shared by the detector and all five parser entry points.
- */
-import { describe, it, expect } from 'vitest'
-import { splitStatements, detectDiagramType } from '@zombie-mermaid/core'
-import { renderMermaidASCII, renderMermaidSVG } from '../index.ts'
-
-/** Project a `splitStatements` result down to just the text, for assertions
- * that don't care about position (see the dedicated `line` tests below for
- * position coverage). */
-const texts = (source: string) => splitStatements(source).map((s) => s.text)
-
-describe('splitStatements (issue #181)', () => {
-  it('splits on newlines', () => {
-    expect(texts('graph TD\nA-->B')).toEqual(['graph TD', 'A-->B'])
-  })
-
-  it('splits on semicolons', () => {
-    expect(texts('graph TD;A-->B;B-->C')).toEqual([
-      'graph TD',
-      'A-->B',
-      'B-->C',
-    ])
-  })
-
-  it('drops empty statements from trailing or repeated separators', () => {
-    expect(texts('graph TD;A-->B;')).toEqual(['graph TD', 'A-->B'])
-    expect(texts('graph TD;;;A-->B')).toEqual(['graph TD', 'A-->B'])
-    expect(texts('graph TD\n\n\nA-->B')).toEqual(['graph TD', 'A-->B'])
-  })
-
-  it('trims whitespace around each statement', () => {
-    expect(texts('  graph TD  ;  A-->B  ')).toEqual(['graph TD', 'A-->B'])
-  })
-
-  describe('does not split a semicolon that is not a separator', () => {
-    it('inside a double-quoted label', () => {
-      expect(texts('graph TD\nA["a; b"]-->B')).toEqual([
-        'graph TD',
-        'A["a; b"]-->B',
-      ])
-    })
-
-    it('inside a single-quoted label', () => {
-      expect(texts("graph TD\nA['x; y']-->B")).toEqual([
-        'graph TD',
-        "A['x; y']-->B",
-      ])
-    })
-
-    it('terminating a named character reference', () => {
-      expect(texts('graph TD\nA[&]-->B')).toEqual([
-        'graph TD',
-        'A[&]-->B',
-      ])
-    })
-
-    it('terminating a numeric character reference', () => {
-      expect(texts('graph TD\nA[#]-->B')).toEqual([
-        'graph TD',
-        'A[#]-->B',
-      ])
-    })
-
-    it('terminating a hex character reference', () => {
-      expect(texts('graph TD\nA[😀]-->B')).toEqual([
-        'graph TD',
-        'A[😀]-->B',
-      ])
-    })
-
-    it('but still splits a real separator on the same line as an entity', () => {
-      expect(texts('graph TD;A[&]-->B;B-->C')).toEqual([
-        'graph TD',
-        'A[&]-->B',
-        'B-->C',
-      ])
-    })
-
-    it('and treats a lone ampersand as an ordinary character', () => {
-      // `A & B` is flowchart's parallel-link syntax, not an entity.
-      expect(texts('graph TD;A-->B & C')).toEqual(['graph TD', 'A-->B & C'])
-    })
-  })
-
-  describe('comments', () => {
-    it('drops whole-line comments without splitting their semicolons', () => {
-      expect(texts('graph TD\n%% note; not code\nA-->B')).toEqual([
-        'graph TD',
-        'A-->B',
-      ])
-    })
-
-    it('drops a comment that only begins after a semicolon', () => {
-      expect(texts('graph TD\nA-->B; %% note')).toEqual(['graph TD', 'A-->B'])
-    })
-
-    it('lets the comment swallow the rest of the line', () => {
-      /*
-       * A Mermaid comment runs to end of line, so a `;` inside it must not
-       * resurrect what follows. Splitting first and then discarding fragments
-       * that merely begin with `%%` left `C-->D` parsing as code.
-       */
-      expect(texts('graph TD\nA-->B; %% note; C-->D')).toEqual([
-        'graph TD',
-        'A-->B',
-      ])
-    })
-
-    it('treats %% inside a quoted label as text, not a comment', () => {
-      expect(texts('graph TD\nA["100%% done"]-->B')).toEqual([
-        'graph TD',
-        'A["100%% done"]-->B',
-      ])
-    })
-  })
-
-  describe("Mermaid's own #-prefixed character references", () => {
-    /*
-     * Mermaid spells character references with `#` where HTML uses `&` —
-     * `#59;` is the documented way to put a literal semicolon in a label.
-     * Treating that `;` as a separator both corrupts the label and invents a
-     * statement from the remainder.
-     */
-    it.each([
-      ['A[semi #59; here]-->B', 'a numeric reference'],
-      ['A[heart #9829; x]-->B', 'a symbol reference'],
-      ['A[say #quot;hi#quot;]-->B', 'a named reference'],
-    ])('keeps %s intact (%s)', (statement) => {
-      expect(texts(`graph TD\n  ${statement}`)).toEqual(['graph TD', statement])
-    })
-
-    it('still splits a real separator on the same line as one', () => {
-      expect(texts('graph TD;A[#59;]-->B;B-->C')).toEqual([
-        'graph TD',
-        'A[#59;]-->B',
-        'B-->C',
-      ])
-    })
-
-    it('leaves a bare # that is not a reference alone', () => {
-      expect(texts('graph TD;A[C# lang]-->B')).toEqual([
-        'graph TD',
-        'A[C# lang]-->B',
-      ])
-    })
-  })
-})
-
-describe('splitStatements — line numbers (issue #760)', () => {
-  it('reports the 1-based physical source line for each newline-separated statement', () => {
-    const stmts = splitStatements('graph TD\nA-->B\nB-->C')
-    expect(stmts.map((s) => s.line)).toEqual([1, 2, 3])
-  })
-
-  it('carries forward the original line number across dropped blank lines', () => {
-    const stmts = splitStatements('graph TD\n\n\nA-->B')
-    expect(stmts.map((s) => ({ text: s.text, line: s.line }))).toEqual([
-      { text: 'graph TD', line: 1 },
-      { text: 'A-->B', line: 4 },
-    ])
-  })
-
-  it('carries forward the original line number across a dropped comment line', () => {
-    const stmts = splitStatements('graph TD\n%% a comment\nA-->B')
-    expect(stmts.map((s) => ({ text: s.text, line: s.line }))).toEqual([
-      { text: 'graph TD', line: 1 },
-      { text: 'A-->B', line: 3 },
-    ])
-  })
-
-  it('gives every semicolon-separated statement on one physical line the same line number', () => {
-    const stmts = splitStatements('graph TD\nA-->B;B-->C;C-->D')
-    expect(stmts.map((s) => s.line)).toEqual([1, 2, 2, 2])
-  })
-})
-
-describe('semicolon-separated diagrams render their bodies (issue #181)', () => {
-  const cases = [
-    {
-      type: 'flowchart' as const,
-      // Previously threw: the header regex saw the whole line.
-      source: 'flowchart TD;A-->B;B-->C',
-      expected: ['A', 'B', 'C'],
-    },
-    {
-      type: 'sequence' as const,
-      source: 'sequenceDiagram;A->>B: Hi',
-      expected: ['A', 'B', 'Hi'],
-    },
-    {
-      type: 'class' as const,
-      source: 'classDiagram;class Animal;class Dog',
-      expected: ['Animal', 'Dog'],
-    },
-    {
-      type: 'er' as const,
-      source: 'erDiagram;CUSTOMER ||--o{ ORDER : places',
-      expected: ['CUSTOMER', 'ORDER', 'places'],
-    },
-    {
-      type: 'xychart' as const,
-      source: 'xychart-beta;title "Sales";bar [1, 2, 3]',
-      expected: ['Sales'],
-    },
-  ]
-
-  for (const { type, source, expected } of cases) {
-    describe(type, () => {
-      it('routes to the expected pipeline', () => {
-        expect(detectDiagramType(source)).toBe(type)
-      })
-
-      it('renders the body to ASCII instead of an empty diagram', () => {
-        const ascii = renderMermaidASCII(source, { colorMode: 'none' })
-        expect(ascii.trim()).not.toBe('')
-        for (const token of expected) expect(ascii).toContain(token)
-      })
-
-      it('renders the body to SVG instead of an empty diagram', () => {
-        const svg = renderMermaidSVG(source)
-        for (const token of expected) expect(svg).toContain(token)
-      })
-    })
-  }
-
-  it('accepts semicolons after a newline-separated header', () => {
-    const ascii = renderMermaidASCII('sequenceDiagram\nA->>B: Hi;B->>C: Yo', {
-      colorMode: 'none',
-    })
-    expect(ascii).toContain('Hi')
-    expect(ascii).toContain('Yo')
-    expect(ascii).toContain('C')
-    // The old behavior swallowed the second message into the first label.
-    expect(ascii).not.toContain('Hi;B')
-  })
-
-  it('leaves newline-separated sources rendering identically', () => {
-    const withNewlines = renderMermaidASCII('flowchart TD\nA-->B\nB-->C', {
-      colorMode: 'none',
-    })
-    const withSemicolons = renderMermaidASCII('flowchart TD;A-->B;B-->C', {
-      colorMode: 'none',
-    })
-    expect(withSemicolons).toBe(withNewlines)
-  })
-
-  it('preserves a semicolon that is part of a label', () => {
-    const ascii = renderMermaidASCII('flowchart TD\nA["a; b"]-->B', {
-      colorMode: 'none',
-    })
-    expect(ascii).toContain('a; b')
-  })
-})

package/src/__tests__/styles.test.ts

@@ -1,220 +0,0 @@
-/**
- * Tests for styles module — text measurement and constants.
- * Theme resolution tests are in theme.test.ts (CSS custom property system).
- */
-import { describe, it, expect } from 'vitest'
-import {
-  estimateTextWidth,
-  FONT_SIZES,
-  FONT_WEIGHTS,
-  NODE_PADDING,
-  STROKE_WIDTHS,
-  ARROW_HEAD,
-  buildSvgStyleBlock,
-} from '@zombie-mermaid/svg-renderer'
-import {
-  THEMES,
-  DEFAULTS,
-  fromShikiTheme,
-  buildStyleBlock,
-  svgOpenTag,
-} from '@zombie-mermaid/core'
-import type { DiagramColors } from '@zombie-mermaid/core'
-
-// ============================================================================
-// Theme system (CSS custom properties)
-// ============================================================================
-
-describe('THEMES', () => {
-  it('contains well-known theme palettes', () => {
-    expect(THEMES['zinc-light']).toBeDefined()
-    expect(THEMES['zinc-dark']).toBeDefined()
-    expect(THEMES['tokyo-night']).toBeDefined()
-    expect(THEMES['catppuccin-mocha']).toBeDefined()
-    expect(THEMES['nord']).toBeDefined()
-  })
-
-  it('each theme has valid bg and fg colors', () => {
-    for (const colors of Object.values(THEMES)) {
-      expect(colors.bg).toMatch(/^#[0-9a-fA-F]{6}$/)
-      expect(colors.fg).toMatch(/^#[0-9a-fA-F]{6}$/)
-    }
-  })
-})
-
-describe('DEFAULTS', () => {
-  it('provides zinc-light bg/fg', () => {
-    expect(DEFAULTS.bg).toBe('#FFFFFF')
-    expect(DEFAULTS.fg).toBe('#27272A')
-  })
-})
-
-describe('svgOpenTag', () => {
-  it('sets --bg and --fg CSS variables in inline style', () => {
-    const tag = svgOpenTag(400, 300, { bg: '#1a1b26', fg: '#a9b1d6' })
-    expect(tag).toContain('--bg:#1a1b26')
-    expect(tag).toContain('--fg:#a9b1d6')
-    expect(tag).toContain('background:var(--bg)')
-  })
-
-  it('includes optional enrichment variables when provided', () => {
-    const colors: DiagramColors = {
-      bg: '#1a1b26',
-      fg: '#a9b1d6',
-      line: '#3d59a1',
-      accent: '#7aa2f7',
-    }
-    const tag = svgOpenTag(400, 300, colors)
-    expect(tag).toContain('--line:#3d59a1')
-    expect(tag).toContain('--accent:#7aa2f7')
-  })
-
-  it('omits unset enrichment variables', () => {
-    const tag = svgOpenTag(400, 300, { bg: '#fff', fg: '#000' })
-    expect(tag).not.toContain('--line')
-    expect(tag).not.toContain('--accent')
-    expect(tag).not.toContain('--muted')
-  })
-})
-
-describe('buildStyleBlock', () => {
-  it('includes derived CSS variable declarations', () => {
-    const style = buildStyleBlock('Inter', false)
-    expect(style).toContain('--_text')
-    expect(style).toContain('--_line')
-    expect(style).toContain('--_arrow')
-    expect(style).toContain('--_node-fill')
-    expect(style).toContain('--_node-stroke')
-  })
-
-  it('includes mono font class when requested', () => {
-    const withMono = buildSvgStyleBlock('Inter', true)
-    expect(withMono).toContain('.mono')
-    expect(withMono).toContain('JetBrains Mono')
-
-    const withoutMono = buildStyleBlock('Inter', false)
-    expect(withoutMono).not.toContain('.mono')
-  })
-
-  it('buildSvgStyleBlock omits the mono rule and font face when hasMonoFont is false', () => {
-    const block = buildSvgStyleBlock('Inter', false)
-    expect(block).not.toContain('.mono')
-    expect(block).not.toContain('@font-face')
-    expect(block).toContain('--_text')
-  })
-
-  it('embeds the self-hosted mono subset as a base64 woff2 data URI (#1061)', () => {
-    const block = buildSvgStyleBlock('Inter', true)
-    expect(block).toContain('@font-face')
-    expect(block).toContain('data:font/woff2;base64,')
-    expect(block).toContain("font-family: 'JetBrains Mono NL';")
-    expect(block).toContain(
-      "  .mono { font-family: 'JetBrains Mono NL', 'SF Mono', 'Fira Code', ui-monospace, monospace; }",
-    )
-    expect(block).not.toContain('fonts.googleapis.com/css2?family=JetBrains')
-  })
-})
-
-describe('fromShikiTheme', () => {
-  it('extracts bg/fg from editor colors', () => {
-    const colors = fromShikiTheme({
-      type: 'dark',
-      colors: {
-        'editor.background': '#1a1b26',
-        'editor.foreground': '#a9b1d6',
-      },
-    })
-    expect(colors.bg).toBe('#1a1b26')
-    expect(colors.fg).toBe('#a9b1d6')
-  })
-
-  it('falls back for missing editor colors', () => {
-    const dark = fromShikiTheme({ type: 'dark' })
-    expect(dark.bg).toBe('#1e1e1e')
-    expect(dark.fg).toBe('#d4d4d4')
-
-    const light = fromShikiTheme({ type: 'light' })
-    expect(light.bg).toBe('#ffffff')
-    expect(light.fg).toBe('#333333')
-  })
-})
-
-// ============================================================================
-// Text width estimation
-// ============================================================================
-
-describe('estimateTextWidth', () => {
-  it('returns a positive number for non-empty text', () => {
-    const width = estimateTextWidth('Hello', 13, 500)
-    expect(width).toBeGreaterThan(0)
-  })
-
-  it('returns minimum padding for empty text', () => {
-    // Empty text still returns minimum padding (fontSize * 0.15) for layout safety
-    expect(estimateTextWidth('', 13, 500)).toBeCloseTo(1.95, 1)
-  })
-
-  it('scales with text length', () => {
-    const short = estimateTextWidth('Hi', 13, 500)
-    const long = estimateTextWidth('Hello World', 13, 500)
-    expect(long).toBeGreaterThan(short)
-  })
-
-  it('scales with font size', () => {
-    const small = estimateTextWidth('Text', 11, 500)
-    const large = estimateTextWidth('Text', 16, 500)
-    expect(large).toBeGreaterThan(small)
-  })
-
-  it('heavier weights produce wider estimates', () => {
-    const regular = estimateTextWidth('Text', 13, 400)
-    const bold = estimateTextWidth('Text', 13, 600)
-    expect(bold).toBeGreaterThan(regular)
-  })
-
-  it('produces reasonable widths for typical node labels', () => {
-    // A 5-character label at 13px/500w should be roughly 35px (5 * 13 * 0.55)
-    const width = estimateTextWidth(
-      'Hello',
-      FONT_SIZES.nodeLabel,
-      FONT_WEIGHTS.nodeLabel,
-    )
-    expect(width).toBeGreaterThan(25)
-    expect(width).toBeLessThan(60)
-  })
-})
-
-// ============================================================================
-// Exported constants
-// ============================================================================
-
-describe('constants', () => {
-  it('FONT_SIZES has expected values', () => {
-    expect(FONT_SIZES.nodeLabel).toBe(13)
-    expect(FONT_SIZES.edgeLabel).toBe(11)
-    expect(FONT_SIZES.groupHeader).toBe(12)
-  })
-
-  it('FONT_WEIGHTS has expected values', () => {
-    expect(FONT_WEIGHTS.nodeLabel).toBe(500)
-    expect(FONT_WEIGHTS.edgeLabel).toBe(400)
-    expect(FONT_WEIGHTS.groupHeader).toBe(600)
-  })
-
-  it('NODE_PADDING has expected values', () => {
-    expect(NODE_PADDING.horizontal).toBe(20)
-    expect(NODE_PADDING.vertical).toBe(10)
-    expect(NODE_PADDING.diamondExtra).toBe(24)
-  })
-
-  it('STROKE_WIDTHS has expected values', () => {
-    expect(STROKE_WIDTHS.outerBox).toBe(1)
-    expect(STROKE_WIDTHS.innerBox).toBe(0.75)
-    expect(STROKE_WIDTHS.connector).toBe(1)
-  })
-
-  it('ARROW_HEAD has expected values', () => {
-    expect(ARROW_HEAD.width).toBe(8)
-    expect(ARROW_HEAD.height).toBe(5)
-  })
-})