I have the following scenario:
- Main page
- Nested page
- Common JS file (which is included in both pages)
The nested page is subsequently loaded into an iframe of the main page. Both pages invoke a function from the common JS file on page load.
Live demo:
http://www.ecmazing.com/misc/pause-execution/mainpage.html
http://www.ecmazing.com/misc/pause-execution/nestedpage.html
http://www.ecmazing.com/misc/pause-execution/common.js
The common JS file contains one global function which paints the H1 element red. I would like to pause execution at the beginning of that function, so that the execution is paused while the H1 element is still black.
How to do it on the main page:
This is trivial. Simply load the page, open the dev tools of the browser, select the common.js file, and set a break-point at the first line of the function. Now, reload the page. The break-point will persist the reload, and execution will be paused.
How to do it on the nested page:
Now, in Chrome and Firefox (Firebug), the break-point that was set above (for the main page), will also work for the nested page. Both pages use the same JS file, and setting a break point in that file will apply for both pages automatically. Unfortunately, this rule does not apply to IE.
And even worse, even if I set the break point subsequently, and then reload the iframe only, the break-point will not persist.
So, I don't know how to pause execution for the nested page in IE. Can it be done? (I'm dealing with this by manually setting a debugger;