Debugging JavaScript in Trident-based app

Question

Is there a way to debug JavaScript in an app using the Trident (IE11) object? We have an (C++/MFC) app that embeds a Trident instance. It works fine and right-clicking on the object brings up the usual IE11 context menu. But it is not obvious how to bring up the debugging console so one can debug JavaScript embedded in the page being displayed. Perhaps it isn't even possible. It IS possible to do this on other platforms (e.g. OSX, iOS with UIWebView and Android with WebView).

Answer 1

Unfortunately IE's "F12 Developer Tools" is not available outside of IE itself. When using the IWebBrowser2 OLE control (as MFC is doing under the hood) there are two other ways to debug scripts and view the DOM. Note that both methods require you to modify the webpage beforehand.

1. Use Visual Studio. Assuming you have Visual Studio installed on your system, it has the ability to debug webpages. To use this, add the debugger; keyword to your existing Javascript, or add <script>debugger;</script> anywhere in the webpage. Then launch IE, select Internet options, click the Advanced tab, and uncheck the box labeled Disable script debugging (Other). Now when you launch your application and it hits your breakpoint, a dialog will popup asking if you want to debug the page in Visual Studio.
2. Use Firebug Lite. The Firebug tools for Firefox also come in a package that works in other browsers, including IE. The easiest way to use this is to add the following inside the head element of your webpage: <script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>. For more options check out the Firebug Lite website.