Blazor ServiceWorkerAssetsManifest Missing Scoped Css for Wasm Client

[jlchavez]

Is there an existing issue for this?

• [X] I have searched the existing issues

Describe the bug

I'm using .NET 8.0.0-rc.1.23421.29 Nuget packages, this is a test environment in our R&D team, for our new set of assemblies.

I have a Blazor Web App with Server-Side Rendering and Client Interactivity enabled.

• WebPx.Sutz.Admin (Server Side)
• WebPx.Sutz.Admin.Client

Moved some files from Admin to Admin.Client to convert it to have all the required components for it to work as a PWA app also, like App.razor, Routes.razor, added an Index.html file, manifest.json, service-worker.js. Modified the Admin project to my layout on the client library as additional assemblies, with a little twist, AppLayout is a shared razor class library for allowing it to be on multiple clients.

    app.MapRazorComponents<AppLayout>()
      .AddServerRenderMode()
      .AddWebAssemblyRenderMode()
      .AddAdditionalAssemblies(
          typeof(WebPx.Components.Pages.Weather).Assembly
      );

I know you currently don't have a Host model for the client (wasm) assembly in .net 8. I enabled some features on the Blazor Wasm Project:

    <StaticWebAssetBasePath>/</StaticWebAssetBasePath>
    <ServiceWorkerAssetsManifest>service-worker-assets.js</ServiceWorkerAssetsManifest>
    <BlazorCacheBootResources>false</BlazorCacheBootResources>
    <PublishTrimmed>true</PublishTrimmed>
    <BlazorEnableCompression>true</BlazorEnableCompression>

And added the serviceworker.js support

    <ItemGroup>
        <ServiceWorker Include="wwwroot\service-worker.js" PublishedContent="wwwroot\service-worker.published.js" />
    </ItemGroup>

So the expected behavior is to load as server-side, service-worker would request all the assets and cache them in the browser, and serve the files from cache, but i'm currently not using the BlazorCacheBootResources because we end with multiple cache stores, one offline-cache-xxxx for each version of the service-worker-assets.js and one for the client. That's not optimal from the POV of client storage, leaving orphan files forever... But for the tests at least just one set of files is downloaded at the time instead of twice.

So the following exception is thrown when the service worker request all the assets:

Uncaught (in promise) TypeError: Failed to execute 'addAll' on 'Cache': Request failed

When analyzing the data of the service-worker-assets.js while publishing to a folder the first file is "WebPx.Sutz.Admin.Client.styles.css" which is a file that can be found under "WebPx.Sutz..Admin.Client\obj\debug\net8.0\scopedcss\bundle",

self.assetsManifest = {
  "assets": [
    {
      "hash": "sha256-zZs2z+YZV+n0XWz5qZSgyFfyYtl+0nBgmuB075Pgfgk=",
      "url": "WebPx.Sutz.Admin.Client.styles.css"
    },
    ...
}

But this file is NOT available in the published output folder or in the debug files, but it is available from the server side project the WebPx.Sutz.Admin.styles.css and links to the WebPx.Sutz.Admin.Client.bundle.scp.css.

Expected Behavior

The CSS Bundle file for the Blazor Wasm to be available as per the service-worker-assets.js so that all files are available to be cached from the service-worker.js

Steps To Reproduce

It's a complex example but I've explained all the involved steps. If required I might built a smaller sample for it, let me know. May be just need to enable building the service-woker-assets.js

<ServiceWorkerAssetsManifest>service-worker-assets.js</ServiceWorkerAssetsManifest>

Exceptions (if any)

Browser Console: Uncaught (in promise) TypeError: Failed to execute 'addAll' on 'Cache': Request failed

.NET Version

8.0.100-rc.1.23455.8

Anything else?

No response

[javiercn]

@jlchavez thanks for contacting us.

We don't have support for service-worker in Blazor Web with webassembly enabled. The web assembly project is considered a class library in this situation and won't produce it's own scoped CSS app bundle.

In this case the recommendation is to adjust the code in your service-worker.js if you need to.

[jlchavez]

@javiercn yes I've filtered out that file, everything is working, but at least if it's not supported and it won't produce it, it shouldn't appear on the assets file.

I've worked out how to make it work as a PWA, for an offline experience since we already have all the assemblies in the client

:)

[ghost]

Thanks for contacting us.

We're moving this issue to the .NET 9 Planning milestone for future evaluation / consideration. We would like to keep this around to collect more feedback, which can help us with prioritizing this work. We will re-evaluate this issue, during our next planning meeting(s). If we later determine, that the issue has no community involvement, or it's very rare and low-impact issue, we will close it - so that the team can focus on more important and high impact issues. To learn more about what to expect next and how this issue will be handled you can read more about our triage process here.

[javiercn]

Dupe of https://github.com/dotnet/aspnetcore/issues/48935