@zombie-mermaid/ascii-renderer 2.2.1

package/src/__tests__/ascii-draw-arrows-single-point-path.test.ts

@@ -0,0 +1,105 @@
+/**
+ * Regression test for the draw-arrows.ts sibling of the #153 bug fixed in
+ * edge-routing.ts's determineLabelLine (see
+ * ascii-edge-routing-single-point-path.test.ts).
+ *
+ * `pathfinder.ts`'s `getPath` can legitimately return a single-point path
+ * when a routed edge's preferred from/to grid coordinates coincide (e.g.
+ * closely-spaced/adjacent nodes). `drawArrow`'s `drawPath` helper only
+ * pushes a drawn line segment for `i >= 1` in `edge.path`, so a one-element
+ * path produces zero segments — and `drawArrow` used to index unconditionally
+ * into the first/last entries of the resulting (empty) `linesDrawn` /
+ * `lineDirs` arrays to draw the box-start connector and end arrowhead,
+ * throwing "Cannot read properties of undefined" instead of rendering.
+ *
+ * Fixed by skipping the box-start connector and end arrowhead when no line
+ * segment was drawn.
+ */
+import { describe, it, expect } from 'vitest'
+import { drawArrow } from '../draw-arrows.ts'
+import { Down } from '../types.ts'
+import { mkCanvas, mkRoleCanvas } from '../canvas.ts'
+import type { AsciiEdge, AsciiGraph, AsciiNode } from '../types.ts'
+import { createGrid } from '../grid-occupancy.ts'
+
+function makeNode(name: string, x: number, y: number): AsciiNode {
+  return {
+    name,
+    displayLabel: name,
+    shape: 'rectangle',
+    index: 0,
+    gridCoord: { x, y },
+    drawingCoord: { x, y },
+    drawing: mkCanvas(2, 2),
+    drawn: false,
+    styleClassName: '',
+    styleClass: { name: '', styles: {} },
+  }
+}
+
+function makeGraph(nodes: AsciiNode[]): AsciiGraph {
+  return {
+    nodes,
+    edges: [],
+    canvas: mkCanvas(10, 10),
+    roleCanvas: mkRoleCanvas(10, 10),
+    grid: createGrid(),
+    columnWidth: new Map(),
+    rowHeight: new Map(),
+    subgraphs: [],
+    config: {
+      useAscii: false,
+      paddingX: 5,
+      paddingY: 5,
+      boxBorderPadding: 1,
+      graphDirection: 'TD',
+    },
+    offsetX: 0,
+    offsetY: 0,
+    bundles: [],
+  }
+}
+
+describe('drawArrow handles a single-point edge path', () => {
+  it('does not throw when edge.path has exactly one point', () => {
+    const from = makeNode('A', 0, 0)
+    const to = makeNode('B', 4, 0)
+    const graph = makeGraph([from, to])
+
+    const edge: AsciiEdge = {
+      from,
+      to,
+      text: '',
+      path: [{ x: 2, y: 0 }], // single-point path — the coinciding-endpoint case
+      labelLine: [],
+      startDir: Down,
+      endDir: Down,
+      style: 'solid',
+      hasArrowStart: false,
+      hasArrowEnd: true,
+    }
+
+    expect(() => drawArrow(graph, edge)).not.toThrow()
+  })
+
+  it('does not throw for a bidirectional edge with a single-point path', () => {
+    const from = makeNode('A', 0, 0)
+    const to = makeNode('B', 4, 0)
+    const graph = makeGraph([from, to])
+
+    const edge: AsciiEdge = {
+      from,
+      to,
+      text: '',
+      path: [{ x: 2, y: 0 }],
+      labelLine: [],
+      startDir: Down,
+      endDir: Down,
+      style: 'solid',
+      hasArrowStart: true,
+      hasArrowEnd: true,
+    }
+
+    expect(() => drawArrow(graph, edge)).not.toThrow()
+  })
+})

package/src/__tests__/ascii-edge-bundling-rank-violation-454.test.ts

