Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Update WebAssembly debugging documentation, adjust templates #7120

Merged
merged 3 commits into from
Sep 20, 2021
Merged
Show file tree
Hide file tree
Changes from 2 commits
Commits
File filter

Filter by extension

Filter by extension


Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
41 changes: 30 additions & 11 deletions doc/articles/debugging-wasm.md
Original file line number Diff line number Diff line change
@@ -1,19 +1,38 @@
# Using the WebAssembly C# Debugger

Debugging WebAssembly via Google Chrome is experimentally supported by the Uno Platform. We HIGHLY recommend that you use [Google Chrome Canary](https://www.google.com/chrome/canary/). Step-through debugging (in, out, over), breakpoints, inspection of run-time locals and viewing .NET source code from the developer tools works. Additional capabilities and browser support will become available as Microsoft adds [support for them to mono](https://github.com/mono/mono/tree/master/sdks/wasm).
There are two ways to debug a WebAssembly application:
- Using Visual Studio 2019 or 2022 integrated debugger (preferred)
- Using the browser's debugger

- Make your WASM project the startup project (right-click **set as startup** in Solution Explorer)
- Make sure you have the following lines defined in your project file which enable the Mono runtime debugger. Please ensure that `DEBUG` constant is defined and debug symbols are emitted and are of the type `portable`:
## Using Visual Studio
Here’s what you need to do to debug an Uno application in Visual Studio (2019 16.10+ or 2022 17.0 Preview 3.1+):

- Install the latest [Uno Platform Visual Studio templates](https://marketplace.visualstudio.com/items?itemName=nventivecorp.uno-platform-addin)
- Have Chrome or Edge (Chromium based)
- In the Nuget Package manager, update `Uno.Wasm.Bootstrap` and `Uno.Wasm.Bootstrap.DevServer` 3.0.0 or later
jeromelaban marked this conversation as resolved.
Show resolved Hide resolved
- Ensure that `<MonoRuntimeDebuggerEnabled>true</MonoRuntimeDebuggerEnabled>` is set in your csproj
- Ensure that in the `Properties/launchSettings.json` file, the following like below each `launchBrowser` line:
```json
"inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
```

Then you can start debugging with the VS debugger toolbar:
- Select **IIS Express** or your application name as the debugging target
- Select **Chrome** as the Web Browser
- Press <kbd>F5</kbd> or _Debug_ > _Start Debugging_

```xml
<PropertyGroup Condition="'$(Configuration)'=='Debug'">
<MonoRuntimeDebuggerEnabled>true</MonoRuntimeDebuggerEnabled>
<DefineConstants>$(DefineConstants);TRACE;DEBUG</DefineConstants>
<DebugType>portable</DebugType>
<DebugSymbols>true</DebugSymbols>
</PropertyGroup>
```
You should now be able to set breakpoints or do step by step debugging of your code.

### Tips for debugging in visual studio
- Some debugger features may not have yet been implemented by the .NET and Visual Studio team. You can take a look the [dotnet/runtime](https://github.com/dotnet/runtime) repository for more details.
jeromelaban marked this conversation as resolved.
Show resolved Hide resolved
- If the breaking do not hit, make sure that the `inspecturi` lines have been added to the `Properties/launchSettings.json` file.

## Using the browser debugger

To debug your application:
- Make your WASM project the startup project (right-click **set as startup** in Solution Explorer)
- In the Nuget Package manager, update `Uno.Wasm.Bootstrap` and `Uno.Wasm.Bootstrap.DevServer` 3.0.0 or later
jeromelaban marked this conversation as resolved.
Show resolved Hide resolved
- Ensure that `<MonoRuntimeDebuggerEnabled>true</MonoRuntimeDebuggerEnabled>` is set in your csproj
- In the debugging toolbar:

- Select **IIS Express** as the debugging target
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@

<PropertyGroup>
<OutputType>Exe</OutputType>
<TargetFramework>net5.0</TargetFramework>
<TargetFramework>net6.0</TargetFramework>
<NoWarn>NU1701</NoWarn>
</PropertyGroup>

Expand All @@ -11,6 +11,12 @@
<DefineConstants>$(DefineConstants);TRACE;DEBUG</DefineConstants>
<DebugType>portable</DebugType>
<DebugSymbols>true</DebugSymbols>

<!--
IL Linking is disabled in Debug configuration.
When building in Release, see https://platform.uno/docs/articles/features/using-il-linker-webassembly.html
-->
<WasmShellILLinkerEnabled>false</WasmShellILLinkerEnabled>
</PropertyGroup>

<ItemGroup>
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,12 @@
<DefineConstants>$(DefineConstants);TRACE;DEBUG</DefineConstants>
<DebugType>portable</DebugType>
<DebugSymbols>true</DebugSymbols>

<!--
IL Linking is disabled in Debug configuration.
When building in Release, see https://platform.uno/docs/articles/features/using-il-linker-webassembly.html
-->
<WasmShellILLinkerEnabled>false</WasmShellILLinkerEnabled>
</PropertyGroup>

<ItemGroup>
Expand Down Expand Up @@ -48,8 +54,8 @@
<PackageReference Include="Uno.Extensions.Logging.WebAssembly.Console" Version="1.0.1" />
<PackageReference Include="Uno.UI.WebAssembly" Version="2.2.0" />
<PackageReference Include="Uno.UI.RemoteControl" Version="2.2.0" Condition="'$(Configuration)'=='Debug'" />
<PackageReference Include="Uno.Wasm.Bootstrap" Version="2.1.0" />
<PackageReference Include="Uno.Wasm.Bootstrap.DevServer" Version="2.1.0" />
<PackageReference Include="Uno.Wasm.Bootstrap" Version="3.0.0" />
<PackageReference Include="Uno.Wasm.Bootstrap.DevServer" Version="3.0.0" />
</ItemGroup>

<Import Project="..\$ext_safeprojectname$.Shared\$ext_safeprojectname$.Shared.projitems" Label="Shared" Condition="Exists('..\$ext_safeprojectname$.Shared\$ext_safeprojectname$.Shared.projitems')" />
Expand Down