Extra unexpected text input when selection end is touch mark which inclusive is 'false' with IME Mode

4

@marijn

I am currently resolving this issue by inserting an img decoration with side=-1 into the text node where the cursor is located via a Plugin. However, due to the lack of extensive test cases, I have only tested it in my case. Do you think this approach is correct?

If possible, can this design replace the ‘aggressive’ code?

The code:

import { Plugin, Selection, TextSelection } from 'prosemirror-state'
import { Decoration, DecorationSet } from 'prosemirror-view'
import { Node } from 'prosemirror-model'

export const cursorPlugin = () => {
  const getDecoration = (doc: Node, selection: Selection) => {
    if (!(selection instanceof TextSelection)) {
      return DecorationSet.empty
    }
    if (!selection.empty) {
      return DecorationSet.empty
    }
    const pos = selection.from
    return DecorationSet.create(doc, [
      Decoration.widget(
        pos,
        () => {
          const cursor = document.createElement('img')
          cursor.classList.add('ProseMirror-separator')
          return cursor
        },
        {
          key: pos.toString(),
          side: -1,
        }
      ),
    ])
  }
  return new Plugin({
    state: {
      init(_, instance) {
        return getDecoration(instance.doc, instance.selection)
      },
      apply(tr) {
        return getDecoration(tr.doc, tr.selection)
      },
    },
    props: {
      decorations(state) {
        return this.getState(state)
      },
    },
  })
}