Debugging Web Workers

To help improve user interface performance, Web Workers enable you to run processor-intensive code off the main thread of execution to separate threads. F12 Developer Tools now can also help you debug these threads, letting you view individual worker scripts, set breakpoints, and watch variables. F12 Developer Tools work much like before, but with a few changes.

The old drop-down box used for selecting a script to debug has been replaced with the Sources tab on the Script tab. The Sources tab lists both main and included scripts, and when you start debugging, it also displays dynamic Web Worker threads. You can view any script by double-clicking the name in the list.

When execution stops on a breakpoint, whether it's in a main thread or a Web Worker thread, everything pauses to preserve state. When you step through a Web Worker, only that worker is executed while the others stay paused. When you resume (F5), other threads restart. One caveat: you can't change which Web Worker you are currently debugging while stepping through the code. If you want to go to another Web Worker, you can set a breakpoint in that worker, and then resume so execution breaks in the desired Web Worker.

The Breakpoints tab is global, so you can see the breakpoints you've set on all threads. As with earlier versions of the F12 Developer Tools, double-click a listing to open the code in the script window.

When a script is running, the console operates on a global basis, so you can enter script and variables in the execution line. If you’re in a script at a breakpoint, the console works only in the context of that script or function.

F12 Developer Tools

Internet Explorer 10 Guide for Developers