Duplicate use of selection JSON ID gapcursor

[justinbalaguer]

What’s the bug you are facing?

installing @tiptap-pro/extension-details extension shows this error
Uncaught RangeError: Duplicate use of selection JSON ID gapcursor

Which browser was this experienced in? Are any special extensions installed?

Microsoft Edge, installed @tiptap-pro/extension-details

How can we reproduce the bug on our side?

install @tiptap-pro/extension-details

Can you provide a CodeSandbox?

No response

What did you expect to happen?

no error

Anything to add? (optional)

No response

Did you update your dependencies?

• Yes, I’ve updated my dependencies to use the latest version of all packages.

Are you sponsoring us?

• Yes, I’m a sponsor. 💖

[zanemcca]

This issue is actually quite broad and could be very problematic.

Prosemirror packages will often have some local runtime cache or they will use instanceOf checks or they will generate some id field that is used later on that will break when there are multiple copies of the package installed.

Long story short there should only ever be a single copy of virtually any prosemirror- lib in any given project. The way prosemirror packages are listed as dependencies instead of peerDependencies in tiptap and hocuspocus will result in situations where npm cannot deduplicate packages so it will add two copies. Whenever this happens things will break. In my experience I have found that things usually break in far more insidious and less insightful ways than this particular error.

To resolve this all prosemirror packages at all levels in hocuspocus and tiptap should be peerDependencies not dependencies.

Workaround

To work around this issue I have been adding offending packages to the overrides section of my package.json.

This is not a good solution though as it can still result in issues. For instance my code uses @hocuspocus/transformers which uses @tiptap/starter-kit which uses @tiptap/extension-gapcursor which then uses prosemirror-gapcursor. I have fixed my @hocuspocus/transformers packages to a specific version and I have added prosemirror-gapcursor to a specific version as well with overrides in place. However since @hocuspocus/transfomers allows for any version of @tiptap/starter-kit above a certain level I ended up with a newer than desired @tiptap/starter-kit which had a hard requirement for a newer version of prosemirror-gapcursor. That was all too much for the fairly new overrides option to sort through so it installed multiple copies of my override instead of a single deduplicated copy.

That was all likely a little confusing and hard to follow but the big take away is that package managers are just not up to the task of flattening prosemirror packages in a bullet proof way when they are listed as hard dependencies. PeerDependencies are a must have to truly avoid these problems.

[zanemcca]

PS for those who are stuck the workaround I laid out above will still be useful even if you hit issues like I did. In my case I had to add a specific version of @tiptap/starter-kit to my overrides as well as the prosemirror-gapcursor.

[zanemcca]

I also want to point out that it it's core this is the same issue as these other one that have been reported in the past #577 & #2836 and experience with prosemirror tells me that there will be more of these in the future.

[zanemcca]

This really needs to be addressed and the solution is to move all prosemirror packages to peerDependencies. Prosemirror can and will fail when there are duplicate packages and using package.json overrides is a faulty solution.

We have had our app break all of a sudden because one or more prosemirror packages have duplicated themselves. This has been happening more and more often specifically because of tiptap's multiple package structure with @tiptap/starter-kit being the biggest issue by far. @tiptap/starer-kit includes @tiptap/core which then locks in several prosemirror packages. Since the starter-kit is used all over the place the whole dependency tree quickly becomes either a mess of duplications or a delicate balance of strict package numbers. In our current case this is an untangleable mess of duplicate packages because of the previously mentioned NPM overrides issue.

Please transition to peerDependencies! I am unfortunately very familiar with this issue and I can guarantee you it is a much larger and more severe issue than you would expect. Most plugins will not properly complain about this like the gapcursor one is. Most will just implode.

[svenadlung]

We recently made changes to include ProseMirror packages as peer dependencies.

An update of the Tiptap/Tiptap Pro packages and the manual installation of the necessary ProseMirror packages should hopefully solve the problem (https://tiptap.dev/installation#1-install-the-dependencies).

Please let me know if the problem still exists.