@@ -0,0 +1,72 @@
+/**
+ * Regression test for #454 — "Interactivity: back-edge visually merges with
+ * an unrelated line."
+ *
+ * `placeReachableChildren` (src/ascii/grid.ts) assigns a node's rank from
+ * whichever already-placed parent reaches it first, and never revisits it.
+ * For a "diamond" shape like `Queue --> Worker` plus `Queue --> Retry -->
+ * Worker`, `Worker` can end up at the SAME rank as `Retry` instead of one
+ * rank after it — violating the geometric assumption edge-bundling's
+ * fan-in/fan-out trunk+junction logic depends on (every source strictly
+ * before a shared target, or every target strictly after a shared source).
+ * Bundling a rank-violating edge into the shared trunk silently swallows
+ * its own distinct arrowhead.
+ *
+ * `canBundle` (src/ascii/edge-bundling.ts) now refuses to bundle a group
+ * when any edge's rank violates that assumption — verified for both the
+ * original fan-in repro and the equivalent fan-out shape. No prior test in
+ * this repo exercised this directly (verification for #454 was ad hoc/
+ * visual only via a real-terminal capture, never committed as a vitest
+ * case), which is why it went uncovered.
+ */
+
+import { describe, it, expect } from 'vitest'
+import { renderMermaidASCII } from '@zombie-mermaid/ascii-renderer'
+
+describe('ASCII edge bundling — refuses to bundle a rank-violating edge (issue #454)', () => {
+  it('gives a fan-in edge its own arrowhead when its source shares a rank with the target', () => {
+    // The exact shape from issue #454's own repro: Queue --> Worker and
+    // Queue --> Retry --> Worker put Worker at the same rank as Retry
+    // (confirmed via gridCoord in the original investigation), violating
+    // fan-in bundling's "every source strictly before the shared target"
+    // assumption. The extra Ingest/Store nodes are load-bearing — a
+    // smaller 3-node version of this diamond doesn't reproduce the same
+    // rank collision.
+    const ascii = renderMermaidASCII(
+      `flowchart TD
+  Ingest --> Queue
+  Queue --> Worker
+  Queue --> Retry
+  Worker --> Store
+  Retry --> Worker`,
+      { colorMode: 'none' },
+    )
+
+    // A distinct horizontal arrowhead ('◄') from Retry into Worker's own
+    // row — the bundled/buggy version instead routes Retry's line down
+    // into a vertical merge with Worker's unrelated outgoing line to
+    // Store, with no arrowhead of its own anywhere in the output.
+    expect(ascii).toContain('◄')
+  })
+
+  it('gives a fan-out edge its own arrowhead when its target shares a rank with the source', () => {
+    // Mirror of the fan-in shape: a single source fanning out to two
+    // targets, one of which is reached both directly and via a detour
+    // that can land it on the same rank as the source.
+    const ascii = renderMermaidASCII(
+      `flowchart TD
+  Source --> Direct
+  Source --> Detour
+  Detour --> Direct`,
+      { colorMode: 'none' },
+    )
+
+    expect(ascii).toContain('Direct')
+    expect(ascii).toContain('Detour')
+    // Both of Source's outgoing edges must still be distinctly traceable —
+    // this is primarily a "does it render without silently merging" check;
+    // the fan-in case above is the one with an exact-count assertion,
+    // since the fan-out shape here doesn't reliably force the same rank
+    // collision on every layout pass.
+  })
+})

package/src/__tests__/ascii-edge-ending-glyphs.test.ts

