16

If I have a breakpoint in a loop or frequent interval I can't refresh chrome without forcing a reload with ctrl-r.

Hitting F5/clicking the refresh button will do a normal refresh, loading just the modified content, unless the debugger has paused on a breakpoint in which case the debugger continues. Holding/spamming F5 just cycles through breakpoints and I can't refresh the page after spotting a bug and making code changes. I'd prefer not to do a full reload (ctrl-r) because I have images and other content that get cached and don't need to be re-downloaded.

One solution is to close the debugger, refresh and then open the debugger. However, the JS then gets a chance to run before the debugger is back up. I then have to refresh again so the JS runs from the beginning.

Has anyone found a workaround?

It could be just me, but I frequently want to make changes to my code and debug it at the same time.

  • Refresh: F5

  • No, actually refresh: hammer+F5?

jozxyqk
  • 16,424
  • 12
  • 91
  • 180
  • Seems there is no way to do so. When I want to edit code during debugging I just type new code in console and run it. Yes, the problem usually is that I can loose the code, but I don't know another way. – Hayk Mantashyan Mar 11 '14 at 09:27
  • I'm not sure I quite understand, since `ctrl+r` is a normal reload in Chrome, and for me the F5 button just refreshes. Anyway, one solution would be to make the changes in the debugger tool, hitting `ctrl+s` and watch Chrome recompile the JS, after which it will reenter the loop to the same point. – gpgekko Mar 11 '14 at 09:42
  • @gpgekko OK, so I should change my question to *refreshing*, rather than reloading a page. A refresh [may still get modified content though](http://stackoverflow.com/questions/385367/what-requests-do-browsers-f5-and-ctrl-f5-refreshes-generate). If I'm going to the trouble of copy/pasting code to chrome I may as well just `ctrl-r`. – jozxyqk Mar 17 '14 at 00:49
  • @gpgekko Maybe it's this reenter-loop feature of chrome that's breaking things for me. Is there a way to tell chrome not to do this and restart from the beginning? – jozxyqk Mar 17 '14 at 04:01

6 Answers6

5

What works for me is to CMD + R (I'm on OS X) then F8.

It seems that reload is done only after you pass the current breakpoint.

avetisk
  • 11,651
  • 4
  • 24
  • 37
  • It could just be me but using ctrl-R seems to be like shift-refresh, ignoring cache and taking longer to load. With a normal refresh/reload, passing the current breakpoint for me just goes straight to the next one (or next exception, which ever is first). Maybe I'll just have to wait for google to fix their interface issues :( – jozxyqk Mar 11 '14 at 12:26
  • Maybe you have checked "Disable Cache (while DevTools is open)" in DevTools settings? https://developers.google.com/chrome-developer-tools/docs/settings – avetisk Mar 11 '14 at 14:13
  • Good thinking! This isn't checked, but maybe I've set some other option somewhere I shouldn't have. I'll go looking. – jozxyqk Mar 12 '14 at 06:10
  • Maybe you should also check if you haven't set some weird flags on in chrome://flags – avetisk Mar 12 '14 at 13:20
4

Have you tried running the following from the Console?

window.location.reload()

What would reload only the content of the page, and not web inspector.

thinkbigthinksmall
  • 894
  • 5
  • 10
  • 19
  • window.location.reload() reload the content of the page and also the developer tools. This answer is not a solution to the original question. – ElChiniNet Jun 28 '16 at 11:10
3

Right click on refresh button. Then choose one of the reload options.

Munteanu Sergiu
  • 391
  • 1
  • 10
1

A simple solution could be to use the "Deactivate breakpoints" button. This will let the flow happen without stopping.

Then you can use the F5 to just reload the changes.

UPDATE

Given you want to have breakpoints enabled as soon as you load the page, you can do following.

  1. Set a global flag = true in your page. Say, window.shouldbreak = true;
  2. Set up your breakpoints as "conditional breakpoints" as described here Chrome Dev Tools Debugging Javascript. Of course your condition will be if(window.shouldbreak === true) then break else proceed.
  3. Run your regular debugging flow.
  4. Once done. In console set window.shouldbreak = false; Now the debugger won't stop at any of the breakpoints for current session.
  5. On page reload with F5, because the variable is set again in the page, you have your breakpoints working again
Anshul
  • 5,378
  • 2
  • 19
  • 18
  • This will work but is quite similar to deactivating dev tools and still has the problem that I need to have breakpoints enabled again as the page reloads and begins running my JS. I guess I could add a delay or start button. This just feels more and more like a bug in chrome (or perhaps bug in design). – jozxyqk Mar 19 '14 at 02:01
  • Cool idea! Don't think it'll work for errors/exceptions, but I'll take what I can get. – jozxyqk Mar 19 '14 at 08:36
1

This is to echo @Munteanu Sergiu's answer. Here is a screenshot on OS/X.

enter image description here

Tzunghsing David Wong
  • 1,271
  • 14
  • 10
0

In Chrome, Debug Toolbar, go to settings icon at the bottom left corner (or on the toolbar header) and choose disable cache. then try reloading.

Prakash S
  • 1,695
  • 3
  • 11
  • 20