From 98f2736233702fbbe49034354067d140f716917d Mon Sep 17 00:00:00 2001 From: Mohamed Boudra Date: Tue, 28 Apr 2026 21:58:22 +0700 Subject: [PATCH] fix(app): keep diff gutter row aligned when line number is blank The recently added numberOfLines={1} on the gutter wraps the content in display:-webkit-box; overflow:hidden on web, where a plain ASCII space collapses to zero height. That shifted every line number up by one row, leaving "1" next to the hunk marker. Use a non-breaking space so the cell keeps its line height. --- packages/app/src/utils/diff-rendering.test.ts | 6 +++++- packages/app/src/utils/diff-rendering.ts | 4 +++- 2 files changed, 8 insertions(+), 2 deletions(-) diff --git a/packages/app/src/utils/diff-rendering.test.ts b/packages/app/src/utils/diff-rendering.test.ts index 5e919b877..4d6e35e89 100644 --- a/packages/app/src/utils/diff-rendering.test.ts +++ b/packages/app/src/utils/diff-rendering.test.ts @@ -8,7 +8,11 @@ import { describe("diff-rendering", () => { it("keeps header gutters tall even when they do not show a line number", () => { - expect(formatDiffGutterText(null)).toBe(" "); + // Must be a non-collapsing whitespace: the gutter uses + // numberOfLines={1}, which on web wraps in display:-webkit-box; + // overflow:hidden. A plain ASCII space collapses to zero height + // there and shifts every line number up by one row. + expect(formatDiffGutterText(null)).toBe("\u00A0"); expect(formatDiffGutterText(82)).toBe("82"); }); diff --git a/packages/app/src/utils/diff-rendering.ts b/packages/app/src/utils/diff-rendering.ts index ec18716c7..a189c56b6 100644 --- a/packages/app/src/utils/diff-rendering.ts +++ b/packages/app/src/utils/diff-rendering.ts @@ -3,8 +3,10 @@ interface HighlightLikeToken { } // Preserve row height when a gutter or diff cell is intentionally blank. +// Non-breaking space because the gutter uses numberOfLines={1}, which +// collapses a plain ASCII space to zero height on web. export function formatDiffGutterText(lineNumber: number | null): string { - return lineNumber == null ? " " : String(lineNumber); + return lineNumber == null ? "\u00A0" : String(lineNumber); } export function formatDiffContentText(content: string | null | undefined): string {