We Keep Coding

Debugging for MS Edge constant reload - how to trigger debugger?

I am debugging some code on the MS Edge browser, but it reloaded twice and showed a "This page is having a problem loading" message after two tries. The page has been tested on IE11 or lower, Chrome, and Firefox with no issues.
I have been having trouble bringing up the debugger during page execution by placing the debugger statement in various parts of the code. I have placed it in the first line of the script in the body tag, I have placed it in the first line of $(document).ready(); and even in the script tag in the header. I am so surprised when none of the debuggers triggered other than the one in IE11 (both Chrome and Firefox did not trigger either). Edge of course still continued on its reload loop and saying that it has a problem loading.
My question is - am I not doing this right? Is there a list of when a debugger; statement will not trigger? And more importantly, how do I trigger it in Edge before it reloads twice and throw the error page (For reference, pulling up F12 after it throws the error page gives the DOM of the error page, which is not helpful.)

This is an issue with Edge where the console seems to crash along with the browser. I have noticed it numerous times during development and have not been able to find a solution.
Check in every other browser on an empty cache and see if you are getting any errors in console. Older versions of Edge, before the last service pack were very flakey so I would suggest making sure your environment is upto date.

How to debug non-dynamic script after dynamic script loads on the same page

This answer https://stackoverflow.com/a/10929430/749227
to this question Is possible to debug dynamic loading JavaScript by some debugger like WebKit, FireBug or IE8 Developer Tool? is spot on for debugging dynamic scripts.
The issue I am facing is that I have a page that has a script on it, and after it loads an ajax request fires which returns with some HTML and a script that get put into the page. With the //# sourceURL=myDynamicDocumentFragment.html bit added, I can debug the dynamic script just fine.
But once it's loaded, then the other script that is part of the outer page that initially loaded goes off the rails. I can set breakpoints on blank lines and can't set them on legitimate lines. The debugger will stop on them but it won't be at the place in the code where I'd expect.
What it appears to be is that the dev tools window is showing the original script, and the debugger itself is running on something else - some updated version of code that includes both the outer page's script and the dynamic script that was added later. Or maybe it just hiccups with respect to line numbers it's displaying and what those map to in the code it's actually running.
I wish I had a good simple code snippet to demonstrate the issue, but I don't. Has anyone seen this, and does anyone know of a way to have Chrome 'refresh' the dev tools scripts/debugger without refreshing the page? (it has to be w/o refreshing the page since things work fine when the page loads - it's only after the dynamic script is dropped in that the wheels come off)
Note: I've tagged with Chrome since that's what I'm using (v 38). I don't know how other browsers fare.

You can find scripts injected into head or evaluated, here is a break point added on youtube evaluated (another js file).
You can find this in chrome as well, adding console.log (click on message shown), and voila you have source code you can add break points.
Here mozila print debugging/breakpoint over evaluated script on utube page:
Update
Sorry, I understand chrome was out of the scope, my engrish :)
How I did debugging on chrome over injected scripts, but there are cases when you cannot attach to execution if script is active (page load plus few milliseconds), you need to search for workarounds.
Added this at the begin of the script injected:
//# sourceURL=jseinjectedsource.js
console.log("evaluated");
and voila console:
Better check this way better than my explanation chrome developer

