Ckeditor 5 How To Trigger Copy, Cut, Paste Events Programmatically

Viewed 1308

I've implemented a right click menu to ckeditor. I inserted Copy, Cut, Paste menu items. I want to trigger ckeditor dom events and expect to events catched by ckeditor listeners. But I don't know how to do that.

I tried to run editor.editing.view.document.fire('cut'). After that, in Clipboard.js, onCopyCut method was triggered. But data parameter was undefined. How can I send data parameter and what should I send in data parameter?

1 Answers

You can't make pasting via a custom button possible. Basically, the access to the native copy/cut/paste actions is possible via the native document.execCommand() method:

document.execCommand( 'copy' );
document.execCommand( 'cut' );
document.execCommand( 'paste' );

However, only the copy and cut operations will work. Paste is blocked by the browsers for security reasons.

Therefore, the paste operation can only be triggered by the keystroke or a native "Paste" option (in the context menu or in the menu bar). You can't access the clipboard via your custom context menu today (it probably will change in some future). That's why CKEditor 5 does not override the native context menu (unlike e.g. CKEditor 4 or some other editors).

PS. In Google Docs, the custom "paste" button works (in Chrome) because Chrome comes with a Google Docs Addon preinstalled. It's a trick by Google to workaround the mentioned issue...

Related