maui icon indicating copy to clipboard operation
maui copied to clipboard

HeadContent not working with maui with blazor in release

Open WoodyJ007 opened this issue 1 year ago • 9 comments
trafficstars

Description

 <BlazorWebView x:Name="blazorWebView" HostPage="wwwroot/index.html">
        <BlazorWebView.RootComponents>
            <RootComponent Selector="head::after" ComponentType="{x:Type blazorweb:HeadOutlet}" />
            <RootComponent Selector="#app" ComponentType="{x:Type local:Main}" />
        </BlazorWebView.RootComponents>
    </BlazorWebView>

this worked fine in 7.0 and HeadContent would correctly be put at the bottom of the head.

This was broken in 8.0 (head content was inserted at the top) https://github.com/dotnet/aspnetcore/issues/51391

Apparently, it was fixed in 8.0.1 (but it's the same issue in Maui).

Since 8.0.1 there is now a new error and Headoutlet throws an error when used in Android Release!

<RootComponent Selector="head::after" ComponentType="{x:Type blazorweb:HeadOutlet}" />
Arg_NoDefCTor, Microsoft.AspNetCore.Components.Web.HeadOutlet
   at System.RuntimeType.CreateInstanceMono(Boolean , Boolean )
   at System.RuntimeType.CreateInstanceDefaultCtor(Boolean , Boolean )
   at System.Activator.CreateInstance(Type type, Boolean nonPublic, Boolean wrapExceptions)
   at System.Activator.CreateInstance(Type type, Boolean nonPublic)
   at System.Activator.CreateInstance(Type type)
   at Microsoft.AspNetCore.Components.DefaultComponentActivator.CreateInstance(Type )
   at Microsoft.AspNetCore.Components.ComponentFactory.InstantiateComponent(IServiceProvider , Type , IComponentRenderMode , Nullable`1 )
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.InstantiateComponent(Type )
   at Microsoft.AspNetCore.Components.RenderTree.WebRenderer.AddRootComponent(Type , String )
   at Microsoft.AspNetCore.Components.WebView.Services.WebViewRenderer.AddRootComponent(Type componentType, String domElementSelector)
   at Microsoft.AspNetCore.Components.WebView.WebViewManager.AttachToPageAsync(String baseUrl, String startUrl)
   at Microsoft.AspNetCore.Components.WebView.IpcReceiver.OnMessageReceivedAsync(PageContext pageContext, String message)
   at Microsoft.AspNetCore.Components.WebView.WebViewManager.<>c__DisplayClass18_0.<<MessageReceived>b__0>d.MoveNext()

Steps to Reproduce

Create a maui app. Use headoutet head::afer on MainPage.xaml and headcontent in a shared MainLayout.razor Debug to android will work fine. Release build to android will throw the error and app fails to load.

Link to public reproduction project repository

No response

Version with bug

8.0.5

Is this a regression from previous behavior?

Yes, this used to work in .NET MAUI

Last version that worked well

7.0.101

Affected platforms

Android

Affected platform versions

Android 13

Did you find any workaround?

No response

Relevant log output

Arg_NoDefCTor, Microsoft.AspNetCore.Components.Web.HeadOutlet
   at System.RuntimeType.CreateInstanceMono(Boolean , Boolean )
   at System.RuntimeType.CreateInstanceDefaultCtor(Boolean , Boolean )
   at System.Activator.CreateInstance(Type type, Boolean nonPublic, Boolean wrapExceptions)
   at System.Activator.CreateInstance(Type type, Boolean nonPublic)
   at System.Activator.CreateInstance(Type type)
   at Microsoft.AspNetCore.Components.DefaultComponentActivator.CreateInstance(Type )
   at Microsoft.AspNetCore.Components.ComponentFactory.InstantiateComponent(IServiceProvider , Type , IComponentRenderMode , Nullable`1 )
   at Microsoft.AspNetCore.Components.RenderTree.Renderer.InstantiateComponent(Type )
   at Microsoft.AspNetCore.Components.RenderTree.WebRenderer.AddRootComponent(Type , String )
   at Microsoft.AspNetCore.Components.WebView.Services.WebViewRenderer.AddRootComponent(Type componentType, String domElementSelector)
   at Microsoft.AspNetCore.Components.WebView.WebViewManager.AttachToPageAsync(String baseUrl, String startUrl)
   at Microsoft.AspNetCore.Components.WebView.IpcReceiver.OnMessageReceivedAsync(PageContext pageContext, String message)
   at Microsoft.AspNetCore.Components.WebView.WebViewManager.<>c__DisplayClass18_0.<<MessageReceived>b__0>d.MoveNext()

WoodyJ007 avatar Jan 11 '24 10:01 WoodyJ007

For anyone having the same problems. The error is removed by turning off trimming and AOT in release. The workaround for the Head output and make it correctly append at the end of the head is by using the <Template> hack mentioned here https://github.com/dotnet/aspnetcore/issues/51391

WoodyJ007 avatar Jan 11 '24 10:01 WoodyJ007

I built a repro app here: https://github.com/Eilon/maui19822headcontent

But couldn't reproduce the exact error. I was seeing the issue described by https://github.com/dotnet/aspnetcore/issues/51391, but I don't have that patch on this machine, so that's not surprising.

For my repro app:

  1. I used essentially the same XAML to add the root component: https://github.com/Eilon/maui19822headcontent/blob/main/maui19822headcontent/MainPage.xaml#L10
  2. The component I'm using emits a reference to a CSS file: https://github.com/Eilon/maui19822headcontent/blob/main/maui19822headcontent/MyHeadOutlet.razor
  3. And I updated some content to 'prove' whether the CSS is loaded by trying to apply a style defined in the CSS

And when I ran on Android in Release mode: image

It showed what I expected with the purple CSS: image

I then also tried moving the Razor Component I used for the HeadOutlet to a Razor Class Library (RCL) in case that affects what gets altered by AOT, but the behavior didn't change (that is, everything worked fine).

The error mentioned earlier is almost certainly due to AOT/trimming (as @WoodyJ007 also mentioned) because it's saying a type member doesn't exist, when clearly it should. There are various settings to adjust how AOT works, but for most scenarios it should 'just work'.

If someone can share a repro of this issue we can investigate further.

Eilon avatar Jan 26 '24 00:01 Eilon

This issue has been automatically marked as stale because it has been marked as requiring author feedback to reproduce the issue but has not had any activity for 4 days. It will be closed if no further activity occurs within 3 days of this comment. If it is closed, feel free to comment when you are able to provide the additional information and we will re-investigate.

ghost avatar Jan 30 '24 01:01 ghost

I added how to reproduce the issue on the repo (under issues)

WoodyJ007 avatar Jan 30 '24 08:01 WoodyJ007

Can repro this issue on the latest 17.10 Preview 2. error

RoiChen001 avatar Mar 13 '24 02:03 RoiChen001

@RoiChen001 are you able to debug the release app? In Visual Studio open the Exception Settings window, and make sure that Common Language Runtime Exceptions is checked (actual checkmark, not just a square), and then debug the app (you can still use Release mode and run with the debugger). That should show what the exception is.

image

Eilon avatar Mar 14 '24 21:03 Eilon

@Eilon Sorry for the delay, I almost missed your message. As shown in the picture, I didn't see the exception being thrown. 19822

RoiChen001 avatar Mar 22 '24 06:03 RoiChen001

@WoodyJ007 can you please confirm if this is still an issue with the latest 8.0.4 release and let us know? Thanks!

mkArtakMSFT avatar Apr 26 '24 20:04 mkArtakMSFT

No, the issue is still not fixed. Just tried it now. Sequence

I put how to reproduce it on this thread ages ago.

https://github.com/Eilon/maui19822headcontent/issues/1

WoodyJ007 avatar Apr 29 '24 08:04 WoodyJ007