Check to see if your script is using a source map (if you're using TypeScript this is typically on by default for VS projects).
I've found Chrome to be really bad with source maps, often refusing to update them, or stop displaying them after the source map line is removed from the code.

Chrome: window.print() print dialogue opens only after page reload (javascript)

I am facing a really weird problem. I am calling window.print() from a javascript file. This is working fine in Safari, IE, Firefox... and until two hours ago it worked in Chrome, too. (Version 29.0.1547.57)
I did not change anything essential in my javascript file (really - I just removed some comments...), but what now happens is really weird: In Chrome, the print dialogue does not open when window.print() is called. Nothing happens. But then, when I press reload, the print dialogue opens immediately.
The behaviour in the other browser did not change. And while debugging in Chrome I can see that window.print() is called as expected and the script goes on after that. Only the print dialogue is not shown until pressing reload.
Has anybody ever experienced something like that? I also tried to call window.print() in setTimeout(), but this did not change anything. When I debug the content of the page which shall be printed appears to be perfectly loaded.
I am sorry to ask, but I did not find anything while researching. Any help would be appreciated!
Thank you!

Wasiim is right, there is a Chrome bug where window.print() does not work when there is a <video> tag in the DOM. I solved it by calling this function:
function printPage() {
window.print();
//workaround for Chrome bug - https://code.google.com/p/chromium/issues/detail?id=141633
if (window.stop) {
location.reload(); //triggering unload (e.g. reloading the page) makes the print dialog appear
window.stop(); //immediately stop reloading
}
return false;
}

From my experience this is due to continued background traffic, e.g. ajax calls and the like that prevent Chrome from feeling the that page is loaded completely. The reload breaks all traffic and thus the print dialog pops up.
This is a particular gotcha in Visual Studio 2013 where BrowserLink continually ticks away in the background.
This can be tested by disabling BrowserLink via the setting below:
<configuration>
<appSettings>
<add key="vs:EnableBrowserLink" value="false"/>
</appSettings>
</configuration>

I have exactly same problem with Chrome. You need to manually reload page:
Print

If by any chance someone is using VS2013 with chrome, this problem is caused by the BrowserLink funcionality.
see SO answer here

Similar behavior in Safari. It is caused by opened HTTP request(s) on background.
When any HTTP request is in progress, window.print() is executed successfully, but no dialog is opened!
You will have this issue, when you use a long polling (for server push). Because client will have already opened HTTP connection for a long time, window.print() will never work.

I am most certain you are experiencing this issue because you have a video element on your page - most probably an MP4.
If you disable this video / or have an OGV video instead, the printing should work fine.
It is a bug in chrome itself due to limitations of Chrome's video implementation. It is also important to note that if the user prints manually with ctrl-p / cmd-p, print functions correctly
http://code.google.com/p/chromium/issues/detail?id=141633
Hope this helps :)

Javascript file loading twice

I am having a strange problem in Google Chrome. I am including a js file via script src tag. I place alert('test') in the file and when I load the page in Chrome, It alerts twice. In every other browser it alerts once. Is there any known cause for this?
Here is the code that loads the JS:
<script type="text/javascript" src="/js/main.js"></script>
It appears this happens in Safari as well. Does not occur in IE and firefox.

I had this recently and eventually found out it was a chrome extension, specifically the cache killer extension

This might be helpful
Webkit browsers (Chrome, Safari) are loading pages redirected from .htaccess twice!

I've noticed this same problem in Chrome. I have some code that runs when the page loads and I have an alert inside that code. In every browser other than Chrome this code is run once, thus the alert displays once. In chrome the alert shows twice. I am not doing anything special, just running code when the onload event is triggered within <body onload="somefunction()">. I am not using links, iframes, or the Cache Killer extension. I tested it in Safari and the code is only being called once. This seems to be a Chrome specific problem.
I did some research and it appears this is a bug with Chrome. I found this link https://code.google.com/p/chromium/issues/detail?id=64810
Depending on your specific situation, this page may give you a work around for the problem.
The problem does not seem to be fixed as of yet.

Javascript function that check if the browser is loading a webpage (Firefox Extension)

I am writing a Firefox Extension and I need a JS/AJAX function that checks if a webpage is loading in the browser. I already tried this:
while(!document.getElementById(webpageElementId)){};
but this turn into an infinite loop and Firefox just freeze. I need a script/loop that is checking if the webpage is loading without freezing the Firefox window, and letting the webpage load.
I searched almost everywhere and didn't find anything useful.
Thanks for help!

Have a look at Web Progress Listeners.