Chrome extensions support copy image to clipboard?

Question

I search in goggle and didn't find any answer. The new clipboard API support copy image to clipboard by using document.exec command. If yes, How can I copy image data url to clipboard as image?

I am the developer of Webpage Screenshot extension and I search for a way to copy the image to clipboard. I also search for a way to open the image with specific software.

Answer 1

I am developing a ScreenShotShare chrome extension, I have the need to copy clipped image to clipboard as well. And I found the solution works for me.
1. Add "clipboardWrite","clipboardRead" to the permissions in manifest.json file
2. do copy work in the background.html with background.js
3. add to background.html
4. I implement the "copyImageToClipboard" to function in background.js

copyImageToClipboard: function () {
    var img = $('clipboard-img');
    img.src = localStorage[this.screenshotURIName]; // I store the image URI in localStorage
    var div = $('clipboard-div');
    div.contentEditable = true;
    var range;
    if (document.createRange) {
      range = document.createRange();
      range.selectNodeContents(div);
      window.getSelection().removeAllRanges();
      window.getSelection().addRange(range);
      div.focus();
      document.execCommand('copy');
    }
    div.contentEditable = false;
  }

Answer 2

clipboardData API is almost implemented in all the browser, so instead docuemnt.exec command, you can try below also refer the below link which has similar use case as yours.

https://www.lucidchart.com/techblog/2014/12/02/definitive-guide-copying-pasting-javascript/

clipboardData.setData('text/plain', selection.getText());
clipboardData.setData('application/officeObj', selection.serialize());
clipboardData.setData('image/bmp', draw(selection));
clipboardData.setData('text/html', ...);