Console.log() inside Visual Studio Code

We just released version 1.4.6 of the Edge DevTools for VS Code extension and the main change is that the Console tool is now available in the extension.

• 0:05 Console.log() messages in VS Code
• 0:08 Test out some JavaScript
• 0:10 window object access
• 0:12 DOM convenience API support
• 0:15 Style changes
• 0:17 Console.table()
• 0:20 Live Expressions
• 0:30 Use Console and Elements together.

There are two caveats at the moment: in order to see the Console, you need to use Edge Canary as your debugging target (version 101.0.1193.0+) and it can happen that the you need to refresh the target once to see the Console light up. This is a bug in VS Code itself and will be fixed in the upcoming version.

New automatically created launch.json settings

To give you the best debugging experience in VS Code, we updated the launch.json settings when you generate it from the extension. The new file offers you a headless debugging experience by default calling the correct version of the Edge debugger.

You can see it them in action in the following screencast:

If you want to see the Console tool right now and not until 101 is the stable version of Edge, you need to add a "runtimeExecutable": "canary", to the launch.json to target the Canary build of the browser.

Offline availability

If you want to use the extension when you are offline, we now also cache and copy the last successful connection to DevTools. This was a direct request from GitHub issues.

Other fixes and features

• We updated webhint to 1.6.5 which means improved issue reporting and a general clean-up of the code base.
• We fixed some minor problems in the source path resolution which makes CSS syncing and opening files in the editor more stable

If you encounter a problem, or you want to have other features, please file an issue on GitHub. This is where we get our best ideas from.