Fix: Robust dynamic initialization for pwa-install component

Author: chaxus

index.html

@@ -18,18 +18,6 @@
   <div id="app" class="w-full h-full">
     <div id="iframe"></div>
   </div>
-  <pwa-install id="pwa-install"></pwa-install>
-  <script>
-    document.addEventListener('DOMContentLoaded', () => {
-      const install = document.getElementById('pwa-install');
-      if (install) {
-        const manifest = document.querySelector('link[rel="manifest"]');
-        if (manifest) install.setAttribute('manifestpath', manifest.href);
-        const icon = document.querySelector('link[rel="icon"]');
-        if (icon) install.setAttribute('iconpath', icon.href);
-      }
-    });
-  </script>
 </body>
 <script type="module" src="./index.ts"></script>
 

index.ts

@@ -87,3 +87,22 @@ if ('serviceWorker' in navigator) {
       });
   });
 }
+
+// Initialize PWA install component
+const initPwaInstall = () => {
+  const pwaInstall = document.createElement('pwa-install');
+  pwaInstall.id = 'pwa-install';
+
+  // Calculate absolute paths to avoid subfolder resolution issues
+  const baseUrl = window.location.href.split('?')[0].split('#')[0];
+  const baseDir = baseUrl.substring(0, baseUrl.lastIndexOf('/') + 1);
+
+  // Set paths relative to the current directory
+  pwaInstall.setAttribute('manifestpath', `${baseDir}manifest.json`);
+  pwaInstall.setAttribute('iconpath', `${baseDir}img/pwa-512.png`);
+
+  document.body.appendChild(pwaInstall);
+};
+
+// Start PWA initialization after short delay to ensure everything is settled
+setTimeout(initPwaInstall, 1000);