Versucht man eine Blazor MAUI App au einem älteren Betriebsystem wie z.B. macOS 13, Android 10 oder iOS 15 zu starten, crashed die App mit einem komplett leeren, weißen Bildschirm bzw. Fenster. Dieser Beitrag zeigt wie man das Whitescreen-Problem beseitigt.
Wie kommt es zum Whitescreen bei Blazor MAU Apps?
Eigentlich sollten alle o.g. Betriebsystem-Versionen funktionieren, denn sie gehören alle zu den offiziellen System-Requirements von Microsoft für Blazor MAUI Apps.
Was ist passiert?
Blazor MAUI Apps benutzen beim Start ein Script namens “blazor.webview.js”. Irgend wann haben sich die Entwickler von Blazor wohl dazu entschieden, das Start-Script auf den ECMA 2022-Standard für JavaScript anzupassen. Leider hat das den Seiteneffekt, daß ältere Webviews das nicht unterstützen. Das Resultat: Die App crashed bei der Initialisierung und die WebView der MAUI-App bleibt leer.
Es kommt zu dem besagten Whitescreen of Death …
Blazor MAUI Apps: Leerer Bildschirm beim Start beseitigen
Dank einem findigen GitHub User ist die Lösung sehr einfach. Man ersetzt das Startscript durch eine auf ECMA 2019 konvertierte Version.
Dazu gehen wir wie folgt vor:
- Im Ordner wwwroot legen wir folgende Ordner an: scripts/patches
- Dort legen wir eine leere Datei an: scripts/patches/blazor.webview-es2019.js
- Den Inhalt der Datei kopieren wir aus dem folgenden GitHub Repo: Eilon/MauiBlazorHybridES2019
Als Nächstes öffnen wwwroot/index.html in einem Editor und ersetzen diese Zeile:
|
1 |
script src="_framework/blazor.webview.js" autostart="false"></script> |
mit dieser
|
1 |
<script src="scripts/patches/blazor.webview-es2019.js" autostart="false"></script> |
Danach bauen wir das Projekt neu und das Blazor MAUI Whitescreen-Problem gehört der Vergangenheit an.
DANKE Eilon :-)
