Bug: Excalidraw labels clip on initial open (text metrics not refreshed)

[anand-testcompare]

Summary

Generated diagrams sometimes show clipped label text when first opened in Excalidraw; clicking the element refreshes and fixes layout.

Repro

1. Generate a diagram via backend (share link example below).
2. Open the share link in Excalidraw.
3. Observe some labels clipped/missing trailing characters until you click the text element.

Example share link (Jan 31, 2026):
https://excalidraw.com/#json=C9_xNKiAfC_6gucoZHukz,CX_RdZS9uMcQGmZhRRaC8A

Local PNG (rendered):
/Users/anandpant/Development/sketchi/sketchi/png/diagram-generate-2026-01-31T07-51-00-351Z-da6df53d.png

Expected

Text labels render fully on first open without needing interaction.

Actual

Some labels appear clipped/truncated until the element is selected/edited.

Analysis (so far)

• Elements are generated in packages/backend/lib/excalidraw-elements.ts.
• We currently estimate text width/height and wrap labels server-side.
• Excalidraw rewraps text based on originalText, autoResize, and container-specific max width (see getBoundTextMaxWidth in Excalidraw dist).
• If our initial width/height is too small or wrapping mismatches Excalidraw’s algorithm, text can render clipped until a refresh/interaction triggers refreshTextDimensions.

Recent changes to improve this (still not fully fixed in all cases):

• Implemented rough text metrics + wrapping and preserved originalText unwrapped.
• Used container-specific max width (ellipse/diamond/rectangle) and arrow label width rules.

Suspected root causes

• Server-side text measurement is only an approximation (no canvas measureText), so width/height can be under-estimated.
• Our wrapper uses a simple char-based split; Excalidraw uses wrapText with line-break rules (CJK/emoji/hyphen, etc.) and canvas text metrics.
• autoResize for bound text + container max widths may conflict with precomputed sizes.

Possible next steps

• Option A: run Excalidraw measureText + wrapText in a headless DOM (canvas) server-side for accurate dimensions.
• Option B: set conservative width/height padding (overestimate) and allow Excalidraw to shrink.
• Option C: set autoResize: false + text prewrapped using Excalidraw’s own wrapText (requires importing their algorithm).
• Option D: increase container sizes based on label length to avoid wrapping/clipping.

Files

• packages/backend/lib/excalidraw-elements.ts (text creation + metrics)
• Excalidraw refreshTextDimensions, wrapText, getBoundTextMaxWidth (reference in packages/backend/node_modules/@excalidraw/excalidraw/dist/dev/chunk-3KPV5WBD.js)

[anand-testcompare]

Grooming note (2026-02-20): no follow-up code changes have landed for this path since #71.\n\nLatest commit touching packages/backend/lib/excalidraw-elements.ts is still b0a7792 (PR #71). Since this issue was opened after that fix, I’m treating this as still unresolved and keeping it open.