BUG: IME Selection Is Not Updated When decoration.mark Contains Multiple decoration.replace Decorations

1

First of all, thank you for the great work on this project.

We found an issue related to IME input. Under normal circumstances, during IME composition the selection is updated to the leading edge of the composition. However, when a single decoration.mark contains two decoration.replace decorations, IME input causes the composed text to remain selected. In this case, the selection is not updated as expected and instead stays on the range of the IME-composed characters.

Screenshot

截屏2026-06-07 16.11.30
截屏2026-06-07 16.11.301064×328 32.1 KB

截屏2026-06-07 16.11.40
截屏2026-06-07 16.11.401218×420 34.5 KB

DEMO

import { basicSetup, EditorView } from "codemirror";
import { ViewPlugin, Decoration } from "@codemirror/view";
import { RangeSet } from "@codemirror/state";
import { markdown } from "@codemirror/lang-markdown";
import { languages } from "@codemirror/language-data";

// The Markdown parser will dynamically load parsers
// for code blocks, using @codemirror/language-data to
// look up the appropriate dynamic import.
new EditorView({
  doc: "Hello World\nHello World",
  extensions: [
    basicSetup,
    markdown({ codeLanguages: languages }),
    EditorView.theme({
      "& .cm-selectionBackground": {
        backgroundColor: "red !important"
      }
    }),
    ViewPlugin.fromClass(class {}, {
      provide: () =>
        EditorView.decorations.of((view) => {
          const line = view.state.doc.lineAt(0);
          const ranges = [];
          if (line.text.length > 5) {
            ranges.push(Decoration.mark({}).range(line.from, line.to));
            ranges.push(
              Decoration.replace({}).range(line.from + 1, line.from + 2),
            );
            ranges.push(
              Decoration.replace({}).range(line.from + 3, line.from + 4),
            );
          }

          return RangeSet.of(ranges, true);
        }),
    }),
  ],
  parent: document.body,
});
IME input may break when cursor is adjacent to widget due to cm-widgetBuffer reconstruction
2

That depends on the IME system. Some keep the composition selected, a few even keep the cursor at the start of the range.

Could you tell me which browser, which IME, and which operating system you’re seeing this with?

3

OS: macOS 15.7.7

IME: default Chinese

Browser: safari 26.5 (20624.2.5.18.3)

Normally, selection updates are dispatched to the frontend, but I’ve observed cases where the dispatch is skipped.

Additionally, I found that under certain conditions (e.g. two consecutive Decoration.marks), IME input may cause duplicated rendering of Range<Decoration>.

Attempting to correct this behavior in inputHandler appears to interfere with the internal composition logic in inputState, leading to incorrect compose state calculations.

4

Thanks, that helped reproduce it. The root of this is a Safari issue, where it will change its composition selection behavior when a node in front of the composition is changed. Attached patch works around it in this case by being more careful about reusing widget buffer nodes. But in a situation where you’re actually adding or updating a widget in front of the composition, the issue will still occur, and there’s not much the editor it can do about that (if it would try to correct the native DOM selection, that’d abort the composition).

5

That’s great. During my testing, I noticed that IME input can sometimes prevent keys such as Backspace and Command from triggering keydown events at all, which was pretty confusing. This might also be caused by frequent updates to nodes before the active composition. It looks like I need to be extra careful when updating DOM nodes while composition is in progress.

6

I found that if there are elements with contenteditable="false" inside a .cm-line, IME input may run into issues. When inline widgets are introduced via Decoration.replace or Decoration.widget, input can behave unexpectedly. Have you considered removing contenteditable="false" from the DOM elements created by widgets? This might help avoid the IME input problems.