zombie-mermaid 2.2.1 → 2.2.2

package/src/__tests__/render-options-overrides.test.ts

@@ -13,8 +13,9 @@
  */
 import { describe, it, expect } from 'vitest'
 import { renderMermaidSVG } from '../index.ts'
-import { layoutSequenceDiagram } from '../sequence/layout.ts'
-import { parseSequenceDiagram } from '../sequence/parser.ts'
+import { layoutSequenceDiagram } from '@zombie-mermaid/svg-renderer'
+import { parseSequenceDiagram } from '@zombie-mermaid/mermaid-parser'
+import { splitStatements } from '@zombie-mermaid/core'
 
 describe('RenderOptions.fontSizes – flowchart', () => {
   it('overriding nodeLabel changes the emitted node font-size', () => {
@@ -87,7 +88,9 @@ describe('RenderOptions.fontSizes – sequence diagram', () => {
 
 describe('RenderOptions.sequence – layout overrides', () => {
   it('overriding actorHeight changes actor box height and overall diagram height', () => {
-    const lines = ['sequenceDiagram', 'Alice->>Bob: Hi'].map((l) => l.trim())
+    const lines = splitStatements(
+      ['sequenceDiagram', 'Alice->>Bob: Hi'].join('\n'),
+    )
     const diagram = parseSequenceDiagram(lines)
 
     const withDefault = layoutSequenceDiagram(diagram)
@@ -115,11 +118,9 @@ describe('RenderOptions.sequence – layout overrides', () => {
   })
 
   it('overriding messageRowHeight increases vertical spacing between messages', () => {
-    const lines = [
-      'sequenceDiagram',
-      'Alice->>Bob: One',
-      'Bob->>Alice: Two',
-    ].map((l) => l.trim())
+    const lines = splitStatements(
+      ['sequenceDiagram', 'Alice->>Bob: One', 'Bob->>Alice: Two'].join('\n'),
+    )
     const diagram = parseSequenceDiagram(lines)
 
     const withDefault = layoutSequenceDiagram(diagram)
@@ -135,7 +136,9 @@ describe('RenderOptions.sequence – layout overrides', () => {
   })
 
   it('overriding headerGap increases the gap between actors and the first message', () => {
-    const lines = ['sequenceDiagram', 'Alice->>Bob: Hi'].map((l) => l.trim())
+    const lines = splitStatements(
+      ['sequenceDiagram', 'Alice->>Bob: Hi'].join('\n'),
+    )
     const diagram = parseSequenceDiagram(lines)
 
     const withDefault = layoutSequenceDiagram(diagram)
@@ -149,12 +152,14 @@ describe('RenderOptions.sequence – layout overrides', () => {
   })
 
   it('overriding noteStackGap changes spacing between consecutively stacked notes', () => {
-    const lines = [
-      'sequenceDiagram',
-      'Alice->>Bob: Hi',
-      'Note right of Bob: First note',
-      'Note right of Bob: Second note',
-    ].map((l) => l.trim())
+    const lines = splitStatements(
+      [
+        'sequenceDiagram',
+        'Alice->>Bob: Hi',
+        'Note right of Bob: First note',
+        'Note right of Bob: Second note',
+      ].join('\n'),
+    )
     const diagram = parseSequenceDiagram(lines)
 
     const withDefault = layoutSequenceDiagram(diagram)
@@ -172,11 +177,11 @@ describe('RenderOptions.sequence – layout overrides', () => {
   })
 
   it('overriding noteOffsetAfterMessage changes the gap between a message and the note after it', () => {
-    const lines = [
-      'sequenceDiagram',
-      'Alice->>Bob: Hi',
-      'Note right of Bob: A note',
-    ].map((l) => l.trim())
+    const lines = splitStatements(
+      ['sequenceDiagram', 'Alice->>Bob: Hi', 'Note right of Bob: A note'].join(
+        '\n',
+      ),
+    )
     const diagram = parseSequenceDiagram(lines)
 
     const withDefault = layoutSequenceDiagram(diagram)
@@ -192,7 +197,9 @@ describe('RenderOptions.sequence – layout overrides', () => {
   })
 
   it('partial sequence overrides only change the specified field', () => {
-    const lines = ['sequenceDiagram', 'Alice->>Bob: Hi'].map((l) => l.trim())
+    const lines = splitStatements(
+      ['sequenceDiagram', 'Alice->>Bob: Hi'].join('\n'),
+    )
     const diagram = parseSequenceDiagram(lines)
 
     const withDefault = layoutSequenceDiagram(diagram)

package/src/__tests__/render-options-per-type.test.ts

@@ -25,16 +25,20 @@
  */
 import { describe, it, expect } from 'vitest'
 import { renderMermaidSVG } from '../index.ts'
-import { layoutGraphSync } from '@zombie-mermaid/svg-renderer'
-import { layoutSequenceDiagram } from '../sequence/layout.ts'
-import { layoutClassDiagramSync } from '../class/layout.ts'
-import { layoutErDiagramSync } from '../er/layout.ts'
-import { layoutXYChart } from '../xychart/layout.ts'
+import {
+  layoutGraphSync,
+  layoutSequenceDiagram,
+  layoutClassDiagramSync,
+  layoutErDiagramSync,
+  layoutXYChart,
+} from '@zombie-mermaid/svg-renderer'
 import { parseMermaid } from '../parser.ts'
-import { parseSequenceDiagram } from '../sequence/parser.ts'
-import { parseClassDiagram } from '../class/parser.ts'
-import { parseErDiagram } from '../er/parser.ts'
-import { parseXYChart } from '../xychart/parser.ts'
+import {
+  parseSequenceDiagram,
+  parseClassDiagram,
+  parseErDiagram,
+  parseXYChart,
+} from '@zombie-mermaid/mermaid-parser'
 import { splitStatements } from '@zombie-mermaid/core'
 import type {
   FlowchartRenderOptions,

package/src/__tests__/resolve-colors.test.ts

@@ -5,7 +5,7 @@ import {
   evaluateCssColorValue,
   resolveCssColors,
 } from '@zombie-mermaid/svg-renderer'
-import { diagramColorsToAsciiTheme } from '../ascii/ansi.ts'
+import { diagramColorsToAsciiTheme } from '../../packages/ascii-renderer/src/ansi.ts'
 
 /**
  * Escape regex metacharacters so a value can be interpolated into a

package/src/__tests__/self-loop-edges.test.ts

@@ -0,0 +1,112 @@
+/**
+ * Self-loop edge rendering (issue #537 follow-up).
+ *
+ * packages/svg-renderer/src/layout-engine/ (ELK-based flowchart/state
+ * layout) previously had no self-loop-specific routing at all: ELK has no
+ * native concept of a self-loop, so a `B --> B` edge came back as a
+ * degenerate 4-point right-angle polyline sitting on top of the node
+ * instead of a loop beside it — see docs/research/537-self-loop-regression-check.md
+ * for the before/after comparison against current upstream Mermaid.
+ *
+ * These tests assert the synthesized replacement: a rounded loop bulging
+ * out from the node's right side, discretized into enough points to read
+ * as smooth, with the label offset clear of the node.
+ */
+import { describe, it, expect } from 'vitest'
+import { parseMermaid } from '../parser.ts'
+import { layoutGraphSync } from '@zombie-mermaid/svg-renderer'
+
+interface Point {
+  x: number
+  y: number
+}
+
+/** True when the segment p1->p2 runs purely horizontal or vertical. */
+function isAxisAligned(p1: Point, p2: Point, tolerance = 0.5): boolean {
+  return Math.abs(p2.x - p1.x) < tolerance || Math.abs(p2.y - p1.y) < tolerance
+}
+
+describe('self-loop edge routing (flowchart)', () => {
+  it('routes a self-loop as a rounded loop beside the node, not a 4-point right-angle bracket', () => {
+    const graph = parseMermaid(`flowchart LR
+      A --->|foo| B
+      B --->|bar| B`)
+
+    const positioned = layoutGraphSync(graph)
+    const nodeB = positioned.nodes.find((n) => n.id === 'B')
+    const selfLoop = positioned.edges.find(
+      (e) => e.source === 'B' && e.target === 'B',
+    )
+
+    expect(nodeB).toBeDefined()
+    expect(selfLoop).toBeDefined()
+    const points = selfLoop!.points
+
+    // The old ELK-routed bracket was exactly 4 points. A real loop needs
+    // many more to read as rounded.
+    expect(points.length).toBeGreaterThan(4)
+
+    // The bracket was pure right angles throughout. A rounded loop must
+    // have a majority of genuinely diagonal segments.
+    let diagonalSegments = 0
+    for (let i = 1; i < points.length; i++) {
+      if (!isAxisAligned(points[i - 1]!, points[i]!)) diagonalSegments++
+    }
+    expect(diagonalSegments).toBeGreaterThan(points.length / 2)
+
+    // The loop bulges out to the side of the node — every point sits at or
+    // beyond the node's right edge — rather than sitting on top of it (the
+    // old bracket's points landed inside/just above the node's bounding box).
+    for (const p of points) {
+      expect(p.x).toBeGreaterThanOrEqual(nodeB!.x + nodeB!.width - 0.5)
+    }
+
+    // Both ends of the loop attach to the node's right edge.
+    expect(points[0]!.x).toBeCloseTo(nodeB!.x + nodeB!.width, 0)
+    expect(points[points.length - 1]!.x).toBeCloseTo(nodeB!.x + nodeB!.width, 0)
+
+    // The label sits clear of the node, out past the loop's apex — not on
+    // top of the node the way the old bracket's cramped shape forced it to.
+    expect(selfLoop!.labelPosition).toBeDefined()
+    expect(selfLoop!.labelPosition!.x).toBeGreaterThan(nodeB!.x + nodeB!.width)
+  })
+
+  it('stacks multiple self-loops on the same node instead of overlapping', () => {
+    const graph = parseMermaid(`flowchart LR
+      B -->|one| B
+      B -->|two| B`)
+
+    const positioned = layoutGraphSync(graph)
+    const selfLoops = positioned.edges.filter(
+      (e) => e.source === 'B' && e.target === 'B',
+    )
+
+    expect(selfLoops).toHaveLength(2)
+    const [first, second] = selfLoops as [
+      (typeof selfLoops)[0],
+      (typeof selfLoops)[0],
+    ]
+
+    // The second loop reaches further right than the first, so they nest
+    // rather than draw identically on top of each other.
+    const apexX = (points: Point[]) => Math.max(...points.map((p) => p.x))
+    expect(apexX(second.points)).toBeGreaterThan(apexX(first.points))
+  })
+})
+
+describe('self-loop edge routing (state diagram)', () => {
+  it('routes a state-diagram self-transition as a rounded loop', () => {
+    const graph = parseMermaid(`stateDiagram-v2
+      [*] --> Idle
+      Idle --> Idle: retry`)
+
+    const positioned = layoutGraphSync(graph)
+    const selfLoop = positioned.edges.find(
+      (e) => e.source === 'Idle' && e.target === 'Idle',
+    )
+
+    expect(selfLoop).toBeDefined()
+    expect(selfLoop!.points.length).toBeGreaterThan(4)
+    expect(selfLoop!.label).toBe('retry')
+  })
+})

package/src/__tests__/sequence-activation-check.test.ts

@@ -1,6 +1,6 @@
 /**
  * Tests for the sequence diagram activation/deactivation balance check
- * (src/sequence/activation-check.ts).
+ * (packages/mermaid-parser/src/sequence/activation-check.ts).
  *
  * Covers: balanced diagrams (both the standalone activate/deactivate form
  * and the +/- arrow shorthand, including nesting), a dangling activation
@@ -8,16 +8,15 @@
  * that mix both issue types or both syntactic forms together.
  */
 import { describe, it, expect } from 'vitest'
-import { parseSequenceDiagram } from '../sequence/parser.ts'
-import { checkActivationBalance } from '../sequence/activation-check.ts'
+import {
+  parseSequenceDiagram,
+  checkActivationBalance,
+} from '@zombie-mermaid/mermaid-parser'
+import { splitStatements } from '@zombie-mermaid/core'
 
 /** Helper to parse — preprocesses text the same way index.ts does. */
 function parse(text: string) {
-  const lines = text
-    .split('\n')
-    .map((l) => l.trim())
-    .filter((l) => l.length > 0 && !l.startsWith('%%'))
-  return parseSequenceDiagram(lines)
+  return parseSequenceDiagram(splitStatements(text))
 }
 
 describe('checkActivationBalance — balanced diagrams', () => {

package/src/__tests__/sequence-activation-fix.test.ts

@@ -0,0 +1,91 @@
+/**
+ * Tests for the sequence diagram activation/deactivation auto-fix
+ * (packages/mermaid-parser/src/sequence/activation-fix.ts). Operates on raw
+ * Mermaid source text (unlike checkActivationBalance, which takes an
+ * already-parsed diagram), since the fix needs to append to the original
+ * source rather than just report against the parsed model.
+ *
+ * Covers: an already-balanced diagram (no-op), a single dangling
+ * activation (auto-fixed), multiple dangling activations across actors, an
+ * unmatched deactivation (deliberately NOT auto-fixed — see module header),
+ * and a mix of both issue types together.
+ */
+import { describe, it, expect } from 'vitest'
+import { fixActivationBalance } from '@zombie-mermaid/mermaid-parser'
+
+describe('fixActivationBalance', () => {
+  it('returns the diagram unchanged when already balanced', () => {
+    const source = 'sequenceDiagram\n  A->>+B: hello\n  B-->>-A: world'
+    const result = fixActivationBalance(source)
+    expect(result.ok).toBe(true)
+    expect(result.fixedDiagram).toBe(source)
+    expect(result.fixesApplied).toEqual([])
+    expect(result.remainingIssues).toEqual([])
+  })
+
+  it('appends a deactivate statement for a single dangling activation', () => {
+    const source = 'sequenceDiagram\n  activate A\n  A->>B: hello'
+    const result = fixActivationBalance(source)
+    expect(result.ok).toBe(true)
+    expect(result.originalDiagram).toBe(source)
+    expect(result.fixedDiagram).toBe(`${source}\n  deactivate A`)
+    expect(result.fixesApplied).toEqual([
+      expect.stringContaining('Appended "deactivate A"'),
+    ])
+    expect(result.remainingIssues).toEqual([])
+  })
+
+  it('makes the fixed diagram re-check as balanced', () => {
+    const source = 'sequenceDiagram\n  activate A\n  A->>B: hello'
+    const { fixedDiagram } = fixActivationBalance(source)
+    const reChecked = fixActivationBalance(fixedDiagram)
+    expect(reChecked.ok).toBe(true)
+    expect(reChecked.fixesApplied).toEqual([])
+  })
+
+  it('closes multiple dangling activations for different actors', () => {
+    const source = 'sequenceDiagram\n  activate A\n  activate B\n  A->>B: hello'
+    const result = fixActivationBalance(source)
+    expect(result.ok).toBe(true)
+    expect(result.fixesApplied).toHaveLength(2)
+    expect(result.fixedDiagram).toContain('  deactivate A')
+    expect(result.fixedDiagram).toContain('  deactivate B')
+  })
+
+  it('does not fix an unmatched deactivation and reports it back', () => {
+    const source = 'sequenceDiagram\n  A->>B: hello\n  deactivate A'
+    const result = fixActivationBalance(source)
+    expect(result.ok).toBe(false)
+    expect(result.fixedDiagram).toBe(source)
+    expect(result.fixesApplied).toEqual([])
+    expect(result.remainingIssues).toEqual([
+      expect.objectContaining({
+        code: 'UNMATCHED_DEACTIVATION',
+        actorId: 'A',
+      }),
+    ])
+  })
+
+  it('fixes the dangling half of a mixed-issue diagram, leaving the unmatched half reported', () => {
+    const source =
+      'sequenceDiagram\n  activate A\n  A->>B: hello\n  deactivate B'
+    const result = fixActivationBalance(source)
+    expect(result.ok).toBe(false)
+    expect(result.fixesApplied).toEqual([
+      expect.stringContaining('Appended "deactivate A"'),
+    ])
+    expect(result.fixedDiagram).toContain('  deactivate A')
+    expect(result.remainingIssues).toEqual([
+      expect.objectContaining({
+        code: 'UNMATCHED_DEACTIVATION',
+        actorId: 'B',
+      }),
+    ])
+  })
+
+  it('throws a clear error for a non-sequence diagram', () => {
+    expect(() => fixActivationBalance('graph LR\n  A --> B')).toThrow(
+      /only supports sequence diagrams/,
+    )
+  })
+})

package/src/__tests__/sequence-layout.test.ts

@@ -6,16 +6,13 @@
  * to inspect Y coordinates, rather than checking SVG output.
  */
 import { describe, it, expect } from 'vitest'
-import { parseSequenceDiagram } from '../sequence/parser.ts'
-import { layoutSequenceDiagram } from '../sequence/layout.ts'
+import { parseSequenceDiagram } from '@zombie-mermaid/mermaid-parser'
+import { layoutSequenceDiagram } from '@zombie-mermaid/svg-renderer'
+import { splitStatements } from '@zombie-mermaid/core'
 
 /** Helper: parse and layout a sequence diagram from source lines */
 function layout(source: string) {
-  const lines = source
-    .split('\n')
-    .map((l) => l.trim())
-    .filter((l) => l.length > 0 && !l.startsWith('%%'))
-  return layoutSequenceDiagram(parseSequenceDiagram(lines))
+  return layoutSequenceDiagram(parseSequenceDiagram(splitStatements(source)))
 }
 
 describe('sequence layout – block spacing', () => {

package/src/__tests__/sequence-parser-syntax-errors.test.ts

@@ -0,0 +1,179 @@
+/**
+ * Syntactic error-detection tests for the sequence diagram parser
+ * (issue #762).
+ *
+ * The 8 pre-existing `throw` sites in `parseSequenceDiagram` all guard
+ * *semantic* rules mirrored from mermaid.js (duplicate actor ids, box
+ * nesting, create/destroy message mismatch — see
+ * sequence-parser.test.ts/sequence-activation-check.test.ts for those). No
+ * *syntactic* error was ever raised: a malformed arrow like `->>>` silently
+ * absorbed the extra character into the actor name instead of being
+ * rejected (verified: `Alice->>>Bob: Hello` created an actor literally
+ * named `">Bob"`), an unmatched `end` was silently ignored, and an
+ * `alt`/`loop`/`box` left open at EOF was silently accepted as if closed.
+ * These tests assert the parser now throws an actionable error instead,
+ * while confirming valid syntax — including short arrows, activation
+ * shorthand, and actor names that legitimately start with "x" — is
+ * unaffected.
+ */
+import { describe, it, expect } from 'vitest'
+import { parseSequenceDiagram } from '@zombie-mermaid/mermaid-parser'
+import { splitStatements } from '@zombie-mermaid/core'
+
+function parse(text: string) {
+  return parseSequenceDiagram(splitStatements(text))
+}
+
+describe('parseSequenceDiagram – malformed arrows', () => {
+  it('throws on an extra ">" past the longest known long-arrow token', () => {
+    // The issue's own verified repro: silently created an actor named
+    // `">Bob"` before this pass.
+    expect(() =>
+      parse(`sequenceDiagram
+        Alice->>>Bob: Hello`),
+    ).toThrow(/Malformed sequence-diagram arrow.*"->>>"/)
+  })
+
+  it('throws on an extra ")" past a short open-arrow token', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        Alice-))Bob: Hello`),
+    ).toThrow(/Malformed sequence-diagram arrow.*"-\)\)"/)
+  })
+
+  it('throws on an extra ")" past a short dashed-open-arrow token', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        Alice--))Bob: Hello`),
+    ).toThrow(/Malformed sequence-diagram arrow/)
+  })
+
+  it('mentions the known-good arrow set in the message', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        Alice->>>Bob: Hello`),
+    ).toThrow(/->, -->, ->>, -->>, -x, --x, -\), --\)/)
+  })
+
+  it('reports the 1-based line number', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        participant Alice
+        Alice->>>Bob: Hello`),
+    ).toThrow(/^Line 3:/)
+  })
+})
+
+describe('parseSequenceDiagram – unmatched "end"', () => {
+  it('throws on an "end" with no open block or box', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        Alice->>Bob: Hi
+        end`),
+    ).toThrow(/"end" does not match any open block/)
+  })
+})
+
+describe('parseSequenceDiagram – unclosed blocks/boxes at EOF', () => {
+  it('throws when a loop is never closed', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        loop Every 5s
+        Alice->>Bob: Hi`),
+    ).toThrow(/unclosed "loop" block/)
+  })
+
+  it('throws when an alt is never closed', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        alt Happy path
+        Alice->>Bob: Hi`),
+    ).toThrow(/unclosed "alt" block/)
+  })
+
+  it('throws when a box is never closed', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        box Group1
+        participant Alice
+        Alice->>Alice: Hi`),
+    ).toThrow(/unclosed "box Group1"/)
+  })
+
+  it('reports the line the block opened on', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        Alice->>Bob: Hi
+        loop Every 5s
+        Bob->>Alice: Pong`),
+    ).toThrow(/^Line 3:/)
+  })
+})
+
+describe('parseSequenceDiagram – valid syntax is unaffected', () => {
+  it('still parses correct long arrows without throwing', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        Alice->>Bob: Hi
+        Bob-->>Alice: Hi back`),
+    ).not.toThrow()
+  })
+
+  it('still parses activation shorthand (+/-) without throwing', () => {
+    const d = parse(`sequenceDiagram
+      Alice->>+Bob: Hi
+      Bob-->>-Alice: Hi back`)
+    expect(d.messages[0]!.activate).toBe(true)
+    expect(d.messages[1]!.deactivate).toBe(true)
+  })
+
+  it('still parses short open/cross arrows without throwing', () => {
+    const d = parse(`sequenceDiagram
+      Alice-)Bob: fire and forget
+      Bob--xAlice: lost message`)
+    expect(d.messages).toHaveLength(2)
+  })
+
+  it('still parses bidirectional arrows without throwing', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        Alice<<->>Bob: sync
+        Alice<<-->>Bob: async sync`),
+    ).not.toThrow()
+  })
+
+  it('does not throw for an actor name that legitimately starts with "x" after a -x arrow', () => {
+    const d = parse(`sequenceDiagram
+      Alice-xXavier: lost`)
+    expect(d.actors.map((a) => a.id)).toContain('Xavier')
+  })
+
+  it('still parses a properly closed loop/alt/box without throwing', () => {
+    expect(() =>
+      parse(`sequenceDiagram
+        box Group1
+        participant Alice
+        participant Bob
+        end
+        loop Every 5s
+          alt Happy path
+            Alice->>Bob: Hi
+          else Sad path
+            Alice-xBob: nope
+          end
+        end`),
+    ).not.toThrow()
+  })
+
+  it('still closes an "end" that matches a block nested inside a box', () => {
+    const d = parse(`sequenceDiagram
+      box Group1
+      participant Alice
+      loop Every 5s
+        Alice->>Alice: ping
+      end
+      end`)
+    expect(d.blocks).toHaveLength(1)
+    expect(d.boxes).toHaveLength(1)
+  })
+})

package/src/__tests__/sequence-parser.test.ts

@@ -9,15 +9,12 @@ import {
   parseSequenceDiagram,
   isBlockType,
   toBlockType,
-} from '../sequence/parser.ts'
+} from '@zombie-mermaid/mermaid-parser'
+import { splitStatements } from '@zombie-mermaid/core'
 
 /** Helper to parse — preprocesses text the same way index.ts does */
 function parse(text: string) {
-  const lines = text
-    .split('\n')
-    .map((l) => l.trim())
-    .filter((l) => l.length > 0 && !l.startsWith('%%'))
-  return parseSequenceDiagram(lines)
+  return parseSequenceDiagram(splitStatements(text))
 }
 
 // ============================================================================