Attach a debugger from the task pane
In Office 2016 for Windows, Build 77xx.xxxx or later, you can attach the debugger from the task pane. The attach debugger feature will directly attach the debugger to the correct Internet Explorer process for you. You can attach a debugger regardless of whether you are using Yeoman Generator, Visual Studio Code, node.js, Angular, or another tool.
To launch the Attach Debugger tool, choose the top right corner of the task pane to activate the Personality menu (as shown in the red circle in the following image).
Notes:
- Currently the only supported debugger tool is Visual Studio 2015 with Update 3 or later. If you don't have Visual Studio installed, selecting the Attach Debugger option doesn’t result in any action.
- You can only debug client-side JavaScript with the Attach Debugger tool. To debug server-side code, such as with a Node.js server, you have many options. For information on how to debug with Visual Studio Code, see Node.js Debugging in VS Code. If you are not using Visual Studio Code, search for "debug Node.js" or "debug {name-of-server}".
Select Attach Debugger. This launches the Visual Studio Just-in-Time Debugger dialog box, as shown in the following image.
In Visual Studio, you will see the code files in Solution Explorer. You can set breakpoints to the line of code you want to debug in Visual Studio.
For more information about debugging in Visual Studio, see the following:
- To launch and use the DOM Explorer in Visual Studio, see Tip 4 in the Tips and Tricks section of the Building great-looking apps for Office using the new project templates blog post.
- To set breakpoints, see Using Breakpoints.
- To use F12, see Using the F12 developer tools.