NodeView setSelection method makes the cursor dancing

1

While playing with ProseMirror I had implemented a custom paragraph node. My target is to show a menu specific to node type whenever a node receives the cursor: setSelection(anchor, head, root) does indeed get called, but implementing this method results in dancing cursor whenever a mark is applied to any range of text of that node.

NOTE: I am well aware that contentEditable doesn’t allow node’s to have focus so onFocus event is not an option here.

class ParagraphView {
  constructor(node$, view$, getPos$) {

    this.dom = this.contentDOM = document.createElement("p");
    this.viewState = view$.state;

    if (node$.content.size == 0)
      this.dom.classList.add("empty")

    console.log(`${node$.type} has position ${getPos$()}`);
  }

  update(node$, decorations$) {
    if (node$.type.name != "paragraph") return false
    if (node$.content.size > 0) this.dom.classList.remove("p-empty")
    else this.dom.classList.add("p-empty")
    return true
  }

  setSelection(anchor$, head$, root$)
  {

    console.log("lets show a menu as soon as it is called on any curosor changes");

  }
}


export default ParagraphView;
2

A simple example script would be helpful, since I have no idea what you mean by dancing cursor, or what your setSelection method does.

3

edited my post with code block. on overriding setSelection applying any mark sets the selection at the start of node. if however I remove the update::fn the cursor jumps to the end on such operation.

4

Well, I wouldn’t say that you implemented setSelection there—you provide a method, but it doesn’t do anything. It should at least call super to make sure the DOM selection is actually set, if it has a contentDOM and isn’t going to manage selection inside some nested control.

(On second thought, super won’t work there, since the node view is not a subclass of the class that implements the default setSelection. This method exists for components like this, which represent the content as some separate component. I’m not sure what you are trying to do with it, but it probably can’t do that.)