Web UI: typing Chinese with IME garbles text, but pasting works #5879
Replies: 3 comments
|
For anyone hitting this on Windows with Microsoft Pinyin, a reliable workaround while the IME handling gets fixed:
javascript:(function(){var b=document.getElementById('dshCni');if(b){b.remove();return}var x=document.createElement('textarea');x.id='dshCni';x.style.cssText='position:fixed;left:8px;bottom:8px;z-index:2147483647;width:320px;height:100px;font:15px/1.4 sans-serif;background:#111;color:#0f0;border:1px solid #2a2;border-radius:6px;padding:6px;resize:both';x.placeholder='[CN] type Chinese, then press Enter';x.addEventListener('keydown',function(e){if(e.key==='Enter'&&!e.shiftKey){e.preventDefault();var v=(x.value||'').trim();if(!v){return}var ed=document.querySelector('[contenteditable="true"]');if(ed){ed.focus();try{document.execCommand('insertText',false,v)}catch(err){ed.textContent=v}}x.value='';x.focus()}});document.body.appendChild(x);x.focus()})();
The bookmarklet types in a native textarea and injects the text via execCommand insertText, which is equivalent to pasting - and pasting is confirmed to work. So it cleanly avoids the broken IME composition path. |
|
Thanks for the detailed report + reproduction, and for the bookmarklet workaround. One architecture note that changes the diagnosis slightly, then the discriminating question. The composer is not a naive controlled contenteditable — it's a Lexical rich-text editor. The editable surface ( IME handling is explicitly guarded and has dedicated tests. In
So if the symptom is real on 0.1.2-rc.1, the more likely culprit than "controlled reset" is an interaction between a specific Lexical version and the IME's composition events (e.g. an update tag / Discriminating question that would localize it fast: does the garbling reproduce on current The bookmarklet is a solid stopgap — and pasting working while typing garbles is itself a strong signal: paste bypasses composition, so the fault is almost certainly in the composition event path (Lexical/ |
|
Thanks for the detailed reply and the architecture correction — my "controlled contenteditable" framing was off. I tried running the discriminating check you suggested, but the alpha channel is broken on the publishing side, so the test can't be reached the way you intended:
For what it's worth, the published So across every installable version the garbling reproduces, which points to the live Lexical+IME interaction bug rather than an rc.1 regression. That said, I can only conclude this from published artifacts — I haven't actually typed on a newer composer. If you can ship the newer composer to an installable channel (or point me to a master build), I'll run the real typing test and report back. Until then, the bookmarklet remains my workaround. |
Uh oh!
There was an error while loading. Please reload this page.
Environment
dsh: 0.1.2-rc.1 (latest on npm) - Windows 11 - Edge/Chrome - Microsoft Pinyin IME
Problem
Typing Chinese in the web UI garbles the text - e.g. typing 你好 produces fragmented/garbled characters. But Ctrl+V pasting the same Chinese displays correctly.
Root cause (from DOM inspection)
The input is a single controlled contenteditable (no input/textarea/iframe/canvas on page). Typed CJK appears to be committed character-by-character: during IME composition each key resets the content via the controlled state, so composition never completes cleanly. Pasting bypasses composition, hence it works.
Suggested fix
Handle IME composition events (onCompositionStart/Update/End) in the input component - do not rewrite content mid-composition and commit the full text on compositionend.
Workaround for affected users
A bookmarklet that types into a native textarea and injects the result (equivalent to a paste) into the contenteditable works reliably. Happy to share it.
All reactions