Hacktoberfest 2026: những issue maintainer đã đánh dấu cho tháng Mười, đang mở và phù hợp người mới. Xem issue Hacktoberfest

Powerline prompts render as smudged/banded segments: font-rasterized separators + unclamped fallback glyphs

Đang mở
  • Có gì không ổn?
#184 0 bình luận 0 reaction 0 người được giao Xem trên GitHub

Chưa có ai nhận issue này.

Đánh giá

Độ khó
3/5
Thời gian dự kiến
1-2 ngày
Mức phù hợp với người mới
55/100
Loại issue
Lỗi
Độ rõ ràng
Đặc tả rõ ràng
Mức độ hoạt động
Ít trao đổi
Công nghệ
typescript
Lĩnh vực
frontend

Hướng nghiên cứu

Bắt đầu từ renderCellText và kiểm tra cách sử dụng cellWidth, fillStyle cùng các metric của glyph fallback. Tái hiện prompt 2x, 13px JetBrains Mono và Symbols Nerd Font Mono, sau đó xác minh rằng U+E0B0-U+E0B7 được render bằng hình học bao phủ ô, còn các glyph khác bị giới hạn trong chiều rộng ô của chúng mà không bị banding hoặc tràn sang các ô lân cận.

Do mô hình lập chỉ mục viết ra từ nội dung của issue.

Mô tả

Symptom

Embedding ghostty-web (0.4.0) with a starship Powerline prompt (segment backgrounds, fading-arrow separators U+E0B0, rounded caps U+E0B4/E0B6, Nerd icons), the prompt renders as soft "watercolor" blobs with ragged edges and horizontal banding inside segments — while plain ASCII output stays crisp. Reproduced on a 2x display at 13px with JetBrains Mono + Symbols Nerd Font Mono.

Root causes (two, compounding)

1. Powerline separators are font-rasterized.
renderCellText draws U+E0B0-U+E0B7 via fillText like any glyph. Two physical problems:

  • the diagonal edges keep anti-aliasing fringe on both sides, which visually smears against adjacent solid segment backgrounds;
  • the glyph's ink height is smaller than the cell height (font ascent/descent box ≠ cell box), so the neighboring background bleeds through above/below every separator — with stacked "fading arrow" themes this shows as banding stripes.

This is why WezTerm and xterm.js (customGlyphs) both special-case these codepoints and draw them as exact vector geometry covering the cell box, bypassing the font entirely.

2. Oversized fallback glyphs are not clamped to their cells.
Cell metrics come from the primary font's M, but glyphs served by fallback fonts carry their own advance — e.g. Symbols Nerd Font Mono icons advance 1em (13px = 1.67 cells at a 7.8px cell). fillText never scales, so the ink bleeds into neighbor cells. Since rows repaint by background fill (no clearRect), the cursor-row repaint shaves that overhanging ink asymmetrically every blink — accumulating the ragged artifacts.

renderCellText already computes the cell budget (cellWidth = metrics.width * cell.width) but doesn't pass it to fillText, whose 4th argument (maxWidth) does exactly this clamping.

Fix

PR incoming that (a) draws U+E0B0-U+E0B7 as vector paths (solid triangles / angle outlines / half-circles) using the cell's fillStyle, and (b) passes cellWidth as fillText's maxWidth for everything else. Verified pixel-level against WezTerm rendering the same prompt.

Ngôn ngữ chính
TypeScript
Star
2.9k
Fork
179
Không có pull request nào được merge trong 30 ngày

Chuẩn bị môi trường

Dự án này không cung cấp dev container, Dockerfile hay hướng dẫn đóng góp, nên bạn cần tự thiết lập môi trường: hãy bắt đầu từ README và xem hướng dẫn đóng góp lần đầu của chúng tôi để biết các bước chung.

Bắt đầu từ đâu

  1. Đọc hết issue, rồi đọc hướng dẫn đóng góp của dự án.
  2. Bình luận trên issue rằng bạn sẽ nhận — tránh hai người làm cùng một việc.
  3. Fork repository và làm thay đổi trên một nhánh.
  4. Mở pull request có tham chiếu số hiệu của issue.

Issue khác của coder/ghostty-web

Tất cả issue của coder/ghostty-web

Issue tương tự

Thêm issue về TypeScript

Nhận issue mới trong hộp thư của bạn

Bản tóm tắt ngắn những issue GitHub phù hợp với người mới.