Persist Console logs between page refreshes

Written byPhuoc Nguyen

Tags

DevTools

Created

13 Apr, 2021

Imagine a situation where you print something in the Console when clicking or following a link. When you navigate to another page, the Console is cleared and all the messages are lost.

Fortunately, both Chrome DevTools and Firefox Developer Tools give us options to persist the logs between page loads.

Under the Console panel of Chrome DevTools, click the cog icon on the right, and turn on the Preserve log option:

In addition to the logs of each page, DevTools also lets you know when you navigate to another page. It's easy for us to determine where a log message comes from.

Questions? 🙋

Do you have any questions? Not just about this specific post, but about any topic in front-end development that you'd like to learn more about? If so, feel free to send me a message on Twitter or send me an email. You can find them at the bottom of this page.

I have a long list of upcoming posts, but your questions or ideas for the next one will be my top priority. Let's learn together! Sharing knowledge is the best way to grow 🥷.

Newsletter 🔔

If you're into front-end technologies and you want to see more of the content I'm creating, then you might want to consider subscribing to my newsletter.

By subscribing, you'll be the first to know about new articles, products, and exclusive promotions.

Don't worry, I won't spam you. And if you ever change your mind, you can unsubscribe at any time.

Phước Nguyễn

Persist Console logs between page refreshes

Questions? 🙋

Recent posts ⚡

Newsletter 🔔