No idea what to do... <Missing editor instance>

[rchrdnsh]

I am trying to add the floating and bubble menus:

<script lang="ts">
  import { onMount } from 'svelte';
  import type { Readable } from 'svelte/store';
  import { createEditor, Editor, EditorContent, FloatingMenu, BubbleMenu } from 'svelte-tiptap';
  import StarterKit from '@tiptap/starter-kit';

  let editor: Readable<Editor>;

  onMount(() => {
    editor = createEditor({
      extensions: [StarterKit],
      content: `Hello world!`,
    });
  });
</script>

<EditorContent editor={$editor} />
<FloatingMenu editor={$editor} />
<BubbleMenu editor={$editor} />

...and I get the following error:

Error: Missing editor instance.
    at eval (/Users/rchrdnsh/Code/Svelte/__active-projects/lstv/node_modules/svelte-tiptap/dist/FloatingMenu.svelte:20:9)
    at Object.$$render (/Users/rchrdnsh/Code/Svelte/__active-projects/lstv/node_modules/svelte/src/runtime/internal/ssr.js:174:16)
    at eval (/Users/rchrdnsh/Code/Svelte/__active-projects/lstv/src/library/editor/SvelteTipTap.svelte:31:251)
    at Object.$$render (/Users/rchrdnsh/Code/Svelte/__active-projects/lstv/node_modules/svelte/src/runtime/internal/ssr.js:174:16)
    at eval (/Users/rchrdnsh/Code/Svelte/__active-projects/lstv/src/routes/tiptap/+page.svelte:20:136)
    at Object.$$render (/Users/rchrdnsh/Code/Svelte/__active-projects/lstv/node_modules/svelte/src/runtime/internal/ssr.js:174:16)
    at Object.default (/Users/rchrdnsh/Code/Svelte/__active-projects/lstv/.svelte-kit/generated/root.svelte:102:133)
    at eval (/Users/rchrdnsh/Code/Svelte/__active-projects/lstv/src/routes/+layout.svelte:34:487)
    at Object.$$render (/Users/rchrdnsh/Code/Svelte/__active-projects/lstv/node_modules/svelte/src/runtime/internal/ssr.js:174:16)
    at eval (/Users/rchrdnsh/Code/Svelte/__active-projects/lstv/.svelte-kit/generated/root.svelte:65:129)

...but I am passing in the editor store, correct?

Don't know what to do next...

Thanks in advance :-)

[sibiraj-s]

You are creating the editor on Mount, You should conditionally render the menu only when editor is present.

Refer here https://github.com/sibiraj-s/svelte-tiptap/blob/master/src/routes/bubble-menu/%2Bpage.svelte for example.

[sibiraj-s]

Moving to as discussion as there is an issue with the package. Let me know if it still doesn't work

[rchrdnsh]

yeah, I just wrapped it in an {#if $editor} and it worked...maybe just add that in the docs, I suppose...