Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Copy to Clipboard Error in Firefox #1063

Closed
luukbox opened this issue Sep 9, 2024 · 5 comments · Fixed by #1160
Closed

Copy to Clipboard Error in Firefox #1063

luukbox opened this issue Sep 9, 2024 · 5 comments · Fixed by #1160
Assignees
Labels
bug Something isn't working prio:high High priority prio:mid Medium priority

Comments

@luukbox
Copy link

luukbox commented Sep 9, 2024

Describe the bug
Firefox does not support the async Clipboard API, causing an error when attempting to copy content from the editor.

To Reproduce

  • Open BlockNote using Firefox
  • Attempt to copy any text from the editor
  • Uncaught (in promise) DOMException: Modifications are not allowed for this document in the console

Workaround
I noticed that createInternalHTMLSerializer and cleanHTMLToMarkdown aren't actually async. Therefore, it seems like selectedFragmentToHTML could be converted to a synchronous function by removing the call to initializeESMDependencies.

In our environment, I was able to do this and tested it successfully with a custom copyToClipboard extension while disabling the default one.

That said, I'm unsure of the exact circumstances when these dependencies are required, or their purpose, so I'm not certain if this is a universally viable solution.

For anyone interested, here is a StackBlitz example demonstrating the workaround.

@luukbox luukbox added the bug Something isn't working label Sep 9, 2024
@luukbox luukbox changed the title Copy to Clipboard Copy to Clipboard Error in Firefox Sep 9, 2024
@matthewlipski
Copy link
Collaborator

Awesome, thanks for providing your code! We did notice this was an issue when first implementing copy/paste but couldn't find a workaround at the time (hence why e2e tests for copy/paste on Firefox are disabled), so even if it requires tweaking it's great to have a something to reference for a fix.

@matthewlipski matthewlipski added the prio:mid Medium priority label Sep 9, 2024
@Dartoxian
Copy link

Thanks @luukbox - this workaround works for me. One minor change I needed was to use const editor: typeof schema.BlockNoteEditor as I'm using a custom schema.

@carlonicora
Copy link

@Dartoxian I tried the same workaroud, but it does not work for me. Is there anything specific you do to make it work?

I have something like this

const schema = BlockNoteSchema.create({
    inlineContentSpecs: {
      ...defaultInlineContentSpecs,
    },
  });

  const editor: typeof schema.BlockNoteEditor = useCreateBlockNote({
    schema,
    initialContent: initialContent
      ? (JSON.parse(initialContent) as PartialBlock[])
      : undefined,
    uploadFile: uploadImage,
  });

and it still does not work.

Thanks a lot

@carlonicora
Copy link

Sorry, in 0.15.9 that works!

@carlonicora
Copy link

In the end the workaround seems to be working to paste something, but it is still present when trying to copy from it

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
bug Something isn't working prio:high High priority prio:mid Medium priority
Projects
None yet
Development

Successfully merging a pull request may close this issue.

5 participants