diff --git a/microsoft-edge/webview2/how-to/debug-visual-studio-code.md b/microsoft-edge/webview2/how-to/debug-visual-studio-code.md index 85ee0a96f6..7dd7f843a3 100644 --- a/microsoft-edge/webview2/how-to/debug-visual-studio-code.md +++ b/microsoft-edge/webview2/how-to/debug-visual-studio-code.md @@ -6,7 +6,7 @@ ms.author: msedgedevrel ms.topic: conceptual ms.service: microsoft-edge ms.subservice: webview -ms.date: 02/21/2025 +ms.date: 03/25/2025 --- # Debug WebView2 apps with Visual Studio Code @@ -28,7 +28,10 @@ The following code demonstrates launching the app from Visual Studio Code (rathe "request": "launch", "runtimeExecutable": "C:/path/to/your/webview2/app.exe", "env": { - // Customize for your app location if needed. + // The following variable is needed when the "runtimeExecutable" property is set. + // The port number below must match the value of the "port" property above. + "WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS": "--remote-debugging-port=9222" + // Customize for your app location. "Path": "%path%;e:/path/to/your/app/location; " }, "useWebView": true, @@ -39,6 +42,12 @@ The following code demonstrates launching the app from Visual Studio Code (rathe ``` + +#### Using a registry value + +Instead of setting the `WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS` environment variable, you can add a new registry value named `` with data `--remote-debugging-port=9222` to the registry under registry key `Computer\HKEY_CURRENT_USER\Software\Policies\Microsoft\Edge\WebView2\AdditionalBrowserArguments`, so that the debugger can find the proper port. For more information, see [WewbView2 browser flags](../concepts/webview-features-flags.md). + + #### Command-line URL parameter passed in @@ -109,8 +118,7 @@ You might need to attach the debugger to running WebView2 processes. To do that "runtimeExecutable": "C:/path/to/your/webview2/myApp.exe", "env": { "Path": "%path%;e:/path/to/your/build/location; " -}, -"useWebView": true +} ``` Your WebView2 control must open the Chrome Developer Protocol (CDP) port to allow debugging of the WebView2 control. Your code must be built to ensure that only one WebView2 control has a CDP port open, before starting the debugger. @@ -144,6 +152,12 @@ You also need to add a new REGKEY ` = --remote-debugging-port=9222` u ![The resulting registry key in the Registry Editor](./debug-visual-studio-code-images/set-debugging-port-registry-key.png) + +#### Using an environment variable + +Instead of adding the above registry key, you can set the `WEBVIEW2_ADDITIONAL_BROWSER_ARGUMENTS` environment variable to `--remote-debugging-port=9222`. Make sure that your application is started after the environment variable is set, and make sure that your application inherits the environment variable. For more information, see [WewbView2 browser flags](../concepts/webview-features-flags.md). + + ## Debug tracing options