TinyMCE - Chrome browser - Can't paste images in Chrome as in FF

Question

I'm using the TinyMCE WYSIWYG editor control and while it is possible to copy and paste image fractions in FireFox, it is impossible in Chrome.

I've tried upgrading to TinyMCE ver. 4.0.16 (previously had ver. 3.5.8) with still no possible way to make it work.

Has anyone been able to do this?

Example to how this looks in FireFox:

Thanks in advance!

Answer 1

I found a solution for this issue, and it has been tested using Chrome v 47. Here is what you have to do:

function pasteHandler(e) {
   var cbData;
   if (e.clipboardData) {
      cbData = e.clipboardData;
   } else if (window.clipboardData) {
      cbData = window.clipboardData;
   }

   if (e.msConvertURL) {
      var fileList = cbData.files;
      if (fileList.length > 0) {
          for (var i = 0; i < fileList.length; i++) {
              var blob = fileList[i];
              console.log("Image blob: " + blob);
              readPastedBlob(blob);
         }
     }
 }
 if (cbData && cbData.items) {
     if ((text = cbData.getData("text/plain"))) {
         // Text pasting is already handled
         return;
     }
     for (var i = 0; i < cbData.items.length; i++) {
         if (cbData.items[i].type.indexOf('image') !== -1) {
             var blob = cbData.items[i].getAsFile();
             readPastedBlob(blob);
         }
     }
 }

function readPastedBlob(blob) {
    if (blob) {
        reader = new FileReader();
        reader.onload = function(evt) {
            pasteImage(evt.target.result);
        };
        reader.readAsDataURL(blob);
    }
}

function pasteImage(source) {
    var image = "<img src='" + source + "' data-mce-selected='1'></img>";
    window.tinyMCE.execCommand('mceInsertContent', false, image);
}}

In the init method of you tinyMCE:

tinymce.init({
    selector: "textarea", // change this value according to your HTML
    paste_data_images: true,
    setup: function(editor) {
        editor.on('paste', pasteHandler)
    };
})

Answer 2

I've just got this working.

Remove "Paste" from the plugins list and set "paste_data_images: true"

Works a treat!