I participate in development of a site that has a significant number of users who view our site through the AOL Desktop v9.7 for Windows - which spawns browser windows inside itself. When debugging, I don't have the tooling I would normally be able to invoke (for example Chrome's Developer Console; Firebug; MSIE's F12 developer tools).
When inside AOL Desktop, I don't appear to have any of these, or anything similar. Is there a developer mode or console I can invoke, unearth?
What I meant in my comments, you could just use a very decent JavaScript debugger with manual DOM inspecting features, which comes with Visual Studio ([EDITED] including the free edition). With some tricks, it does work for AOL Desktop, too (what an amusing piece of software that is, BTW :) Of course, this is not the same as IE's F12 Tools, it lacks the interactive features like visual DOM tree, CSS tracing etc. But it still allows to step through the code, watch locals and objects, evaluate expressions and access DOM elements. It's an invaluable tool and I use it a lot for projects where we host the WebBrowser control. After all, that's what AOL does, too. Anyway, if you're already familiar with this, just give this post a smile and disregard it. Otherwise, read on :)
I tested the following under Win7 SP1 VM with IE9, Visual Studio 2012 Pro (Update3) and the latest AOL Desktop 9.7. [EDITED] It also works with the free edition, Visual Studio 2012 Express for Desktop, Update3.
The only major obstacle was that in about 20 seconds upon entering the debugger, AOL Browser used to restart itself, thus disconnecting from the debugger. A workaround for this was to close AOL and delete the following files:
"C:\Program Files (x86)\AOL Desktop 9.7\"
shellmon.exe
shellmon.ini
shellrestart.exe
Then, I used the following basic HTML file for debugging purpose (as "debug.html" in the root of localhost):
<!doctype html>
<html>
<head>
<title>Debugger Test Page</title>
<script>
function debugPrompt()
{
if (confirm("debug?"))
{
debugger; // breakpoint
alert("after debugger");
}
}
document.onkeydown = function()
{
if (event.altKey && event.ctrlKey && event.keyCode === 'D'.charCodeAt(0))
{
event.cancelBubble = true;
debugPrompt();
return;
}
}
</script>
</head>
<body>
<button onclick="debugPrompt()">Debug</button>
</body>
</html>
Here's what I did exactly:
Ran AOL and navigated to localhost/debug.html.
Ran Visual Studio and attached to the aolbrowser.exe
process (with Script as the target kind of code), via Debug/Attach to Process menu:
debugger;
line of code. At this point, all usual debugging features are available. Note the Immediate Window panel and the Watch1 panel. Also, instead of hard-coding breakpoints with debugger
keyword as I did, it's possible to use Visual Studio Solution panel (once the debugger has been attached) to select one of the JavaScript files loaded by the page and toggle breakpoints interactively.Right now, I don't have Visual Studio Express 2012 to verify if the same is possible with it, although I assume it should be. I'll give it a try a bit later.
[UPDATE] Almost all of the above applies to the freely available Visual Studio 2012 Express for Desktop w/ Update3, with one exception: Just-In-Time Debugging option appears to be absent. This is not a show-stopper though, as it is still possible to attach to the running AOL process and debug the currently loaded page the same way.
PS. And thank you for your voluntary bounty offer on an unrelated question of mine, that is a really nice gesture.
Just in case anyone comes here looking for information: the newest 9.8 version of AOL Desktop now includes Chrome's developer tools, which open in a new window when you press F12.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With