Search code examples
angulartinymcetinymce-4tinymce-plugins

TinyMCE editor right click pasting not working


public async ngAfterViewInit(): Promise<void> {
    tinymce.init({
        selector: `textarea#${this.identifier}`,
        menubar: false,
        contextmenu: "copy paste",
        mobile: {
            theme: 'silver'
        },
        readonly: !this.arguments.isEditMode,
        language: this._applicationService.applicationLanguage.replace('-', '_'),
        plugins: 'print autoresize preview fullpage importcss searchreplace autolink directionality visualblocks visualchars fullscreen image link media template codesample table charmap hr pagebreak nonbreaking anchor toc insertdatetime advlist lists imagetools textpattern noneditable help charmap emoticons',
        toolbar: 'undo redo | bold italic underline strikethrough | fontsizeselect formatselect | alignleft aligncenter alignright alignjustify | outdent indent | numlist bullist | insertfile image media link | table | preview fullscreen',
        paste_as_text: true,
        fontsize_formats: '8pt 8.5pt 9pt 9.5pt 10pt 10.5pt 11pt 11.5pt 12pt 12.5pt 14pt 14.5pt 16pt 16.5pt 18pt 18.5pt 20pt 20.5pt 22pt 22.5pt 24pt 24.5pt 26pt 26.5pt 30pt 30.5pt 36pt 36.5pt'}

This is my code when i right click i have copy and paste option in contextmenu copy is working but paste not. How i should do to solve it ?


Solution

  • I don't think you will be able to do what you want on most modern browsers.

    If you try to use the built in Cut/Copy/Paste toolbar buttons or menu options in TinyMCE you see this for most browsers:

    "Your browser doesn't support direct access to the clipboard. Please use the Ctrl+X/C/V keyboard shortcuts instead."

    As the message from the editor states this is simply a limitation of what you can / cannot do directly via JavaScript in certain browsers.

    Imagine what you could do if your arbitrary JavaScript could access the clipboard whenever it liked? "Bad people" don't play by the rules so what if (upon loading a web page) they had JavaScript that grabbed everything from the clipboard and sent it to their servers?

    Over time the browser manufacturers realized that direct access to the clipboard was "bad" ... by having the user type CRTL+C and CRTL+V you are effectively telling the browser you want it to access the clipboard.

    IE11 does indeed allow access via legacy APIs but no other browser at present supports the clipboard APIs at all so the only way to copy what is in the clipboard is to use the keyboard.

    Note: Using copy to place something in the clipboard works in a broader set of browsers but programmatically accessing the clipboard to get its content (the first step in paste) is not going to happen in modern browsers for the reasons stated above.