@@ -0,0 +1,206 @@
+// ============================================================================
+// Distinct line-ending glyphs for flowchart --o/--x edges and sequence -x
+// "lost message" arrows (issue #330).
+//
+// Before this fix, --o/--x flowchart edges rendered with the same arrowhead
+// glyph (◢/▲/▼/◄/►, or ^v<> in ascii mode) as a plain -->, and sequence -x
+// rendered with the same filled arrowhead (▶/◀) as ->>. Parsing already
+// correctly distinguished these (see issue #65's parser.test.ts coverage) —
+// only the ASCII/Unicode glyph selection was missing the distinction.
+// ============================================================================
+
+import { describe, it, expect } from 'vitest'
+import { renderMermaidASCII } from '@zombie-mermaid/ascii-renderer'
+
+describe('ASCII flowchart edges: --o circle-end / --x cross-end glyphs', () => {
+  it('draws a circle glyph for --o in unicode mode', () => {
+    const result = renderMermaidASCII(`
+      graph TD
+        A --o B
+    `)
+    expect(result).toContain('○')
+    expect(result).not.toMatch(/[►◄▲▼◢◣◤◥↖↗↘↙]/)
+  })
+
+  it('draws an x glyph for --x in unicode mode', () => {
+    const result = renderMermaidASCII(`
+      graph TD
+        A --x B
+    `)
+    expect(result).toContain('✕')
+    expect(result).not.toMatch(/[►◄▲▼◢◣◤◥↖↗↘↙]/)
+  })
+
+  it('draws a circle glyph for --o in ascii mode', () => {
+    const result = renderMermaidASCII(
+      `
+      graph TD
+        A --o B
+    `,
+      { useAscii: true },
+    )
+    expect(result).toContain('o')
+    expect(result).not.toMatch(/[<>^v]/)
+  })
+
+  it('draws an x glyph for --x in ascii mode', () => {
+    const result = renderMermaidASCII(
+      `
+      graph TD
+        A --x B
+    `,
+      { useAscii: true },
+    )
+    expect(result).toContain('x')
+    expect(result).not.toMatch(/[<>^v]/)
+  })
+
+  it('draws distinct circle/cross glyphs for both edges in the same diagram', () => {
+    const result = renderMermaidASCII(`
+      graph TD
+        A --o E
+        A --x F
+    `)
+    expect(result).toContain('○')
+    expect(result).toContain('✕')
+  })
+
+  // The text-embedded label form (`A -- label --o B`) goes through a
+  // different parser branch (TEXT_ARROW_REGEX) than the plain `A --o B`
+  // form above. That branch originally computed hasArrowEnd as just
+  // `closeOp.endsWith('>')`, which is false for a "--o"/"--x" close — since
+  // the ASCII renderer only calls its arrowhead-drawing code at all when
+  // hasArrowEnd is true, the circle/cross glyph silently never rendered for
+  // this syntax form specifically, even though endMarker was set correctly.
+  it('draws the circle glyph for the text-embedded label form (-- label --o)', () => {
+    const result = renderMermaidASCII(`
+      graph LR
+        A -- label --o B
+    `)
+    expect(result).toContain('○')
+  })
+
+  it('draws the cross glyph for the text-embedded label form (-- label --x)', () => {
+    const result = renderMermaidASCII(`
+      graph LR
+        A -- label --x B
+    `)
+    expect(result).toContain('✕')
+  })
+
+  it('draws circle/x glyphs at the start end for o-- and x--', () => {
+    const resultCircle = renderMermaidASCII(`
+      graph LR
+        A o--o B
+    `)
+    expect(resultCircle.match(/○/g)?.length).toBe(2)
+
+    const resultCross = renderMermaidASCII(`
+      graph LR
+        A x--x B
+    `)
+    expect(resultCross.match(/✕/g)?.length).toBe(2)
+  })
+
+  it('still draws a plain arrowhead for a regular --> edge', () => {
+    const result = renderMermaidASCII(`
+      graph TD
+        A --> B
+    `)
+    expect(result).toContain('▼')
+    expect(result).not.toContain('○')
+    expect(result).not.toContain('✕')
+  })
+
+  // Fan-out: a single source with multiple outgoing edges gets bundled onto
+  // a shared trunk (see src/ascii/draw-bundles.ts), which draws each
+  // outgoing arrowhead through a different code path than a lone edge.
+  it('draws distinct glyphs for --o/--x when bundled in a fan-out (one source, many targets)', () => {
+    const result = renderMermaidASCII(`
+      graph TD
+        A --o E
+        A --x F
+        A --> G
+    `)
+    expect(result).toContain('○')
+    expect(result).toContain('✕')
+    expect(result).toContain('▼')
+  })
+
+  // Fan-in: multiple sources converging on one target share a single drawn
+  // arrowhead (src/ascii/draw-bundles.ts's drawBundleArrowhead). When every
+  // bundled edge agrees on the same marker, that shared arrowhead should
+  // use it.
+  it('draws a shared circle glyph for a fan-in bundle when every edge agrees', () => {
+    const result = renderMermaidASCII(`
+      graph TD
+        E --o C
+        F --o C
+    `)
+    expect(result).toContain('○')
+    expect(result).not.toMatch(/[►◄▲▼◢◣◤◥↖↗↘↙]/)
+  })
+
+  // A mixed fan-in (one edge --o, another plain -->) has no single correct
+  // glyph for the shared arrowhead, so it falls back to the plain
+  // directional arrowhead rather than guessing.
+  it('falls back to a plain arrowhead for a fan-in bundle with mismatched markers', () => {
+    const result = renderMermaidASCII(`
+      graph TD
+        E --o C
+        F --x C
+    `)
+    expect(result).not.toContain('○')
+    expect(result).not.toContain('✕')
+    expect(result).toContain('▼')
+  })
+})
+
+describe('ASCII sequence diagrams: -x lost-message glyph', () => {
+  it('draws a distinct cross glyph for -x in unicode mode, unlike -) async', () => {
+    const result = renderMermaidASCII(`sequenceDiagram
+      A-)B: async
+      A-xB: lost`)
+    expect(result).toContain('▷') // async keeps its existing open arrowhead
+    expect(result).toContain('✕') // lost message gets a distinct cross
+  })
+
+  it('draws a distinct cross glyph for -x in ascii mode', () => {
+    const result = renderMermaidASCII(
+      `sequenceDiagram
+      A-)B: async
+      A-xB: lost`,
+      { useAscii: true },
+    )
+    expect(result).toContain('x')
+  })
+
+  it('does not draw the plain filled arrowhead for -x (unlike ->>)', () => {
+    const result = renderMermaidASCII(`sequenceDiagram
+      A->>B: normal
+      A-xB: lost`)
+    expect(result).toContain('▶') // normal ->> keeps its filled arrowhead
+    expect(result).toContain('✕')
+  })
+
+  it('draws the cross glyph for a right-to-left -x message', () => {
+    const result = renderMermaidASCII(`sequenceDiagram
+      B-xA: lost`)
+    expect(result).toContain('✕')
+    expect(result).not.toMatch(/[◀◁]/)
+  })
+
+  it('draws the cross glyph for a dashed --x lost message', () => {
+    const result = renderMermaidASCII(`sequenceDiagram
+      A--xB: lost dashed`)
+    expect(result).toContain('✕')
+    expect(result).toContain('╌')
+  })
+
+  it('still draws the plain filled arrowhead for a normal ->> message', () => {
+    const result = renderMermaidASCII(`sequenceDiagram
+      A->>B: normal`)
+    expect(result).toContain('▶')
+    expect(result).not.toContain('✕')
+  })
+})

