Skip to content

feat(js): render faithful terminal SVG and GIF artifacts - #181

Merged
konard merged 8 commits into
mainfrom
issue-180-d782935f4991
Jul 25, 2026
Merged

feat(js): render faithful terminal SVG and GIF artifacts#181
konard merged 8 commits into
mainfrom
issue-180-d782935f4991

Conversation

@konard

@konard konard commented Jul 25, 2026

Copy link
Copy Markdown
Member

Fixes #180.

Reproduction

In 0.15.0, terminalFrame() flattened xterm buffer lines to strings before artifact rendering. A capture containing truecolor/256-color SGR, bold/dim/italic/underline/strikethrough, interior spaces, CJK cells, Braille, and box drawing therefore produced monochrome SVG text with collapsed spacing. Recording SVG also used synthetic 350 ms SMIL frames and no raster fallback.

The new focused fixture reproduces all of those losses. Before this change it fails because frame.cells and recording.gif do not exist.

Changes

  • retain xterm cell width, foreground/background color, and SGR attributes in every settled frame
  • detect style-only repaint changes while preserving the compatible string-based screen and lines fields
  • coalesce equal text styles and background runs
  • enforce an integer terminal grid with textLength/lengthAdjust, including double-width cells
  • render box-drawing and block ranges as crisp vector geometry
  • embed a packaged 28 KB WOFF2 subset of DejaVu Sans Mono with Latin, arrow, and Braille coverage; include its license and reproducible build script
  • replace SMIL with a CSS film strip using real timestamps and steps(1, end); cap only idle gaps via idleTimeLimit
  • add GIF output by rasterizing the same SVG frames (documenting GIF's 256-color-per-frame limitation)
  • make cell size, font size, padding, corner radius, and idle trimming configurable
  • derive 80×30 by default from a configurable 4:3 capture aspect ratio
  • add a changeset and a reproducible committed SVG/GIF sample

Verification

  • bun test tests/terminal-capture.test.mjs --timeout 10000: 8 pass, 0 fail; two cold runs completed in 2.48 s and 2.70 s
  • bun run lint: pass (one pre-existing warning in src/commands/$.cd.mjs)
  • bun run format:check: pass
  • bun run check:duplication: pass
  • npm pack --dry-run: bundled font and license confirmed
  • full local bun run test: 749 pass, 10 skip, 28 fail because the local environment does not provide the external jq executable; CI's isolated matrix is the authoritative full-suite check

Visual proof

The committed sample is generated through captureTerminal() and can be regenerated with bun examples/terminal-artifacts-demo.mjs.

Animated terminal artifact

GIF fallback: recording.gif

Adding .gitkeep for PR creation (default mode).
This file will be removed when the task is complete.

Issue: #180
@konard konard self-assigned this Jul 25, 2026
@konard konard changed the title [WIP] Terminal SVG renderer loses all colour, collapses spaces so columns cannot align, and fakes frame timing feat(js): render faithful terminal SVG and GIF artifacts Jul 25, 2026
@konard konard added the parity-exempt Change is intentionally single-language; skip JS/Rust parity check label Jul 25, 2026
@konard
konard marked this pull request as ready for review July 25, 2026 13:17
@konard

konard commented Jul 25, 2026

Copy link
Copy Markdown
Member Author

Working session summary

Implemented issue #180 and marked the PR ready for review:

PR #181 — Faithful terminal SVG and GIF artifacts

Highlights:

  • Preserves terminal colors, styles, spacing, wide characters, and cell geometry.
  • Adds timestamp-accurate animated SVG and GIF output.
  • Embeds a licensed, pre-subsetted terminal font.
  • Adds configuration, documentation, changeset, regression tests, and visual samples.
  • Optimized GIF rendering to avoid macOS timeouts.
  • Verified on Bun across Ubuntu, macOS, and Windows, plus Node 20/22/24.
  • All required CI checks pass.
  • Branch is clean, current with main, and PR merge state is clean.

This summary was automatically extracted from the AI working session output.

@konard

konard commented Jul 25, 2026

Copy link
Copy Markdown
Member Author

🤖 Solution Draft Log

This log file contains the complete execution trace of the AI solution draft process.

💰 Cost estimation:

  • Model: GPT-5.6 Sol
  • Provider: OpenAI
  • Public pricing estimate: $16.648879

📊 Context and tokens usage:

  • 304.7K / 200K (152%) input tokens, 36.1K / 128K (28%) output tokens

Total: (304.7K + 12.0M cached) input tokens, 36.1K output tokens, $16.648879 cost

🤖 Models used:

  • Tool: OpenAI Codex
  • Requested: gpt-5.6-sol
  • Thinking level: low (~7999 tokens)
  • Model: GPT 5.6 Sol (gpt-5.6-sol)

📎 Log file uploaded as Gist (4946KB)


Now working session is ended, feel free to review and add any feedback on the solution draft.

@konard
konard merged commit 4c775ac into main Jul 25, 2026
12 checks passed
@konard

konard commented Jul 25, 2026

Copy link
Copy Markdown
Member Author

🎉 Auto-merged

This pull request has been automatically merged by hive-mind.

  • All CI checks have passed

Auto-merged by hive-mind with --auto-merge flag

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

parity-exempt Change is intentionally single-language; skip JS/Rust parity check

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Terminal SVG renderer loses all colour, collapses spaces so columns cannot align, and fakes frame timing

1 participant