Chrome Dev Tools - Can you undo changes in the console?

Question

If you enter a command in Chrome Dev tools (which could be one big block of code) and hit enter, is there a way to "undo" changes made to the DOM? Or do you simply have to refresh the page?

Answer 1

I too was looking for an answer to this question beyond "refresh the page"... Stumbled across this solution:

1. Enter Chrome dev tools (CMD + Shift + I on Mac)

2. Click the three dots aligned vertically to get the settings menu

3. Hover over "More Tools" then go to "Changes"

4. On the changes window you can see all the changes made during your current DOM editing session - to revert them all, simply click the undo arrow in the bottom left...

See the visual below

Reset all changes made in Chrome dev tools

Answer 2

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