Ever wondered how to implement copy and paste functionality in any of your web applications?
yes , I have
It is pretty much easier than it sounds , we only have to access the navigator.clipboard object to perform this.
1 copy
navigator.clipboard.writeText(e.target.value);
And that's all you need to copy whatsoever to the browsers clipboard
2 paste
This is almost same as the previous
navigator.clipboard.readText().then((text)=>console.log(text))
and there you have it , what you copied in your browsers console.
Easy peazy!!!
Top comments (4)
Both
writeText
andreadText
methods are returningPromise
objects. Could you post full code that is able to print the copied text in console log?or
Copy either of the snippets into the Chrome DevTools console panel and run it. Then you have 5 seconds to select and copy something before it appears in the console when the timeout expires.
MDN: Clipboard.readText() - Example
yea this is awesome content...
The navigator.clipboard.readText returns a promise ....
so listening for a promise and pasting into the console after five seconds is great , because by then the promise most have resolved...
Kudos!!!
peerreynders posted an awesome content about this issue ,I advice you reference it below