fix(tui): pin native highlighting ownership

Author: TheGreatAxios

src/tui/markdown-parser.test.ts

@@ -172,7 +172,8 @@ describe("block elements", () => {
     // The blank body line is not an empty segment array — it still paints ▏.
     const blankBody = lines.find(
       (line) =>
-        line.map((s) => s.text).join("") === "▏ " &&
+        line.length === 1 &&
+        line[0]?.text === "▏ " &&
         line[0]?.codeFence === true,
     );
     expect(blankBody).toBeDefined();

src/tui/syntax-highlight.test.ts

@@ -12,6 +12,8 @@
 import { describe, expect, test } from "bun:test";
 import { MarkdownRenderable, RGBA, type CapturedSpan } from "@opentui/core";
 import { withTestRenderer, type Harness } from "./harness";
+import { appendStreamRow } from "./shell/chrome.js";
+import { createAppShell } from "./shell/index.js";
 import { transcriptSyntaxStyle } from "./stream";
 import { highlightCode } from "./syntax-highlight.js";
 import { UI } from "./theme";
@@ -69,6 +71,68 @@ function coloured(spans: CapturedSpan[], text: string, fg: RGBA): boolean {
   return spans.some((s) => s.text.includes(text) && s.fg.equals(fg));
 }
 
+function hasSyntaxColour(spans: CapturedSpan[], text: string): boolean {
+  return spans.some(
+    (span) =>
+      span.text.includes(text) && SYNTAX_FGS.some((fg) => span.fg.equals(fg)),
+  );
+}
+
+async function expectTranscriptHighlighting(
+  h: Harness,
+  supportedLanguage: "js" | "ts",
+  streaming: boolean,
+): Promise<void> {
+  const shell = createAppShell(h.renderer, {
+    terminal: { columns: 80, rows: 40 },
+    wireKeys: false,
+  });
+  try {
+    appendStreamRow(shell, {
+      role: "assistant",
+      streaming,
+      text: [
+        `\`\`\`${supportedLanguage}`,
+        "const supported_route = 42;",
+        "```",
+        "",
+        "```python",
+        "def python_plain():",
+        '    return "visible"',
+        "```",
+      ].join("\n"),
+    });
+    const spans = await settleSpans(
+      h,
+      (current) =>
+        coloured(current, "const", KEYWORD_FG) &&
+        current.some((span) => span.text.includes("python_plain")),
+    );
+
+    expect(coloured(spans, "const", KEYWORD_FG)).toBe(true);
+    expect(h.captureCharFrame()).toContain("python_plain");
+    expect(hasSyntaxColour(spans, "python_plain")).toBe(false);
+  } finally {
+    shell.dispose();
+  }
+}
+
+describe("production transcript fenced rendering", () => {
+  test("settled assistant fences use production syntax ownership", async () => {
+    await withTestRenderer(
+      (h) => expectTranscriptHighlighting(h, "js", false),
+      { width: 80, height: 40 },
+    );
+  }, 30000);
+
+  test("streaming assistant fences use production syntax ownership", async () => {
+    await withTestRenderer((h) => expectTranscriptHighlighting(h, "ts", true), {
+      width: 80,
+      height: 40,
+    });
+  }, 30000);
+});
+
 describe("native fenced rendering", () => {
   test("a js fence colours keywords, strings, comments, and numbers", async () => {
     await withTestRenderer(

src/tui/syntax-highlight.ts

@@ -1,5 +1,3 @@
-/// <reference lib="dom" />
-
 /**
  * Fenced-code styling for the synchronous markdown model.
  *
@@ -8,14 +6,13 @@
  * MarkdownRenderable/CodeRenderable path with transcriptSyntaxStyle() over the
  * bundled tree-sitter grammars (javascript, typescript, markdown, zig). This
  * module keeps the legacy path's geometry with plain segments.
- *
- * The DOM lib reference replaces the implicit reference highlight.js supplied;
- * Bun's fetch, Web Crypto, and timer types rely on those globals repo-wide.
  */
 import type { StyledSegment } from "./markdown-parser.js";
 
 function plainLines(code: string): StyledSegment[][] {
-  return code.split("\n").map((text) => [{ text, code: true }]);
+  return code
+    .split("\n")
+    .map((text) => (text.length === 0 ? [] : [{ text, code: true }]));
 }
 
 const codeCache = new Map<string, StyledSegment[][]>();

tsconfig.base.json

@@ -23,6 +23,6 @@
     "module": "ESNext",
     "noEmit": true,
 
-    "lib": ["ESNext"]
+    "lib": ["ESNext", "DOM"]
   }
 }