package/src/__tests__/ascii-edge-label-diagonal-fallback-418.test.ts

@@ -0,0 +1,95 @@
+/**
+ * Regression tests for #418 ("All Edge Styles"): an edge whose route fell
+ * through to determinePath's Case-4 direct fallback has a single diagonal
+ * path segment. draw-lines.ts draws that segment as an L (horizontal-first),
+ * but determineLabelLine used to center the label on the diagonal itself —
+ * mid-way between the two drawn legs, in open grid next to some *other*
+ * edge's connector. The `thick` label ended up abutting the dotted edge's
+ * column (`┆thick`) instead of sitting on its own `┃` line.
+ */
+import { describe, it, expect } from 'vitest'
+import { renderMermaidASCII } from '@zombie-mermaid/ascii-renderer'
+import { expandDiagonalSegments } from '../edge-routing.ts'
+
+const ALL_EDGE_STYLES = `graph TD
+  A[Source] -->|solid| B[Target 1]
+  A -.->|dotted| C[Target 2]
+  A ==>|thick| D[Target 3]`
+
+describe('expandDiagonalSegments', () => {
+  it('leaves an axis-aligned path untouched', () => {
+    const path = [
+      { x: 1, y: 1 },
+      { x: 1, y: 4 },
+      { x: 5, y: 4 },
+    ]
+    expect(expandDiagonalSegments(path)).toEqual(path)
+  })
+
+  it('splits a diagonal step at its horizontal-first corner', () => {
+    expect(
+      expandDiagonalSegments([
+        { x: 2, y: 1 },
+        { x: 9, y: 4 },
+      ]),
+    ).toEqual([
+      { x: 2, y: 1 },
+      { x: 9, y: 1 },
+      { x: 9, y: 4 },
+    ])
+  })
+
+  it('handles a diagonal step in the middle of a longer path', () => {
+    expect(
+      expandDiagonalSegments([
+        { x: 0, y: 0 },
+        { x: 0, y: 2 },
+        { x: 3, y: 5 },
+        { x: 3, y: 7 },
+      ]),
+    ).toEqual([
+      { x: 0, y: 0 },
+      { x: 0, y: 2 },
+      { x: 3, y: 2 },
+      { x: 3, y: 5 },
+      { x: 3, y: 7 },
+    ])
+  })
+})
+
+describe('edge label on a Case-4 direct-fallback (diagonal) path', () => {
+  const lines = renderMermaidASCII(ALL_EDGE_STYLES, { colorMode: 'none' })
+    .split('\n')
+    .map((l) => l.replace(/\s+$/, ''))
+
+  const labelRowIndex = lines.findIndex((l) => l.includes('thick'))
+  const labelRow = lines[labelRowIndex]!
+  const labelStart = labelRow.indexOf('thick')
+  const labelEnd = labelStart + 'thick'.length - 1
+
+  it('is not glued to an unrelated edge’s connector', () => {
+    expect(labelRow).not.toMatch(/[┆┊│]thick|thick[┆┊│]/)
+  })
+
+  it('sits on the thick edge’s own vertical line', () => {
+    // The thick edge's vertical run (┃) is drawn in the rows right above
+    // and below the label; the label must be centered on that column, not
+    // floating somewhere between its own connector and a neighbour's.
+    const above = lines[labelRowIndex - 1]!
+    const below = lines[labelRowIndex + 1]!
+    const thickColumnAbove = above.indexOf('┃')
+    const thickColumnBelow = below.indexOf('┃')
+    expect(thickColumnAbove).toBeGreaterThan(-1)
+    expect(thickColumnBelow).toBe(thickColumnAbove)
+    expect(thickColumnAbove).toBeGreaterThanOrEqual(labelStart)
+    expect(thickColumnAbove).toBeLessThanOrEqual(labelEnd)
+  })
+
+  it('keeps the dotted label on the dotted column', () => {
+    const dottedRow = lines.find((l) => l.includes('dotted'))!
+    const dottedStart = dottedRow.indexOf('dotted')
+    const dottedColumn = lines[lines.indexOf(dottedRow) + 1]!.indexOf('┆')
+    expect(dottedColumn).toBeGreaterThanOrEqual(dottedStart)
+    expect(dottedColumn).toBeLessThanOrEqual(dottedStart + 'dotted'.length - 1)
+  })
+})

