Multiple LinkBubbleMenus Open Across Editor Instances During Autosave

[vitality82]

Describe the bug

When we render multiple Editor instances on a single page where each editor is equipped with a LinkBubbleMenu, the issue occurs when the LinkBubbleMenu is triggered (Add Link) during an update process (like autosaving). Unexpectedly, this results in multiple LinkBubbleMenus opening up in parallel across all Editor instances, instead of just the one being interacted with.

To Reproduce

https://codesandbox.io/p/devbox/mui-tiptap-demo-forked-g2nxg9

Steps:

1. Start typing in any of the 3 editors
2. Stop typing and right away open the LinkBubbleMenu (Add Link). Make sure to not wait a second due to debounced handler
3. Open the dev console, see that save was success per the console.log "Content saved"
4. Behold, since the LinkBubbleMenu was open during the save, multiple LinkBubbleMenu popups are now open.

Expected behavior

When an editor instance's autosave is triggered while a LinkBubbleMenu is open, the expected behavior is that only the relevant LinkBubbleMenu for the active editor instance should remain visible and functional. No other Editor instance should now display duplicate LinkBubbleMenus.

Screenshots

System (please complete the following information)

• mui-tiptap version: 1.8.7
• tiptap version: 2.0.4
• Browser: Chrome
• OS: macOS 14.4.1

[vitality82]

@sjdemartini is this related to TipTap?

[vitality82]

@sjdemartini how hard is it to click on the link above and reproduce the bug? I've literally used the exact format you require here, and made sure the bug description is as pragmatic as possible. 🤷‍♂️

[sjdemartini]

@vitality82 Please refrain from rude comments in this project. I have a lot going on in my personal life and at work, so have not had a chance to look at this, but I did have it on my to-do list. I created this project free and open source as a benefit to a wider community, in case it's useful. It is not my profession to be working on this project and to be investigating new feature requests or issues for any particular person who makes a GitHub issue, though in general I try to get to things in a reasonable amount of time. I haven't been hired to do any particular work / don't have a sponsorship model for mui-tiptap, and I have very limited bandwidth. I may look at this next month when I have more time but don't expect to do so sooner. While I appreciate that you filled out the bug report thoroughly, in general showing respect is more likely to yield better outcomes.

[vitality82]

Mea Culpa, no rude intentions. I had you tagged before and since there was nothing added (no label or reaction), this ticket felt as a lost cause and was worried it falling through the cracks.

I'll share an update once I've fixed this.
Thanks!

[vitality82]

In case it's useful to someone, here's a cowboy workaround fix. Basically before the autoSave triggers making sure to close any open Link dialog. It's not ideal but seems to avoid the pesky issues mentioned above.

const debouncedOnChange = useDebouncedCallback(() => {
    const content = editor?.getHTML();
    if (content !== editorContent) {
      setEditorContent(content);
      if (onContentChange) {
        editor.commands.closeLinkBubbleMenu();
        onContentChange(content);
      }
    }
  }, 700);