Debug a modal dialog (showModalDialog) in IE

Question

I want to debug (examine DOM, use the interactive JS console, etc) part of a web application that is inside a modal dialog that was created by showModalDialog().

I can't find a way to use the standard IE-8 developer tools for this; The dialog doesn't have a toolbar and the usual shortcut (F12) doesn't work.

---

Another SO question (I unfortunately have lost the link to) suggested that the only solution is to (perhaps temporarily) replace showModalDialog() with an old-fashioned window.open(). If this is the case, is there a straightfoward way to do it?

Caveats:

• The app cares about passing dialogArguments and the return value of showModalDialog
• I can't use other browsers, FF+Firebug, etc.

Solution 1

F12 works to bring up the developer tools if you turn the address bar on.

Go Tools / Internet options / Security / (pick the right zone for your site) / Custom Level Under "Miscellaneous" Under "Allow websites to open windows without address or status bars", choose "Disable".

Source: https://stackoverflow.com/a/10984858/79835

Solution 2

i do it by creating an error in the js code, which then brings up the error window asking if you want to debug the script.

one way to do that would be to call a non-existent method somewhere in the code.

e.g. blabla();

Solution 3

You can now put the word debugger without quotes in your javascript.

IE and Chrome should both break on it as if you had set a breakpoint on it. Make sure its on a line by itself. Press F12 to open the browser debugger and then refresh your page or trigger the event to run your javascript and the debugger should automatically display the code with the breakpoint set.

Solution 4

What I do when i'm debugging modal windows are two things.

• You can include in your js code the instruction debugger; that will stop the js execution as if you had put a breakpoint.
• You can also open the ie developer tools before opening the modal window and, once it's open, you can review the generated code in the script tab, adding breakpoints, pausing execution,... everything you need.

Hope it helps!

View more solutions

Comments

[Rohan Desai]

Script debugging is turned off by default on IE. I had to enable it on the Advanced Internet Options.

[Bill]

in IE, you might need to click on the Script tab of the debugger and click the 'Start debugging' button first. At least you do on IE9.

[bentsai]

I've adjusted this setting for my site's zone (and all others, in fact), but the showModalDialog still pops up a dialog with no address bar. I'm using IE 8.0.7601.

[Elezar]

My company's group policy prevents me from changing the security options, and is set to allow windows without address or status bars (I like how they lock down the settings in a LESS secure manner than I want them!). So, this was the only way I was able to get the dev tools to open.

[Bernhard Döbler]

Start debugging always wants to reload the page, that's annoying.

[Chris]

Is there any reason this might show a status bar but not allow debug? I'm using IE 11.

[df778899]

Also saw the problem with the address bar but no Dev Tools showing under IE 11. This worked to force the modal dialog to show in a normal tab.