[.NET 9] BlazorWebView fails to load on older Android devices Uncaught SyntaxError: Unexpected token .

[Eilon]

The JS file generated for blazor.webview.js contains JS code that is not valid on older Android systems unless they update their WebView.

This error occurs immediately when loading a BlazorWebView's contents: Uncaught SyntaxError: Unexpected token .

And occurs on this JS line in the file:

    function l(e) {
        const t = a.get(e);
        return t?.browserEventName || e   // <------------
    }

It seems to be this code, which oddly doesn't seem to have changed in very, very long time.

I'm not sure what did change that this would start happening only recently. Maybe TypeScript changed to generate different code?

This happens by default on Android Emulators with API 30 and older (we know that API 33 works, not sure about 31 and 32).

On these older Android emulator images you can update the System WebView to get newer versions, and that seems to fix the problem.

Some options to consider:

1. Do nothing. Users and/or app developers have to make sure the system is up-to-date. Well, minimally we'd want to document this, but no code change.
2. Have BlazorWebView detect older WebView on Android and fail more gracefully. Or perhaps log something?
3. Have Blazor use JS code that is compatible with older Android WebView versions. Perhaps there is a TypeScript flag to tell it to generate 'old' JS that is more compatible?

Note: This scenarios is somewhat reminiscent of the fact that on Windows you have to have Edge WebView2 installed and that things won't work if you don't. You'll probably get some weird errors, but the BlazorWebView control doesn't do a lot to help you (for better or for worse).

[Eilon]

It seems we had a sort of similar issue in the past, which we did fix: #39086

[javiercn]

@Eilon this was likely me, as part of revamping our JS infrastructure.

We did switch bundlers and "standarized" compiler settings, etc. One of the things that we did was making sure that we targeted modern JS.

All three options you propose sound fine to me, but this comes down to the support we wanted to offer, and I think we aligned the Android support with the general platform support for Browsers we had, so I'm more inclined to suggest we tell developers to update their webview. Probably with a better error message if possible. As far as I know, webview updates automatically on Android devices too, isn't it? So this is more of an "emulator" driven issue than an issue on real devices.

Also note, that previous versions up to 8.0 are fine, as this change was introduced in January, so there's no rush for us to react. (By the time we ship again, we might consider those platforms too old (as I think we already do) and all versions we care about might not have issues).

In any case, should we need to react, there's some work that we can do to make this work if needed by providing a custom config for webview.

[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.

[Eilon]

For future reference: If we decide to make this work again on older Android/Chrome/WebView, then we also need to re-enable some tests that were disabled when this break was introduced. We added Android API 28, 29, 30 to the excluded list of API levels that we test for BlazorWebView in the dotnet/maui repo. See change here: dotnet/maui@9c03adc#diff-d2d1c388a0fb3196dbfcdab96421bc88336637a3d44480c96717f92d000facaeL155-R155

<!          androidApiLevelsExclude: [ 27, 26, 25, 24, 23, 22, 21 ] # BlazorWebView requires a recent version of Chrome
!>          androidApiLevelsExclude: [ 30, 29, 28, 27, 26, 25, 24, 23, 22, 21 ] # BlazorWebView requires a recent version of Chrome
                                       ^^^^^^^^^^^^

[danroth27]

We believe most devices will automatically update to the latest webview, so we prefer not to make changes to accommodate older JavaScript runtimes.

[ghhv]

The only challenge with this @danroth27 is even brand new industrial Android devices are quite often running older Android versions. I'm only here because I have a set of Android 10 (v29) barcode scanners and I tried to update to .NET 9. Does this mean .NET 8 is the end of the road for me?

[sjaakmarelis]

I have the same issue, with a zebra TC21, it does not work anymore, that is supported bij MAUI, but running blazor from a webview in maui is not working because of the script errors

[danroth27]

The only challenge with this @danroth27 is even brand new industrial Android devices are quite often running older Android versions. I'm only here because I have a set of Android 10 (v29) barcode scanners and I tried to update to .NET 9. Does this mean .NET 8 is the end of the road for me?

@ghhv I see. So, you're seeing this on actual Android hardware, not just with local development in the Android emulator. Are you also unable to update the system web view on these barcode scanners?

[danroth27]

I have the same issue, with a zebra TC21, it does not work anymore, that is supported bij MAUI, but running blazor from a webview in maui is not working because of the script errors

@sjaakmarelis Same question for you: Are you able to update the system web view on this device?

[caoyiliang]

I have the same issue, with a zebra TC21, it does not work anymore, that is supported bij MAUI, but running blazor from a webview in maui is not working because of the script errors

zebra TC21 customer service said to update the system in order to upgrade, update the system also requires a foreign money, in a fit of anger, maui and zebra are deactivated, ha ha ha

[ghhv]

@danroth27 I've finally revisited this and yes, I now understand that this is only an issue with the old WebView (v74) on the emulator and I've managed to resolve (sub-optimally) as I've documented here dotnet/AspNetCore.Docs#34428

I think for the sake of everyone who ends up in this rabbit hole and not realising that the issue is not their code, but the old WebView on these emulator versions (which is not readily upgradeable) that you should add this suggested code from @javiercn to the Maui templates or even better to blazor.webview.js so it handles it properly rather than the cryptic message at the top of this issue. Would save a lot of time and frustration. Much appreciated.

[timmac-qmc]

Kind of fixed using compiled blazor.webview.js for ES2019.
Someone posted a recent version in the commit provided in the comment here
Yu-Core/SwashbucklerDiary#79 (comment)

[Eilon]

Hi everyone, I've posted a step-by-step guide on how to work around this issue by using an ES2019-compatible version of blazor.webview.js: dotnet/maui#27327

If you're running into the problem described in this issue, please try that out and let us know if the workaround is working for you.