Android diff viewer draws word-diff highlights at the wrong position when "monospace" resolves to a proportional font#27146

opened14d agobyFFedotCompot

What happened

In the Android app's diff viewer (the Changes screen for a PR/turn), the red/green word-level highlights on changed lines are drawn in the wrong place. They are shifted to the right and are wider than the text they should mark, often covering unchanged characters or empty space after the line.

Example from the screenshot (to be attached below):

  • go.mod: go 1.25 → go 1.27.3. On the deleted line the red highlight is an empty box after the end of go 1.25, not over the 5.
  • runbook.md: - `go ≥ 1.25` (builds `factory/cmd/role-assigner` … → - `go ≥ 1.27.3` …. The highlights land over `fa / s `fa (inside the path) instead of over the version number.

The code text in the diff is visibly rendered in a proportional font on this device, not a monospace one.

Diagnosis

ReviewDiffCanvasDrawing.drawWordDiffRanges positions every highlight by character index times the width of "M":

https://github.com/pingdotgg/t3code/blob/dd148481531a0a090780a2ade20588566db099a2/apps/mobile/modules/t3-review-diff/android/src/main/java/expo/modules/t3reviewdiff/ReviewDiffCanvasDrawing.kt#L368-L400

kt
1val characterWidth = textPaint.measureText("M")
2...
3val left = codeX + (start - lineStart) * characterWidth
4val right = max(left + 2f * density, left + (end - start) * characterWidth)

This assumes the code typeface is fixed-pitch. The typeface is Typeface.create("monospace", …) (L524-L533), and on this device (OPPO Find X9 Pro, stock settings, no custom font chosen) that family resolves to a proportional font. The text itself is drawn with real measured advances (measureText per run in drawCode), so text and highlights drift apart. The error grows with the column, and highlights are too wide because "M" is wider than the average proportional glyph.

The same class already detects this case. asciiFixedPitch (L223, L274-L278, with the comment "Some system font weights resolve to proportional fallbacks even for "monospace"") is used for row width measurement (L316), but drawWordDiffRanges does not consult it. Measuring the prefix and range with textPaint.measureText(content, start, end) (or using asciiFixedPitch to choose that path) would align the highlights with the rendered text.

This code was introduced in #3967 and is unchanged on main (dd14848) and in Android beta 2.2.0 (735).

Steps to reproduce

  1. Use an Android device where the system monospace family is not fixed-pitch (seen on an OPPO Find X9 Pro with default settings).
  2. In the Android app, open a thread's Changes / PR diff view containing an edited line where the change is mid-line, e.g. go 1.25 → go 1.27.3 in a go.mod.
  3. Look at the red/green word-diff highlights on the deleted and added lines: they are offset to the right of the changed characters and too wide.

On a device whose monospace is genuinely fixed-pitch, the highlights line up (expected behavior).

Version

Android app 2.0.0 (code path unchanged through 2.2.0 beta and current main)

Environment

OPPO Find X9 Pro, Android (ColorOS, stock fonts), T3 Code Android app 2.0.0, connected to a T3 Code server on Linux

Evidence

shell
1# Screenshot attached separately: go.mod and runbook.md hunks in the Android Changes view
2# showing word-diff boxes offset from the changed characters.

#4582: monospace fell back to a proportional font on Android, but for React Native font-mono text surfaces (Uniwind font-family list). This report is the native review-diff canvas, which already requests monospace correctly but positions highlights as if it were fixed-pitch.

Fix applied or workaround

None. Nothing user-side changes the font resolution without a custom system font.

Filed by

Claude Code (Claude Opus 5.5, claude-opus-5-5) via t3 triage