Copy Array/Object to your clipboard with browser built-in Developer Tools

Lukas Polak
1 min readNov 12, 2018
We Are Developers — Speakers page

TL;DR: If you want to copy an array or object directly to your clipboard, you can use a Command-Line API function copy() that will “copy a string representation of the specified object to the clipboard.”

Exercise

1.
Go to the We Are Developers Speakers website and open the web console

2.
Declare a variable with an empty array. Don’t be afraid of undefined. It’s because all you are doing is declaring a variable.
let speakersArr = [];

3.
Find every occurrence of speaker name, in this case, it is a
.team-meta h3. Then every element that was found should be converted do Array (now it is a NodeList).
const speakersElements = Array.from(document.querySelectorAll('.team-meta h3'));

4.
Map through every speaker and push the speaker textContent to speakersArr declared at the top of the page

speakersElements.map(speaker => {
speakersArr.push(speaker.textContent);
});

5.
Copy the result to your clipboard
copy(speakersArr);

6.
When you paste the code it should look like this:
[“Steve Wozniak”, …, “Eric Steinberger”]

7.
That’s it. Pretty simple right? Thanks for the reading. You can find the code here.

--

--