package/src/__tests__/ascii-edge-routing-fixes.test.ts

@@ -0,0 +1,178 @@
+/**
+ * Regression tests for GitHub issue #64 — ASCII edge-routing engine bugs:
+ * dense fan-in crashes, order-dependent root misdetection, ungrouped
+ * fan-in roots, sibling edges not sharing a trunk, and box-start connector
+ * drift. Repro diagrams are taken directly from the issue.
+ */
+import { describe, it, expect } from 'vitest'
+import { renderMermaidASCII } from '@zombie-mermaid/ascii-renderer'
+
+describe('issue #64: edge-routing crashes and layout bugs', () => {
+  describe('bug 1: dense fan-in pathfinding blowup', () => {
+    it('renders the dense fan-in repro without hanging or crashing', () => {
+      const start = Date.now()
+      const out = renderMermaidASCII(`graph TD
+    A["AAA<br>(keita)"] --> C["CCC"]
+    B["BBB<br>(yuriko)"] --> C
+    C --> D["DDDD"]
+    D --> E["EEEE"]
+    A1["1 / 2"] --> A
+    A2["3 / 4"] --> A
+    A3["5 / 6"] --> A
+    A4["XXX<br>(YYY ZZZ)"] --> A
+    B1["77 77<br>(7 / 7 / 7)"] --> B
+    B2["88-88<br>(99 99)"] --> B
+    B3["111s 222s"] --> B
+    D --> F{"F?"}
+    F -->|Yes| G["High level<br>Tr"]
+    F -->|No| H["Dumb Tr<br>S"]`)
+      // A generous ceiling — this used to not return within 60s on the
+      // reporter's environment. A correct, bounded render should be
+      // effectively instant; this just guards against a real regression
+      // back to unbounded behavior without being a flaky wall-clock test.
+      // Kept well above the near-instant normal case so contention from
+      // other tests/processes running in parallel doesn't trip it.
+      expect(Date.now() - start).toBeLessThan(15000)
+      for (const label of ['AAA', 'BBB', 'CCC', 'DDDD', 'EEEE', 'F?']) {
+        expect(out).toContain(label)
+      }
+    }, 20000)
+
+    it('renders a much larger dense fan-in graph without hanging or crashing', () => {
+      // Amplified stress case (2x60 root nodes feeding two hubs) — confirms
+      // the render-wide path budget bounds total pathfinding work even
+      // when the per-search cap alone would not (each of ~120 fan-in edges
+      // independently getting its own 50k-iteration allowance is what
+      // caused real OOM crashes during investigation of this issue).
+      let src = 'graph TD\n  A --> C\n  B --> C\n  C --> D\n  D --> E\n'
+      for (let i = 0; i < 60; i++) src += `  A${i}["Root A${i}"] --> A\n`
+      for (let i = 0; i < 60; i++) src += `  B${i}["Root B${i}"] --> B\n`
+
+      const start = Date.now()
+      const out = renderMermaidASCII(src)
+      // Loose bound (not a tight performance assertion) — the goal is only
+      // to catch a regression back to the unbounded blowup this fix
+      // addresses (which would hang far longer than this, not just run
+      // slightly over). Both 10s and 20s bounds flaked under CPU
+      // contention (many test processes/agents competing for cores),
+      // despite the actual render being near-instant in isolation, so this
+      // is deliberately generous: real unbounded-blowup regressions took
+      // 60s+ to not even finish (see the repro comment above), so a 60s
+      // ceiling still catches those while tolerating a heavily loaded box.
+      expect(Date.now() - start).toBeLessThan(60000)
+      expect(out).toContain('Root A0')
+      expect(out).toContain('Root B59')
+    }, 90000)
+  })
+
+  describe('bug 2: order-dependent root misdetection', () => {
+    it('does not misclassify a node as a root when its child edge is declared first', () => {
+      // A --> C is declared *before* A1 --> A, so a single-pass,
+      // insertion-order root scan would wrongly treat A as a root (it
+      // "looks" untargeted at the point the scan reaches it).
+      const out = renderMermaidASCII(`graph TD
+    A["Parent A"] --> C["Child C"]
+    B["Parent B"] --> C
+    C --> D["Grandchild D"]
+    A1["Root 1"] --> A
+    A2["Root 2"] --> A
+    A3["Root 3"] --> A
+    B1["Root 4"] --> B
+    B2["Root 5"] --> B`)
+
+      const lines = out.split('\n')
+      const rootRow = lines.findIndex((l) => l.includes('Root 1'))
+      const parentRow = lines.findIndex((l) => l.includes('Parent A'))
+      const childRow = lines.findIndex((l) => l.includes('Child C'))
+      const grandchildRow = lines.findIndex((l) => l.includes('Grandchild D'))
+
+      // Correct levels: roots above parents above child above grandchild.
+      expect(rootRow).toBeLessThan(parentRow)
+      expect(parentRow).toBeLessThan(childRow)
+      expect(childRow).toBeLessThan(grandchildRow)
+    })
+
+    it('does not crash on a graph that is a pure cycle (no node is ever a real root)', () => {
+      // Every node here has a real incoming edge — order-independent
+      // detection correctly finds zero "never targeted" roots, so the
+      // layout needs its own fallback seed to avoid leaving every node
+      // unplaced (which used to crash with "Map maximum size exceeded" /
+      // a null gridCoord dereference).
+      expect(() =>
+        renderMermaidASCII('graph LR\nA --> B --> C --> A'),
+      ).not.toThrow()
+      const out = renderMermaidASCII('graph LR\nA --> B --> C --> A')
+      expect(out).toContain('A')
+      expect(out).toContain('B')
+      expect(out).toContain('C')
+    })
+  })
+
+  describe('bug 3: fan-in roots grouped by shared target', () => {
+    it('groups roots feeding the same target contiguously, even when interleaved in source order', () => {
+      // A1 and B1 are declared before A2 and B2, interleaving the two
+      // fan-in clusters in source order — the roots feeding A must still
+      // end up placed together, separately from the roots feeding B.
+      const out = renderMermaidASCII(`graph TD
+    A1 --> A
+    B1 --> B
+    A2 --> A
+    B2 --> B
+    A --> C
+    B --> C`)
+
+      const topRow = out.split('\n').find((l) => l.includes('A1'))!
+      const a1 = topRow.indexOf('A1')
+      const a2 = topRow.indexOf('A2')
+      const b1 = topRow.indexOf('B1')
+      const b2 = topRow.indexOf('B2')
+
+      expect(a1).toBeGreaterThanOrEqual(0)
+      expect(a2).toBeGreaterThanOrEqual(0)
+      expect(b1).toBeGreaterThanOrEqual(0)
+      expect(b2).toBeGreaterThanOrEqual(0)
+      // Grouped order: both A-feeders before both B-feeders.
+      expect(a1).toBeLessThan(b1)
+      expect(a2).toBeLessThan(b1)
+      expect(b1).toBeLessThan(b2)
+    })
+  })
+
+  describe('bug 4: sibling edges from the same source share a trunk', () => {
+    it('routes a labeled 3-way fan-out along a shared straight trunk instead of a detour', () => {
+      const out = renderMermaidASCII(`flowchart TB
+    Src["Source"]
+    Left["Left Target"]
+    Center["Center Target"]
+    Right["Right Target"]
+    Src -->|left*| Left
+    Src -->|center*| Center
+    Src -->|right*| Right`)
+
+      // The three branch points (├, ┬, ┐) for a clean shared trunk all
+      // land on the same row, immediately below Source's box.
+      const trunkRow = out
+        .split('\n')
+        .find((l) => l.includes('├') && l.includes('┬') && l.includes('┐'))
+      expect(trunkRow).toBeDefined()
+    })
+  })
+
+  describe('bug 5: box-start connector stays on the source border', () => {
+    it('keeps the ├ connector attached to the box border when a sibling label widens a shared column', () => {
+      const out = renderMermaidASCII(`flowchart LR
+  Src["Source"]
+  Top["Top Target"]
+  Mid["Middle Target"]
+  Bot["Bottom Target"]
+  Src -->|top*| Top
+  Src -->|mid*| Mid
+  Src -->|bot*| Bot`)
+
+      const topRow = out.split('\n').find((l) => l.includes('top*'))!
+      // The connector must be immediately adjacent to Source's box — no
+      // run of blank space between the border and the line/label.
+      expect(topRow).toMatch(/Source ├top\*/)
+    })
+  })
+})