16

This has been a problem for a long time and I've never found a solution for it and while other questions on here are similar, they are not exactly what I'm seeing.

The problem is that the SOURCE used to step through the code does NOT refresh on every page load. Yes, I have disabled the cache - but it is not the browser cache that is the problem, it is the DEBUGGER SOURCE cache.

In my webapp (Struts2 and Tomcat), I have the main page with title bar and left the menu. The center content is an iframe that loads all the appropriate JSPs. I use one 'action' for most of my navigation with different results displaying different pages. The problem is that the NAME in the chrome debugger SOURCES pane does not change as I navigate. The actual page changes, but since the name doesn't change, Chrome does NOT bring the new source into the debugger window. So what happens is if I have 'debugger;' on line 200 in the page being loaded, it stops, and shows the 'source' - but its the OLD source at line 200, not the actual source that is running! If I right-click on the old source file in the SOURCES pane, and "Reveal in Network panel" the real source is shown here as it really was loaded from my server, BUT the debug source does NOT change.

Question: How do I get around this bug in Chrome and force the source to reload in the debugger display?

UPDATE: No, this is not the same as that other question. The answer by David Fahlander seems to fit what I'm saying. The ACTUAL javascript source IS refreshing and is shown correctly in the RESOURCES and NETWORK panes. But in the SOURCE pane where actual debugging is done, the new source is NOT refreshed. And its hard to debug code you cannot see!

Towkir
  • 3,889
  • 2
  • 22
  • 41
user3708842
  • 543
  • 8
  • 23
  • 1
    Possible duplicate of [How to force Chrome's script debugger to reload javascript?](http://stackoverflow.com/questions/7078953/how-to-force-chromes-script-debugger-to-reload-javascript) – Andrea Ligios Feb 25 '16 at 16:39
  • 2
    Thanks, but no, its not a duplicate, and those answers do not help. I updated above. – user3708842 Feb 25 '16 at 16:58
  • 1
    I've retracted the close-vote – Andrea Ligios Feb 25 '16 at 17:04
  • 1
    I've the same issue, the scripts are been loaded and are up to date but on the source tab they are not. This is specially annoying when trying to use chrome debugger. – Flavio Aug 17 '17 at 17:47
  • 1
    Save issue here. The most updated version doesn't help either. And please notice, I've already set disable cache in the network panel. But the source panel still identical with the previous version. Really annoying. – tommy.qichang Jul 16 '18 at 13:54
  • Can you post some repo steps? I've been debugging a ton in chrome lately and have not run into this issue. Been changing JavaScript in many files both on the main page and in workers and no issues. If there are a set of specific step that will repo the issue then it will likely be easy to find a workaround or file a bug. A video or gif showing you going through all your steps would be helpful too. MacOS and Windows both have screen recording software built in. – gman May 28 '19 at 16:08
  • Maybe try the old fashioned method of adding an URL query parameter with, say current time in ms? Something that your app will ignore, but Chrome will treat it as a new page? e.g. https://example.com?time=1594125425508 – stevenmcgovern Jul 07 '20 at 12:37
  • For anyone passing by, I would like to add that if execution is stuck at a breakpoint and if you happen to use a live reloading feature of your IDE, as in VSCode, then you need to remove that breakpoint and then reload for the new source. Also, check Chrome's hard reload option. – Subham Burnwal Oct 27 '22 at 19:40

2 Answers2

1

To append JavaScript code once the loading process is complete, this technique is employed in Chrome extensions and is amenable to debugging.

let script = document.createElement('script');
script.innerHTML = 'your javascript code ';

document.head.appendChild(script);
0

Maybe try the old fashioned method of adding an URL query parameter with, say current time in ms? Something that your app will ignore, but Chrome will treat it as a new page? e.g. https://example.com?time=1594125425508