.NET 8 Preview 7 Blazor WebAssembly PWA, not working on iPhone & iPad

atuggle commented 1 year ago

Description

After upgrading a .NET 7 Blazor WebAssembly PWA application to .NET 8 Preview 7 I noticed the web app stopped loading on iPhones and iPads. The console log shows the below error:

[Error] Error: AggregateException_ctor_DefaultMessage (Arg_IndexOutOfRangeException) — dotnet.runtime.8.0.0-preview.7.23375.6.hh1fgtyrm9.js:3:29648
    (anonymous function) (blazor.webassembly.js:1:40595)

While attempting to create a sample, I discovered the two lines of code that reproduce the bug. The sample project with README.md instructions can be found here: https://github.com/atuggle/BlazorWebAssemblyPWA-BreaksOnIOS

Build and deploy the above repository to duplicate it on iPhone
The repo has 2 commits, the second commits are the breaking changes that must both be added

Configuration

There are two steps to reproduce this and it's pretty easy. Step 1 create a sample Blazor WebAssemby PWA project, and Step 2 add two lines of code deploy, and verify on iPhone it does not work.

Step 1: Create the project

Open Visual Studio 2022 Preview Edition
Choose "New Project" to create a new project
Find and choose "Blazor WebAssembly App"
Name the App and choose "Next"
Ensure ".NET 8.0 (Preview)" is selected as the framework and check "Progressive Web Application"

Step 2: Add code that breaks it on iPhone & iPad

Turn on AOT by adding

<RunAOTCompilation>true</RunAOTCompilation> to the project file

Add an <InputText .../> element in the index.razor page
```
<InputText id="emailText" class="form-control" />
```
Deploy the above code and see it fails on IOS with the error

Other information

I am able to work around this right now by turning AOT off, and most people will not notice this because AOT is off by default for most new project creations.

SamMonoRT commented 1 year ago

/cc @lewing @pavelsavara

ghost commented 1 year ago

Tagging subscribers to 'arch-wasm': @lewing See info in area-owners.md if you want to be subscribed.

Issue Details

## Description After upgrading a .NET 7 Blazor WebAssembly PWA application to .NET 8 Preview 7 I noticed the web app stopped loading on iPhones and iPads. The console log shows the below error: ``` [Error] Error: AggregateException_ctor_DefaultMessage (Arg_IndexOutOfRangeException) — dotnet.runtime.8.0.0-preview.7.23375.6.hh1fgtyrm9.js:3:29648 (anonymous function) (blazor.webassembly.js:1:40595) ``` While attempting to create a sample, I discovered the two lines of code that reproduce the bug. The sample project with README.md instructions can be found here: https://github.com/atuggle/BlazorWebAssemblyPWA-BreaksOnIOS - Build and deploy the above repository to duplicate it on iPhone - The repo has 2 commits, the second commits are the breaking changes that must both be added ## Configuration There are two steps to reproduce this and it's pretty easy. Step 1 create a sample Blazor WebAssemby PWA project, and Step 2 add two lines of code deploy, and verify on iPhone it does not work. ### Step 1: Create the project 1. Open Visual Studio 2022 Preview Edition 2. Choose "New Project" to create a new project 3. Find and choose "Blazor WebAssembly App" 4. Name the App and choose "Next" 5. Ensure ".NET 8.0 (Preview)" is selected as the framework and check "Progressive Web Application" ### Step 2: Add code that breaks it on iPhone & iPad 1. Turn on AOT by adding ``` true to the project file ``` 2. Add an element in the index.razor page ``` ``` 3. Deploy the above code and see it fails on IOS with the error ### Other information I am able to work around this right now by turning AOT off, and most people will not notice this because AOT is off by default for most new project creations.

Author:	atuggle
Assignees:	-
Labels:	`arch-wasm`, `untriaged`, `area-VM-meta-mono`, `needs-area-label`
Milestone:	-

pavelsavara commented 1 year ago

I don't have any apple device, so I just tested the provided repository with chrome on windows. I get

Also, this is compiled with SIMD instructions and perhaps your devices doesn't have recent version of Safari (16.4 and above) ?

ghost commented 1 year ago

This issue has been marked needs-author-action and may be missing some important information.

atuggle commented 1 year ago

@pavelsavara

I added a new commit that fixes the InputText for chrome.

By adding a @bind-value property to the InputText

I also removed the script reference to the service worker

Note: This does not impact the issue where AOT compilation breaks the app on Iphones and Ipads

I also added a manual version to the index.html page just to make it a tad bit easier to know if the latest was deployed to the web server

Additional Notes:

I'm using the latest version of IOS 16.6
I'm using IIS Version: 10.0.23506.1000
- Running on Windows 11 Professional
I also deploy this to IIS on Windows Server 2019 and I get the same issue (where I first noticed the issue)

pavelsavara commented 1 year ago

I added a new commit that fixes the InputText for chrome.

The new version just works on my chrome, so this need somebody with ios device to have look. Does it also fail on OsX ?

* Note: This does not impact the issue where AOT compilation breaks the app on Iphones and Ipads

Now I'm thinking that if this was SIMD or EH issue it would fail much earlier.

Could you please try to give us more detailed stack trace ?

And also please report the version of Safari on the device.

Thanks!

atuggle commented 1 year ago

It does work on OsX! Just not on iPhones and iPads!

The device I'm using is on an iphone running IOS 16.6 which is also the version of Safari for IOS.

atuggle commented 1 year ago

Safari will not allow me to copy the stack trace so the following screen captures show the stack trace:

kg commented 1 year ago

Does this reproduce with the Jiterpreter disabled?

<PropertyGroup>
   <BlazorWebAssemblyJiterpreter>false</BlazorWebAssemblyJiterpreter>
</PropertyGroup>

atuggle commented 1 year ago

@kg

Your suggestion to add the BlazorWebAssemblyJiterpreter has no impact. I tested it both ways with the values false and true and if AOT was set to True it did not work, but if AOT was set to False the site worked (again it worked with both false and true set for BlazorWebAssemblyJiterpreter)

pavelsavara commented 1 year ago

Could you please enable symbols

<PropertyGroup>
  <WasmNativeDebugSymbols>true</WasmNativeDebugSymbols>
  <WasmNativeStrip>false</WasmNativeStrip>
</PropertyGroup>

And see if stack trace has better function names, if so please copy them again.

atuggle commented 1 year ago

Hope this helps

atuggle commented 1 year ago

Additional context: It doesn't work in Chrome on my iPhone either. So both Safari & Chrome do not work when I have AOT = true on iPhone & iPad.

atuggle commented 1 year ago

This is the resulting page on my iPhone:

kg commented 1 year ago

Additional context: It doesn't work in Chrome on my iPhone either. So both Safari & Chrome do not work when I have AOT = true on iPhone & iPad.

FYI, Chrome and Firefox on iPhone/iPad are just Safari in a wrapper. So you don't need to test with them.

pavelsavara commented 1 year ago

I think the top one screen is just JS interop rejecting a promise. Something happened deeper than that.

SpikeViper commented 1 year ago

Same issue in .Net 8 RC1. Need fix.

e012345678 commented 11 months ago

Is this fixed in .NET 8 ?

GlitchedPolygons commented 10 months ago

Is this fixed in .NET 8 ?

Nope, still sucks :')

e012345678 commented 10 months ago

Any news on this? Is this working in .NET 8.0.1 then?

GlitchedPolygons commented 10 months ago

Any news on this? Is this working in .NET 8.0.1 then?

New year, old problems.

Doesn't work for me yet... I had to add

<RunAOTCompilation>false</RunAOTCompilation>
<WasmEnableSIMD>false</WasmEnableSIMD>

to the .csproj file's PropertyGroup section to temporarily circumnavigate this situation...

e012345678 commented 10 months ago

Thanks for the reply @GlitchedPolygons, we would like to use AOT however, guess that's not possible then?

GlitchedPolygons commented 10 months ago

Thanks for the reply @GlitchedPolygons, we would like to use AOT however, guess that's not possible then?

I'd love to use AOT too (and the SIMD optimizations would be very welcome too since I'm working with relatively math-intensive stuff...) but unfortunately at the moment it doesn't look like we're getting a fix anytime soon :(

e012345678 commented 10 months ago

Any comment on this from the Microsoft team? @pavelsavara

kg commented 10 months ago

If <WasmEnableSIMD>false</WasmEnableSIMD> fixes it in interpreter mode, that suggests the device you're running on lacks SIMD support. It sounds like it doesn't work at all in AOT mode though even if SIMD is disabled, correct? That sounds like a separate issue with the AOT compiler.

I personally don't own any Apple hardware other than a macbook so I can't test/verify this problem myself.

If my understanding is correct, what remains of this issue is the AOT problem. It's expected that if SIMD is enabled you won't be able to run on old devices that lack SIMD support. (Whether SIMD should be disabled by default is a separate question which would need a separate tracking issue.)

e012345678 commented 10 months ago

We are using these two lines in our csproj in .NET 7 and it works perfectly, what is different in .NET 8?

    <WasmEnableSIMD Condition="'$(Configuration)'=='Release'">true</WasmEnableSIMD>
    <RunAOTCompilation Condition="'$(Configuration)'=='Release'">true</RunAOTCompilation>

This seems to work even if the device doesn't have SIMD support.

lewing commented 8 months ago

please add iOS version information

ghost commented 8 months ago

This issue has been marked needs-author-action and may be missing some important information.

ghost commented 8 months ago

This issue has been automatically marked no-recent-activity because it has not had any activity for 14 days. It will be closed if no further activity occurs within 14 more days. Any new comment (by anyone, not necessarily the author) will remove no-recent-activity.

GlitchedPolygons commented 8 months ago

Bump.

maraf commented 7 months ago

@e012345678 @GlitchedPolygons What version of iOS/Safari are you seeing this message one? And are you getting the Error: AggregateException_ctor_DefaultMessage, right?

GlitchedPolygons commented 7 months ago

@e012345678 @GlitchedPolygons What version of iOS/Safari are you seeing this message one? And are you getting the Error: AggregateException_ctor_DefaultMessage, right?

Ahhw, I don't remember >.<

I do think so tho, yeah... It does ring a bell.

(I had to rely on the above workaround of disabling SIMD and AOT comp. to make it work)

maraf commented 7 months ago

My current testing

Running the sample repo on Mac M1 in Safari or Edge works (both have SIMD)
Running on iOS simulator 15.5 in Safari doesn't work (doesn't have SIMD support)
Disabling SIMD (WasmEnableSIMD=false) makes it work on iOS simulator 15.5 in Safari
In any case I'm not able to get Error: AggregateException_ctor_DefaultMessage

maraf commented 7 months ago

The sample repo uses preview of .NET 8. Can you please validate that AOT compilation works in latest .NET 8 (8.0.3) in your environment?

atuggle commented 7 months ago

I am pleased to report this issue is resolved (specifically the Error: AggregateException_ctor_DefaultMessage issue). I have verified this specific issue has been resolved using .NET 8 (8.0.100) with the same devices I originally reported this issue with. My personal iPad and iPhone. Also, as before my application continues to works on multiple OSX devices including several older model Macbook pro's and a newer M3 based Macbook pro.

I am going to leave this Issue Open since there appears to be other apps with similar issues, but you are free to close this since I can verify my specific issue works (Event with RunAOTCompilation = true)

maraf commented 7 months ago

I'm going to close the issue. Feel free to reopen if issue occurs in other case with the latest bits

dotnet / runtime