diff --git a/src/components/chat/ChatComposer.tsx b/src/components/chat/ChatComposer.tsx index 6c6d97c..1cd28e1 100644 --- a/src/components/chat/ChatComposer.tsx +++ b/src/components/chat/ChatComposer.tsx @@ -85,7 +85,7 @@ function GhostEditor({ data-testid="composer-editor" tabIndex={0} className={cn( - "composer-tiptap -m-1 block max-h-[8lh] min-h-[calc(2lh+--spacing(2))] overflow-y-auto p-1 whitespace-pre-wrap wrap-break-word bg-transparent leading-relaxed focus:outline-none", + "composer-tiptap -m-1 block [font-kerning:none] [font-variant-ligatures:none] max-h-[8lh] min-h-[calc(2lh+--spacing(2))] overflow-y-auto p-1 whitespace-pre-wrap wrap-break-word bg-transparent leading-relaxed focus:outline-none", complete ? "text-success-foreground" : "text-foreground", )} > diff --git a/tests/play.mjs b/tests/play.mjs index 5c6279d..54a735b 100644 --- a/tests/play.mjs +++ b/tests/play.mjs @@ -255,6 +255,10 @@ async function checkWordsStayPutWhileTyping(browser) { if (shifted >= 0) moved.push(`${width}px "${text.slice(0, n).slice(-12)}|" moved "${text.slice(shifted, shifted + 8)}"`); } } + const shaping = await page + .locator('[data-testid="composer-editor"]') + .evaluate((el) => `${getComputedStyle(el).fontKerning} ${getComputedStyle(el).fontVariantLigatures}`); + check(shaping === "none none", `composer turns off kerning and ligatures so letters keep their x position (got ${shaping})`); check(wrapped >= 5, `prompt wraps at ${wrapped} of 11 widths`); check(moved.length === 0, `no character changes line while typing${moved.length ? ` (${moved.length} keys): ${moved.slice(0, 3).join("; ")}` : ""}`); check(errors.length === 0, `no console errors in wrap run${errors.length ? `: ${errors.join(" | ")}` : ""}`);