All NodeViews destroyed when one is clicked

1

Hey everyone!

First and foremost, thank you not only for this amazing library, but also helping me learn a transaction based architecture. I love it.

I am incorporating React into my NodeViews via portals. I pass a callback into the NodeView’s constructor that can add/remove a portal to an array in the main component, which renders the portals.

One example of such a NodeView is a timestamp view that displays a certain date and can be adjusted via a dropdown.

Here’s my problem:

  1. I can have as many of these timestamp views in one paragraph.
  2. It also works if I have two paragraphs.
  3. But for any paragraph that is not the first or the last, I can’t open the dropdown anymore.

What I’ve observed:

  • I checked which methods are called in the NodeView. Interestingly enough, it’s not the update method, but all constructors and destroy methods that are called any time I click on the component.
  • I don’t understand this behavior at all. I am not updating any attribute when opening/closing a dropdown (though, I set an internal React state to track the dropdown’s state).

Additional details:

  • Since I don’t want any events to be handled by ProseMirror when making entries in the NodeView (e.g., pressing backspace), stopEvent returns true for all events.
2

That is not how the library behaves by default. It likely is caused by your setup mutating the DOM for these somehow, which will cause the editor to think the node views are damaged and need to be re-rendered. Look into the ignoreMutation method.

3

You are right, the DOM is changed … however ignoreMutation: () => true won’t change anything. I will investigate further…however at this time I am kinda lost