Fix black screen: wait for Vite before Electron, retry loadURL, show boot fallback.

Co-authored-by: Cursor <cursoragent@cursor.com>

app/main/index.ts

@@ -69,9 +69,37 @@ function createWindow(): void {
     },
   });
 
+  mainWindow.once('ready-to-show', () => {
+    mainWindow?.show();
+    mainWindow?.focus();
+  });
+  mainWindow.show();
+
   const devUrl = process.env.VITE_DEV_SERVER_URL;
   if (devUrl) {
-    void mainWindow.loadURL(devUrl);
+    mainWindow.webContents.openDevTools({ mode: 'detach' });
+    mainWindow.webContents.on('did-fail-load', (_e, code, desc, url) => {
+      console.error('did-fail-load', code, desc, url);
+    });
+    mainWindow.webContents.on('console-message', (_e, level, message) => {
+      console.log(`[renderer:${level}]`, message);
+    });
+    const load = async (attempt = 0) => {
+      try {
+        await mainWindow!.loadURL(devUrl);
+        console.log('Loaded', devUrl);
+      } catch (err) {
+        console.error('loadURL attempt', attempt, err);
+        if (attempt < 20) {
+          setTimeout(() => void load(attempt + 1), 300);
+          return;
+        }
+        await mainWindow!.loadURL(
+          `data:text/html,<h1 style="color:#fff;font-family:sans-serif;padding:24px">Dev server not reachable: ${devUrl}</h1>`,
+        );
+      }
+    };
+    void load();
   } else {
     void mainWindow.loadFile(path.join(__dirname, '../renderer/index.html'));
   }

app/renderer/App.tsx

@@ -155,12 +155,22 @@ export function App() {
     void (async () => {
       if (!window.ttrpgBuilder) {
         setBooting(false);
+        setStatus(
+          locale === 'ru'
+            ? 'Нет связи с Electron preload (перезапустите npm run dev)'
+            : 'Electron preload missing (restart npm run dev)',
+        );
         return;
       }
-      await window.ttrpgBuilder.seedPresets();
-      await refresh();
-      setBooting(false);
-      setStatus(locale === 'ru' ? 'Пресеты готовы' : 'Presets ready');
+      try {
+        await window.ttrpgBuilder.seedPresets();
+        await refresh();
+        setStatus(locale === 'ru' ? 'Пресеты готовы' : 'Presets ready');
+      } catch (e) {
+        setStatus(String(e));
+      } finally {
+        setBooting(false);
+      }
     })();
   }, [refresh, locale]);
 

app/renderer/index.html

@@ -4,9 +4,13 @@
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <title>TTRPG Character Builder</title>
+    <style>
+      html, body { margin: 0; height: 100%; background: #09090b; color: #eee; font-family: Segoe UI, sans-serif; }
+      #boot-fallback { padding: 24px; }
+    </style>
   </head>
   <body>
-    <div id="root"></div>
+    <div id="root"><div id="boot-fallback">Loading TTRPG Character Builder…</div></div>
     <script type="module" src="./main.tsx"></script>
   </body>
 </html>

app/renderer/main.tsx

@@ -2,4 +2,21 @@ import { createRoot } from 'react-dom/client';
 import { App } from './App.tsx';
 import './styles.css';
 
-createRoot(document.getElementById('root')!).render(<App />);
+const rootEl = document.getElementById('root');
+if (!rootEl) {
+  document.body.innerHTML = '<pre style="color:#f66;padding:24px">#root missing</pre>';
+} else {
+  try {
+    createRoot(rootEl).render(<App />);
+  } catch (err) {
+    rootEl.innerHTML = `<pre style="color:#f66;padding:24px;white-space:pre-wrap">${String(err)}</pre>`;
+    console.error(err);
+  }
+}
+
+window.addEventListener('error', (e) => {
+  console.error('window.error', e.error || e.message);
+});
+window.addEventListener('unhandledrejection', (e) => {
+  console.error('unhandledrejection', e.reason);
+});