fix: RTL text rendering regression in VSCode webview since v2.1.63 (fixes #29754)

[HarshalJain-cs]

Summary

Fixes #29754 (and related: #29658, #29662, #29545, #29958) — RTL text rendering is broken in the Claude Code VSCode chat panel since v2.1.63.

Affected languages: Persian/Farsi, Arabic, Hebrew, and all RTL scripts
Affected platforms: Linux, macOS, Windows
Confirmed on: Debian Linux, macOS (Apple Silicon), Windows 11 Pro, VSCode 1.109.5, extension v2.1.63+

Root Cause

Version v2.1.63 introduced a global CSS rule in the extension webview (webview/index.css):

* {
  direction: ltr;
  unicode-bidi: bidi-override;
}

The unicode-bidi: bidi-override property forces all text LTR, completely reversing RTL characters within words. This breaks Persian/Farsi, Arabic, and Hebrew text, making it completely unreadable.

The Fix

Change bidi-override → normal:

* {
  direction: ltr;
  unicode-bidi: normal;
}

This allows the browser's native Unicode Bidirectional Algorithm (BIDI) to handle RTL text correctly while keeping overall layout LTR. Mixed RTL+LTR content works perfectly with this change. The Claude Desktop app already handles this correctly.

The ideal fix is to update webview/index.css in the extension source. Until that's released, this PR provides an automated workaround via a plugin and a standalone script.

Changes

New Plugin: plugins/rtl-text-support/

A SessionStart hook plugin that automatically patches the installed extension's CSS at each session start:

• Detects ~/.vscode/extensions/anthropic.claude-code-*/webview/index.css
• Also covers VSCode-Server (remote SSH), Cursor IDE, and macOS paths
• Creates a .rtl-backup before patching
• Re-patches automatically after extension updates

New Script: scripts/fix-rtl-css.sh

A standalone one-time script for users who prefer manual fixing. Supports both Linux (sed -i) and macOS (sed -i '') syntax.

Testing

1. Install the plugin to ~/.claude/plugins/rtl-text-support/
2. Start a Claude Code session — the hook runs and patches the CSS
3. Reload VSCode window (Ctrl+Shift+P → Developer: Reload Window)
4. Type Persian/Arabic/Hebrew text in the chat — it should render RTL correctly

Affected Users

Any user of Claude Code extension v2.1.63+ who writes in: Persian/Farsi, Arabic, Hebrew or any other RTL language.

Related issues tracking this across platforms:

• RTL (right-to-left) text rendering broken in chat panel since v2.1.63 #29754 — Persian, Linux (original)
• VS Code webview CSS breaks RTL languages (Hebrew, Arabic) with unicode-bidi: bidi-override #29658 — Hebrew, macOS
• [BUG] RTL text (Persian/Arabic/Hebrew) renders reversed/broken in Claude Code VS Code/Cursor webview #29662 — Persian/Arabic/Hebrew, macOS + Cursor
• RTL text (Arabic) broken in Claude Code chat since v2.1.63 #29545 — earlier report
• RTL Arabic text rendering broken in VS Code chat panel since v2.1.63 (Windows) #29958 — Arabic, Windows 11 (newest)

[roy9982-cmd]

Still have RTL Problems can't code

[HarshalJain-cs]

@roy9982-cmd — the PR isn't merged yet (awaiting a maintainer review), so the extension itself hasn't been updated. Here's how to fix it right now without waiting:

Immediate workaround — apply the fix manually

Linux / macOS:

sed -i.rtl-backup 's/unicode-bidi: bidi-override/unicode-bidi: normal/g' \
  ~/.vscode/extensions/anthropic.claude-code-*/webview/index.css

For macOS if the above fails:

sed -i '' 's/unicode-bidi: bidi-override/unicode-bidi: normal/g' \
  ~/.vscode/extensions/anthropic.claude-code-*/webview/index.css

Windows (PowerShell):

$cssPath = Get-ChildItem "$env:USERPROFILE\.vscode\extensions" -Filter "index.css" -Recurse | Where-Object { $_.FullName -like "*anthropic.claude-code*webview*" } | Select-Object -First 1 -ExpandProperty FullName
if ($cssPath) {
    Copy-Item $cssPath "$cssPath.rtl-backup"
    (Get-Content $cssPath) -replace 'unicode-bidi:\s*bidi-override', 'unicode-bidi: normal' | Set-Content $cssPath
    Write-Host "Patched successfully: $cssPath"
}

After running the script: Reload VSCode (Ctrl+Shift+P → Developer: Reload Window). RTL text will render correctly immediately.

Note: If the extension auto-updates, you'll need to re-run the script. The plugin included in this PR automates that on every session start.

---

Maintainers — this bug affects Persian, Arabic, Hebrew, and all RTL language users across Linux, macOS, and Windows (ref: #29754, #29658, #29662, #29545, #29958). The fix is a single CSS property change (unicode-bidi: bidi-override → unicode-bidi: normal) with zero risk of regression. Would appreciate a review so this can be merged and users can stop manually patching their installs.

[GenaxaDev]

Confirmed fix works. Arabic RTL rendering broken on Windows 11 + v2.1.63, this CSS change resolves it. +1 for merge.