[BUG] RTL text (Persian/Arabic/Hebrew) still renders LTR in VS Code/Cursor webview — v2.1.207, one-line CSS fix
Summary
RTL languages (Persian/Farsi, Arabic, Hebrew, Urdu) render with a left-to-right base direction in the extension chat webview. Punctuation lands on the wrong end of lines, list markers/bullets align to the wrong side, and paragraphs are left-aligned, making Claude's replies hard to read. Mixed RTL+code content (very common) is worse.
This is still present in v2.1.207 and has been reported and auto-closed as stale/not-planned at least six times: #29662, #29658, #30100, #41544, #30085, #38005. Filing fresh because all prior threads are closed. Please treat this as a consolidated re-report with an exact fix rather than a new investigation.
Environment
- Extension:
anthropic.claude-codev2.1.207 (darwin-arm64) - Editor: Cursor 3.11.13 (VS Code fork) — also reproduces in stock VS Code
- OS: macOS 26.5.1 (Apple Silicon, arm64)
Steps to reproduce
- Open the Claude Code panel.
- Have Claude output a paragraph of Persian/Arabic/Hebrew (mixed with inline
codeand numbered lists makes it obvious). - Text renders LTR: colons/periods appear at the left end of lines, list numbers/bullets sit on the wrong side, paragraphs are left-aligned.
_(Screenshot to be attached.)_
Root cause (verified in the shipped build)
In webview/index.css, unicode-bidi: plaintext is present but applied to only two selectors, both for file-path truncation:
.fileDirectoryDirectionReset_pZbgXw { direction: ltr; unicode-bidi: plaintext }
.directoryPathDirectionReset_pZbgXw { direction: ltr; unicode-bidi: plaintext }
The markdown message-content wrapper (.content_xheXVQ in this build) has no dir attribute and no bidi/direction CSS, so the browser defaults every message to LTR base direction.
Proposed fix
Let the Unicode BiDi algorithm pick per-paragraph direction on the message content wrapper, and keep code blocks LTR:
/* message / markdown content wrapper */
.content_xheXVQ { unicode-bidi: plaintext; }
/* keep code/pre left-to-right regardless of leading token */
.content_xheXVQ pre,
.content_xheXVQ code { direction: ltr; unicode-bidi: isolate; }
Equivalently, set dir="auto" on the message container and the input textarea in the renderer.
unicode-bidi: plaintext is preferable to bidi-override (the old #29658 problem) and is already used elsewhere in this same stylesheet, so it's a known-safe pattern here. This handles pure-RTL, pure-LTR, and mixed content automatically without a manual toggle.