[Validation] Building and publishing a Blazor Hybrid app with its own JavaScript modules
- Dominant language
- C#
- Stars
- 38.4k
- Forks
- 10.9k
- Avg merge
- 2d 6h
- Merged PRs (30d)
- 290
Description
**Scenario contact:** @javiercn
## Scenario
**This scenario validates that two reported build and publish bugs are fixed.**
* **Publish crashed for a Hybrid app referencing a Razor class library.** A MAUI Blazor Hybrid app that references an RCL contributing `*.lib.module.js` files or scoped CSS built fine but failed on `dotnet publish` with `InvalidOperationException: Sequence contains more than one element`, thrown from the static web assets manifest task. Two copies of `blazor.modules.json` were in play, one a fallback shipped by `Microsoft.AspNetCore.Components.WebView`. ([#67374](https://github.com/dotnet/aspnetcore/issues/67374), reported downstream as [dotnet/sdk#54779](https://github.com/dotnet/sdk/issues/54779) and a MAUI gallery regression)
* **Building with `JSModulesEnabled` set to `false` failed** with an MSBuild error, even though the app was opting out of the machinery it was tripping over.
Both are fixed in .NET 11. This validates that such an app builds, publishes and runs on a device.
## Minimum build
.NET 11 Preview 7 or later.
## Configurations to cover
* Blazor Web App
* [ ] Static SSR
* [ ] Interactive Server
* [ ] Interactive WebAssembly
* [ ] Interactive Auto
* [ ] Standalone WebAssembly
* [x] Hybrid (MAUI)
## Also exercise
* [x] Published output
* [ ] An existing .NET 10 app upgraded to .NET 11
* [ ] Trimming or ahead-of-time compilation
* [ ] More than one server instance, or a proxy in front
* [ ] Hot Reload
* [ ] An IDE as well as the command line
* [ ] Container
## Setup
You need the workloads for building a native app and the ability to publish and install it on a device or emulator, since the problems being validated show up in published output rather than in a debug run. Covering more than one platform is worthwhile.
## What to build
A native app hosting Blazor that brings JavaScript of its own in several shapes:
* A module kept next to the component that uses it.
* A plain script in the app's static files.
* **A referenced Razor class library that contributes `*.lib.module.js` and scoped CSS**, and a component from it used on a page. This is the arrangement that made publish crash, so it is not optional.
Have each piece do something visible so you can tell from the running app whether it loaded. Then build a second copy of the app with `JSModulesEnabled` set to `false`, to check that an app which opts out of collocated modules still builds.
## Things to try
* Building and running the app during development, and confirming each piece of JavaScript loads.
* Publishing it and installing the published app on a device or emulator.
* Using every page that depends on JavaScript in the installed app.
* Publishing for a second platform and repeating.
* Publishing twice in a row without cleaning in between, and after cleaning.
* Building the copy with `JSModulesEnabled` set to `false`.
* Adding another module to a component and publishing again.
* Watching the build output for warnings about duplicate or conflicting assets.
## Expected behavior
The app builds, publishes and runs with its own JavaScript intact, and opting out of collocated modules is a supported configuration rather than a build break.
### Must hold
* `dotnet publish` succeeds for the app that references the Razor class library, with no `InvalidOperationException: Sequence contains more than one element` and no other failure involving `blazor.modules.json`.
* The app builds and publishes with no warning about duplicate or conflicting assets.
* The installed published app loads every piece of its own JavaScript, including modules and scoped CSS coming from the referenced class library.
* Publishing twice in a row, with and without cleaning first, produces the same working result.
* The copy with `JSModulesEnabled` set to `false` builds successfully, with no MSBuild error.
* Adding another module and publishing again requires no manual bookkeeping.
### Expected differences between configurations
* No differences are expected between platforms. A publish that succeeds for one and fails for another is a finding.
## Documentation to use
* [ASP.NET Core Blazor Hybrid](https://learn.microsoft.com/aspnet/core/blazor/hybrid/?view=aspnetcore-11.0)
* [JavaScript location in ASP.NET Core Blazor apps](https://learn.microsoft.com/aspnet/core/blazor/javascript-interoperability/location-of-javascript?view=aspnetcore-11.0)
* [Publish a .NET MAUI app](https://learn.microsoft.com/dotnet/maui/deployment/)
## What to report
Report results using the format described in the [validation testing manual](https://github.com/dotnet/aspnetcore/issues/68479). Include link to a repository with the test app.
Contributor guide
Assessment
This issue has not been assessed yet.