Skip to content

Terminal SVG stretches visible glyphs across padded rows in browsers #185

Description

@konard

Problem

The faithful terminal SVG renderer introduced in #181 coalesces every same-style cell in a row into one <text> element. Terminal rows are padded to their full column width, so a short default-style line such as (no output) becomes a text run whose literal content and textLength include all remaining blank cells.

Chromium ignores trailing spaces when it computes the glyph extent for SVG textLength. It then stretches the visible glyphs across the run's full 80-column target width. Leading blank cells cause the analogous position/width distortion. The serialized SVG has the correct grid dimensions but its browser rendering is visibly corrupt.

Reproduction

Capture an 80-column terminal frame containing a short default-style row and render snapshot.svg in Chromium. A generated row currently has this shape:

<text x="0" ... textLength="720" lengthAdjust="spacingAndGlyphs">(no output)                                                                     </text>

The short label is stretched across the terminal width.

This was found by rendering the real OpenCode capture from link-assistant/formal-ai#841 in a browser, rather than only checking the SVG source.

Expected behavior

  • Leading/trailing blank terminal cells must not be part of a visible text run's textLength.
  • The renderer must preserve the visible run's exact cell-grid position and width.
  • Internal spaces, wide glyphs, backgrounds, styling, vectors, embedded fonts, and recording SVG behavior must remain intact.
  • A regression test should cover both padded edges and wide glyph geometry.

Metadata

Metadata

Assignees

No one assigned

    Labels

    No labels
    No labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions