'Blazor WASM doesn't hit breakpoint

I have a Blazor WASM Project with version 5 assemblies and tried to activate debugging according to this article: https://docs.microsoft.com/en-us/aspnet/core/blazor/debug?view=aspnetcore-3.1

For that I made sure I updated all the assembly references and adjusted the launchsettings. The latter looks like that now:

{
  "iisSettings": {
    "windowsAuthentication": false,
    "anonymousAuthentication": true,
    "iisExpress": {
      "applicationUrl": "http://localhost:62310",
      "sslPort": 44325
    }
  },
  "profiles": {
    "IIS Express": {
      "commandName": "IISExpress",
      "launchBrowser": true,
      "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    },
    "ApplySupportTool.Client": {
      "commandName": "Project",
      "launchBrowser": true,
      "inspectUri": "{wsProtocol}://{url.hostname}:{url.port}/_framework/debug/ws-proxy?browser={browserInspectUri}",
      "applicationUrl": "https://localhost:5001;http://localhost:5000",
      "environmentVariables": {
        "ASPNETCORE_ENVIRONMENT": "Development"
      }
    }
  }
}

Also these are my references in the WASM Project:

<PackageReference Include="System.Net.Http.Json" Version="3.2.0-preview5.20210.3" />
<PackageReference Include="Microsoft.AspNetCore.Components.DataAnnotations.Validation" Version="3.2.0-preview2.20160.5" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="3.2.0-preview5.20216.8" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Build" Version="3.2.0-preview5.20216.8" PrivateAssets="all" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="3.2.0-preview5.20216.8" PrivateAssets="all" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Runtime" Version="3.2.0-preview5.20216.1" />
<PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Authentication" Version="3.2.0-preview5.20216.8" />

For testing I copied over the "Counter" page from the default project. But when I hit F5 to debug the breaking point in the IncrementCount method doesn't turn red. I tested in a new created default project and there it works, so I pressume Visual Studio Preview, Edge and .net core has the correct version.

What I noticed is this warning in the dev console which only appears in my existing project, but not in the new created default project:

DevTools failed to load SourceMap: Could not load content for chrome-extension://ndcileolkflehcjpmjnfbnaibdcgglog/include.preload.js.map: HTTP error: status code 404, net::ERR_UNKNOWN_URL_SCHEME

Is there something other I have to add or adjust for this to work? In the article above I couldn't find anything as far as I can see.



Solution 1:[1]

This is a known issue in Blazor projects at this time. The debugger launches slower/quicker than the project assembly and doesn't have time to "see" the assembly. Here is my fix until they solve this. I add a delay in Program.cs so that when the project launches in debug mode, it gives the debugger time to attach properly. I used 5000 ms but you may have to increase this value if your machine is slower than mine.

    public class Program
    {
        private static async Task DebugDelayAsync()
        {
#if DEBUG
            await Task.Delay(5000);
#endif
        }

        public static async Task Main(string[] args)
        {
            await DebugDelayAsync();

            (...)
        }
    }

Solution 2:[2]

This may help someone. In my case I deleted the hidden .vs folder for the solution and break points worked again. In addition this fixed an issue where Chrome Debugging would not work any longer.

Solution 3:[3]

Something similar happened to me a few days ago.

The steps I took were as follows:

  • Edit the debug profile. In my case, I edited the port and removed the https protocol option.
  • Compile and check that the debugging points were working again.
  • Edit the debug profile to return to the initial configuration. I didn’t undo the changes, I edited them by hand again

Solution 4:[4]

if earlier methods didn't work also try:

  1. implement the DebugDelay from the top answer.
  2. with notepad, open [your project]\Client\Properties\launchSettings.json
  3. Under iisSettings.. "applicationUrl": "http://localhost:50454", copy the local host .eg. http://localhost:50454
  4. In Visual Studio IDE, Debug, [my app].server.debug* properties / webserver settings / App URL. Paste in your clipboard.

don't ask me why it worked but it did, the annoying 'Unbound breakpoint will not be hit' was gone.

Solution 5:[5]

Some of these bugs have been fixed since .NET 6 and the update to the SDK in 6.0.202.

The workaround of using a timer is no longer needed - so don't go down that path.

But there are still various bugs and difficulties based on environment. If you are willing to use Edge (it's good), then see my answer here for working config.

Solution 6:[6]

If none of the above works, not having the SSL certificate for localhost in the trusted root store will also prevent you from debugging client side C#. So if you still have an "unsecured connection" try adding the cert first.

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1
Solution 2 ElimGarak
Solution 3 Dharman
Solution 4 dean veggy
Solution 5 lonix
Solution 6 Andrew