deselectNode is called after destroy

#1

I’m using a NodeView with React to render an image with a form. Here is a simplified version:

export class ImageView {
  constructor(node, view, getPos) {
    this.dom = document.createElement("div");
    this.node = node;
    this.view = view;
    this.getPos = getPos;
    this.onSave = newAttrs => {
      this.view.dispatch(
        this.view.state.tr.setNodeMarkup(this.getPos(), null, newAttrs),
      );
    };
    this.renderComponent(node, false);
  }
  renderComponent(node, selected = true) {
    this.select = () => {
      let $pos = this.node.resolve(this.getPos());
      let selection = NodeSelection.create(this.view.state.doc, this.getPos());
      this.view.dispatch(this.view.state.tr.setSelection(selection));
    };
    ReactDOM.render(
      <Image
        src={node.attrs.src}
        alt={node.attrs.alt}
        alignment={node.attrs.alignment}
        select={this.select}
        selected={selected}
        onSave={this.onSave}
      />,
      this.dom,
    );
  }
  update(node) {
    if (node.type == this.node.type) {
      this.node = node;
      this.renderComponent(node);
      return true;
    }
    return false;
  }
  selectNode() {
    this.renderComponent(this.node);
  }
  deselectNode() {
    this.renderComponent(this.node, false);
  }
  stopEvent() {
    return true;
  }
  destroy() {
    const res = ReactDOM.unmountComponentAtNode(this.dom);
  }
  ignoreMutation(e) {
    return true;
  }
}

I assume I’m doing something stupid but when the node is selected and I delete it after destroy successfully unmounts the component the deselectNode kicks in and renders it again (into a non-existent dom node). This way I end up with “ghost” react components.

I use deselectNode to handle selection inside the image component as I have additional elements inside and I want the “blue frame” to show around the image only.

#2

This was fixed a few weeks ago. Try with version 1.8.9.

#3

Thank you. I’ve just checked both 1.8.9 and 1.9.0-prerelease2 and in both the behaviour is the same. The deselect is called after the destroy.

#4

Seems to work for me when I selected a node with a node view and press delete. How are you testing this? And did you verify that you’re really running the upgraded version of prosemirror-view?

#5

There must be something wrong with my setup. I created a short example here. It works as expected. Deselect is not being called after the destroy. I’ll report when I find what is the problem with mine in case anybody stumble upon this thread with the the same issue.

#6

Deleted my node_modules and installed 1.8.9. That one works! It also works with 1.9.0-prerelease3. Thank you!