Chrome Dev Tools - Can You Revert Changes To The Console?

If you type in a command in Chrome Dev tools (which can be one big block of code) and press enter, is there a way to β€œundo” changes made to the DOM? Or do you just need to refresh the page?

+5
source share
2 answers

I was also looking for an answer to this question outside of "Refresh Page" ... I came across this solution:

  • Sign in to Chrome Developer Tools (CMD + Shift + I'm on Mac)

  • Click three vertically aligned points to get the settings menu

  • Hover over Advanced Tools, then go to Changes

  • In the changes window, you can see all the changes made during the current DOM editing session - to return them all, just click the undo arrow in the lower left corner ...

See explanation below.

Reset all changes made to Chrome dev tools

+1
source

Depending on what this code actually does. For example, if you change something in style (css) or structure (html), refresh it to show the original page. But if this code changes the value of the cookie, updating is not enough or even closing the browser and opening it again.

0
source

All Articles