copyToClipboardAsync

JavaScript, Browser, String, Promise

Copies a string to the clipboard, returning a promise that resolves when the clipboard's contents have been updated.

  • Check if the Clipboard API is available. Use an if statement to ensure Navigator, Navigator.clipboard and Navigator.clipboard.writeText are truthy.
  • Use Clipboard.writeText() to write the given value, str, to the clipboard.
  • Return the result of Clipboard.writeText(), which is a promise that resolves when the clipboard's contents have been updated.
  • In case that the Clipboard API is not available, use Promise.reject() to reject with an appropriate message.
  • Note: If you need to support older browsers, you might want to use Document.execCommand('copy') instead. You can find out more about it in the copyToClipboard snippet.
const copyToClipboardAsync = str => {
  if (navigator && navigator.clipboard && navigator.clipboard.writeText)
    return navigator.clipboard.writeText(str);
  return Promise.reject('The Clipboard API is not available.');
};
copyToClipboardAsync('Lorem ipsum'); // 'Lorem ipsum' copied to clipboard.

Recommended snippets

  • copyToClipboard

    JavaScript, Browser

    Copies a string to the clipboard. Only works as a result of user action (i.e. inside a click event listener).

  • hashBrowser

    JavaScript, Browser

    Creates a hash for a value using the SHA-256 algorithm. Returns a promise.

  • parseCookie

    JavaScript, Browser

    Parses an HTTP Cookie header string, returning an object of all cookie name-value pairs.