Page MenuHomePhabricator

Two IME selectors appear when using CodeMirror 6
Closed, ResolvedPublicBUG REPORT

Assigned To
Authored By
Jack_who_built_the_house
Sep 19 2025, 7:38 AM
Referenced Files
F66081153: firefox_r3UAafghm9.mp4
Sep 19 2025, 3:09 PM
F66080097: image.png
Sep 19 2025, 7:41 AM
F66080075: image.png
Sep 19 2025, 7:38 AM
F66080066: image.png
Sep 19 2025, 7:38 AM
F66080057: image.png
Sep 19 2025, 7:38 AM
F66080080: image.png
Sep 19 2025, 7:38 AM

Description

Screen recording

Steps to replicate the issue (include links if applicable):

Follow carefully:

  • Go to https://en.wikipedia.org/wiki/WP:Sandbox?action=edit
  • Open DevTools
  • Make sure input tools are enabled in ULS (Add languages → Open language settings → Input) and "Improved Syntax Highlighting" beta feature (CodeMirror 6) is enabled
  • Disable syntax highlighting if it was enabled
  • Type something into the main text box
  • Enable syntax highlighting
  • Type something into the main text box

What happens?:
Two IME selectors in DOM:

image.png (50×1 px, 14 KB)

Both visible and at the same position.

What should have happened instead?:
One IME selector in DOM.

Other information (browser name/version, screenshots, etc.):
I noticed this because in Convenient-Discussions these elements actually have different positions. So, I saw the IME selectors overlapping like this:

image.png (78×78 px, 2 KB)

With the standard editor, their silhouettes just coincide precisely, which leads to the button appearing more opaque:

image.png (77×76 px, 1 KB)
image.png (80×72 px, 1 KB)

Event Timeline

Jack_who_built_the_house renamed this task from Two IME selector elements appear in CodeMirror to Two IME selectors appear when using CodeMirror.Sep 19 2025, 7:39 AM
Jack_who_built_the_house updated the task description. (Show Details)

I cannot reproduce the issue for the standard editor. In that case, although there are two .imeselector.imeselector-toggle elements, the other one is for #wpTextbox1 and is always display: none when CodeMirror is on.

Code that may help the diagnosis:

$('.cm-content').data('imeselector').$imeSetting[0] === $('.imeselector.imeselector-toggle')[0] &&
$('#wpTextbox1').data('imeselector').$imeSetting[0] === $('.imeselector.imeselector-toggle')[1];
Jack_who_built_the_house renamed this task from Two IME selectors appear when using CodeMirror to Two IME selectors appear when using CodeMirror 6.Sep 19 2025, 2:53 PM
Jack_who_built_the_house updated the task description. (Show Details)

I cannot reproduce the issue for the standard editor. In that case, although there are two .imeselector.imeselector-toggle elements, the other one is for #wpTextbox1 and is always display: none when CodeMirror is on.

🤔 I can reproduce with &safemode=1 in both Chrome and Firefox.

Code that may help the diagnosis:

$('.cm-content').data('imeselector').$imeSetting[0] === $('.imeselector.imeselector-toggle')[0] &&
$('#wpTextbox1').data('imeselector').$imeSetting[0] === $('.imeselector.imeselector-toggle')[1];

That shows true for me, but not sure what's its usefulness?

I'll make a screen recording, hold on.

@Jack_who_built_the_house Thanks for the recording! I can reproduce it now. A quick fix will soon follow.

Change #1189920 had a related patch set uploaded (by Bhsd; author: Bhsd):

[mediawiki/extensions/CodeMirror@master] CodeMirror: disable IME from the original textarea

https://gerrit.wikimedia.org/r/1189920

MusikAnimal changed the task status from Open to In Progress.Sep 19 2025, 8:05 PM
MusikAnimal assigned this task to Bhsd.
MusikAnimal moved this task from Backlog to Bugs on the MediaWiki-extensions-CodeMirror board.

Change #1189920 merged by jenkins-bot:

[mediawiki/extensions/CodeMirror@master] CodeMirror: disable IME from the original textarea

https://gerrit.wikimedia.org/r/1189920

Bhsd changed the task status from In Progress to Open.EditedSep 29 2025, 5:23 AM
Bhsd removed Bhsd as the assignee of this task.

This issue seems more difficult than I thought, because the keyboard events are always re-dispatched in the original textarea.

How about just disabling IME like in CodeMirror 5 (T194102)?

Change #1197010 had a related patch set uploaded (by Bhsd; author: Bhsd):

[mediawiki/extensions/CodeMirror@master] CodeMirror: disable IME only for regular textareas

https://gerrit.wikimedia.org/r/1197010

Change #1197010 merged by jenkins-bot:

[mediawiki/extensions/CodeMirror@master] CodeMirror: disable IME only for regular textareas

https://gerrit.wikimedia.org/r/1197010

Bhsd claimed this task.
Bhsd moved this task from Bugs to Done on the MediaWiki-extensions-CodeMirror board.