Better error messages when Bubblewrap can't fetch manifest due to being served HTML

Author: JudahGabriel-MS

apps/pwabuilder-google-play/services/bubbleWrapper.ts

@@ -179,11 +179,22 @@ export class BubbleWrapper {
     private async generateTwaProject(): Promise<TwaManifest> {
         const twaGenerator = new TwaGenerator();
         const twaManifest = this.createTwaManifest(this.apkSettings);
-        await twaGenerator.createTwaProject(
-            this.projectDirectory,
-            twaManifest,
-            new ConsoleLog()
-        );
+        try {
+            await twaGenerator.createTwaProject(
+                this.projectDirectory,
+                twaManifest,
+                new ConsoleLog()
+            );
+        } catch (error) {
+            // Better handling for errors where fetching JSON (usually the web manifest) returns HTML result. 
+            // Example: https://github.com/pwa-builder/PWABuilder/issues/5376
+            if (error instanceof Error && error.message.includes("Unexpected token '<'")) {
+                const badJsonMessage = `Your web app returned HTML instead of JSON. Make sure your web manifest can be loaded directly. Try opening your web app in the browser, open F12 dev tools -> Application -> Manifest, and ensure your web manifest is loading properly. Error details: ${error.message}`;
+                this.dispatchProgressEvent(badJsonMessage, "error");
+            }
+
+            throw error;
+        }
         return twaManifest;
     }