the proper use of execcommand(“paste”) in a chrome extension

by

Clipboard functionality is a key part of my extension so I’ve seen all the normal problems. On my background page I expose a copy and a paste function and the page itself contains <textarea id="sandbox"></textarea>;

function copy(str) {
    var sandbox = $('#sandbox').val(str).select();
    document.execCommand('copy');
    sandbox.val('');
}

function paste() {
    var result="",
        sandbox = $('#sandbox').val('').select();
    if (document.execCommand('paste')) {
        result = sandbox.val();
    }
    sandbox.val('');
    return result;
}

I’m using jQuery for simplicity but you get the idea. Now any time I want to use the clipboard functionality I simply call the relevant function. Other pages in my extension can access this API via chrome.extension.getBackgroundPage() but you can also use chrome.runtime.getBackgroundPage(callback) if your background page is an event page.

I’m not sure if this is best practice or if such a thing even exists for this functionality yet but this definitely works for me and is very clean.

More Related Contents:

  1. How to wait until an element exists?
  2. Chrome extension – retrieving global variable from webpage
  3. Chrome extension code vs Content scripts vs Injected scripts
  4. How to use jQuery in chrome extension?
  5. Communicate between scripts in the background context (background script, browser action, page action, options page, etc.)
  6. Chrome extension: How to save a file on disk
  7. Injecting javascript variable before content script
  8. How to communicate between popup.js and background.js in chrome extension?
  9. Chrome Extension: Make it run every page load
  10. How can I get selected text in pdf in Javascript?
  11. saving and retrieving from chrome.storage.sync
  12. How to fetch URL of current Tab in my chrome extension using javascript
  13. String compression in JavaScript
  14. Why is chrome.browserAction.onClicked undefined?
  15. Can the window object be modified from a Chrome extension? [duplicate]
  16. I’m getting an error “Tabs cannot be edited right now (user may be dragging a tab)” on tab update/activate/focus event in chrome 91
  17. How to make side panel in chrome extension?
  18. google chrome extension :: console.log() from background page?
  19. ‘observe’ on ‘MutationObserver’: parameter 1 is not of type ‘Node’
  20. Get JSON in a Chrome extension
  21. Update object stored in chrome extension’s local storage
  22. Is there any way of passing additional data via custom events?
  23. How do I send an HTTP request from a Chrome extension?
  24. Sending message to background script
  25. Accessing iframe from chrome extension
  26. How to develop Chrome extension for Gmail?
  27. monitoring history.pushstate from a chrome extension
  28. Retrieving which tabs are open in Chrome?
  29. How to to initialize keyboard event with given char/keycode in a Chrome extension?
  30. Link to chrome:// url from a webpage

Leave a Comment