How to Copy a Big Object or Array From Console to Clipboard
Vitor Paladini

Vitor Paladini @vtrpldn

About: A software engineer that really likes working with user interfaces. Writes mostly JS at getcircuit.com. Loves cooking.

Joined:
May 18, 2019

How to Copy a Big Object or Array From Console to Clipboard

Publish Date: Sep 3 '20
91 15

Have you ever found yourself trying to Ctrl-C a console.log() output, only to get mad when it doesn't really work with long Objects and Arrays?

Gif showing a failed attempt to copy a big object

Here's what you should do instead:

1 - Right-click the console.log() output
2 - Click "Store as global variable"
3 - Run copy(temp1)
4 - Ctrl-V it wherever you want

Gif showing how to copy a long object

Success! You may find that useful when debugging complex data structures or request payloads.

Let me know in the comments what else copy() might be useful for! 😄


Cover photo by Paolo Nicolello on Unsplash

Why the cover photo is a monkey? Well, I make the same face when I'm debugging.


Hey, let's connect 👋

Follow me on Twitter and let me know you liked this article!

And if you really liked it, make sure to share it with your friends, that'll help me a lot 😄

Comments 15 total

  • Marcell Cruz
    Marcell CruzSep 3, 2020

    Great tip, but I think the gifs are a little bit too fast

    • Vitor Paladini
      Vitor PaladiniSep 3, 2020

      Thanks for feedback, Marcell. I thought that would be the case...

      I speed them up to decrease the overall frame count making each gif lighter, but I agree that it is looking a little intense 😬

      I'll fix them and update the post, thanks!

  • Madza
    MadzaSep 3, 2020

    A neat little trick that could come in handy at times 🔥👍

    • Vitor Paladini
      Vitor PaladiniSep 3, 2020

      I'm stealing "neat little trick" for the name of this series, thanks 😄

      • Madza
        MadzaSep 3, 2020

        I feel a lot of 🔥🔥🔥 coming in the future! 💯

  • Abdisalan
    AbdisalanSep 3, 2020

    Very useful! Thanks 👍🏾

  • RamMohan
    RamMohanSep 3, 2020

    Definitely It will reduce my frustration while I'm debugging the code 👌

  • lionel-rowe
    lionel-roweSep 3, 2020

    Awesome tip, I never knew about copy before! In your example, you don't need to Store as global variable though — you could just copy(bigObject) directly.

    • Vitor Paladini
      Vitor PaladiniSep 3, 2020

      You're right! I've created bigObject so I could simulate something like:

      fetch('http://example.com/movies.json')
        .then(response => response.json())
        .then(data => console.log(data.bigObject));
      

      but I'm glad you caught that 😄

  • Claudio Cortese
    Claudio CorteseSep 4, 2020

    Nice tip, never heard of copy before!

  • Jon Randy 🎖️
    Jon Randy 🎖️Sep 4, 2020

    Or just use Firefox, right click and 'Copy object'. Firefox's dev tools really are better than Chrome's IMO

  • bravemaster619
    bravemaster619Sep 4, 2020

    Good tip! My hack was this:

    JSON.stringify(temp1);
    
    Enter fullscreen mode Exit fullscreen mode

    with Command C, V.

    Very uncomfortable compared to copy method

  • amegabosco
    amegaboscoSep 5, 2020

    Amazing ! Can you please share the tool used to generate the gif capture ?

    • Vitor Paladini
      Vitor PaladiniSep 5, 2020

      Of course! I've used Kap for capturing it and Gif Brewery for optimizing it and making it faster 😄

Add comment