Google-chrome – How to force Chrome’s script debugger to reload javascript

google-chromegoogle-chrome-devtools

I really like the ability to edit javascript in the chrome debugger however, I find that it can be really problematic getting the debugger to re-fetch the JavaScript from the server.

Sometimes I have to go as far just closing the debugger and reloading the frame works OK – but other times (an dI cannot pin down under what conditions this occurs) I have to clear my temporary internet cache. Sometimes I swear I have to close chrome completely, then clear the cache and then load the page before the debugger finally shows me the most up-to-date script.

(NB. There is no caching of the script by the web server)

I was wondering if anyone knew of a quick and easy way to tell the debugger to invalidate all its javascript and fetch it all anew on page reload?

Best Answer

While you are developing your script, try disabling the Chrome cache.

When you reload the page, the JavaScript should now get refreshed.

Chrome circa 2011

Open settings Disable the cache

Chrome circa 2018

You can also access it on the network tab:

Related Solutions

Javascript – How to launch the JavaScript debugger in Google Chrome

Try adding this to your source:

debugger;

It works in most, if not all browsers. Just place it somewhere in your code, and it will act like a breakpoint.

Javascript – Chrome JavaScript Debugging – how to save break points between page refresh or break via code

You can put a

debugger;

to break in most of the JavaScript environments. They will persist for sure. It's good to have a minifier that rids the debugger and console.log calls for the production environment, if you are using these.

In the recent versions of Chrome browser, there is a "Preserve Log" option on the top of the console panel, next to the filters. In the older versions, right clicking on the empty console window will bring that option ("Preserve log upon navigation"). It's handy when you don't have console.log statements or hard-coded debugger calls.

update: I found a tool on github, called chimney, which takes a file and removes all the console.log calls. it gives a good idea about how to remove debugger calls.