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

Pasting an URL that has been copied from the browser doesn't trigger any clipboard matcher #4421

Open
jpbecotte opened this issue Sep 24, 2024 · 2 comments

Comments

@jpbecotte
Copy link

If you add matchers with the clipboard module, they are not triggered when pasting an URL that has been copied from the URL bar of the navigator (Google Chrome on Mac).

If you type a valid URL in the editor, then select it, copy and paste, the matcher is triggered.

Steps for Reproduction

  1. Visit quilljs.com
  2. Copy the URL from any opened tab of your browser (can be the actual tab the you are at the moment).
  3. Paste in editor.

Expected behavior:

The following text should be inserted in the editor: 'I just pasted this: ' + (the actual URL copied).

Plus, in the console, there should be a log saying: 'OK. This is a text node' or 'OK. This is an element node'.

Actual behavior:

None of the matchers are called. But the URL appears in the editor (which is not the wanted behavior, we want to catch the URL and format it).

Platforms:

Mac OS (14.3.1), Chrome for MAC (128.0.6613.138).

Version:

2.0.2

Run Quill.version to find out

@compmaster
Copy link

compmaster commented Sep 24, 2024

Duplicate of #4406. See also discussion #4418.

@compmaster
Copy link

compmaster commented Sep 30, 2024

Workaround

quill.container.addEventListener('paste', ev => {
  const text = ev.clipboardData.getData('text/plain');
  ev.preventDefault();
  const html = `<p>${text}</p>`;
  const clipboard = quill.getModule('clipboard');
  clipboard.dangerouslyPasteHTML(quill.getSelection().index, html);
}, true);

Anyway, the correct way to implement such feature is to listen text-change event.

quill.on('text-change', delta => {
  delta.ops = ...
});

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

2 participants