Skip to content

November 12, 2018

Copy a String Representation of the Specified Object to the Clipboard with Chrome Devtools

Quick tip how to copy a string representation of the specified object to the clipboard with Chrome DevTools

TL;DR: If you want to copy a string representation of the specified object to the clipboard, you can use a Command-Line API function copy().

Exercise

Go to WeAreDevelopers World Congress Speakers website, open the developer tools and follow the code bellow

index.js
// NodeList of document's elements that match the selectorsconst speakers = document.querySelectorAll('.speakercolumn .title-heading-left')
// Create an Array from NodeList, because NodeList is not iterable with `map()`const speakersArray = Array.from(speakers)
// Iterate through `speakersArray` to get `textContent` from every speaker (item of array)const speakerTextContent = speakersArray.map((speaker) => speaker.textContent)
// copy the final result to clipboardcopy(speakerTextContent)
index.js
// The same function as above but without constantscopy(  Array.from(    document.querySelectorAll('.speakercolumn title-heading-left')  ).map((speaker) => speaker.textContent))

That’s it. Pretty simple right? Thanks for the reading.