search

arnog / mathlive

A web component for easy math input
https://cortexjs.io/mathlive
MIT License
1.27k stars 261 forks source link

Errors in the console when pasting in a sandboxed iframe and paste does not work #2343

Open RambabuPatina opened 3 months ago

RambabuPatina commented 3 months ago

Description

The 'Paste to Clipboard' option does not paste and showing errors in the console when pasting in a sandboxed iframe

Steps to Reproduce

  1. Include the editor in a iframe and include virtual keyboard
  2. Copy some text and click on virtual keyboard
  3. Click on 'Paste from clipboard' Screenshot 2024-04-08 at 5 09 26 PM

Actual Behavior

The paste behaviour does not work and shows errors in the console:

[Violation] Permissions policy violation: The Clipboard API has been blocked because of a permissions policy applied to the current document. See https://goo.gl/EuHzyv for more details. Uncaught (in promise) DOMException: Failed to execute 'readText' on 'Clipboard': The Clipboard API has been blocked because of a permissions policy applied to the current document. See https://goo.gl/EuHzyv for more details. at Object.pasteFromClipboard [as fn]

Expected Behavior

Paste from clipboard should work and No error messages

Environment

MathLive version 0.97.1

macOS/Windows, Chrome/Firefox

arnog commented 3 months ago

Does this happen with the current version (0.98.6)?

RambabuPatina commented 3 months ago

Checked with 0.98.6 version, same issue facing. Do we need additional changes to work in the iframe? Thanks in Advance

RambabuPatina commented 2 months ago

Hi @arnog , Any clue on the issue?

arnog commented 2 months ago

Not yet, and I will need to build a project to try to reproduce the problem before I can debug it.

rkanumola commented 2 months ago

Any update @arnog ? One of our releases is based on this. Thanks

arnog commented 2 months ago

It would help if you had a project to share that reproduces the problem.

gunnarmein-ts commented 2 months ago

@rkanumola are you loading the iframe from the same location as the container doc?

RambabuPatina commented 2 months ago

@gunnarmein-ts Do you mean location means the domain? The iframe being loaded from other location. I.e the parent document and the iframe domains are different.

gunnarmein-ts commented 2 months ago

This article: https://stackoverflow.com/questions/61401384/can-text-within-an-iframe-be-copied-to-clipboard mentions: "To use the API in iframes, you need to enable it with Permissions Policy, which defines a mechanism that allows for selectively enabling and disabling various browser features and APIs. Concretely, you need to pass either or both of clipboard-read or clipboard-write, depending on the needs of your app."

<iframe src="index.html" allow="clipboard-read; clipboard-write"></iframe>

Can you try that?