External/SnapOtter
1
0
Fork 0
mirror of https://github.com/snapotter-hq/SnapOtter.git synced 2026-08-03 07:46:42 +02:00
Code Issues Packages Projects Releases Wiki Activity

fix: detect CSS preload errors and keep banner visible during error states

Browse Source 
- Add "unable to preload" pattern to isChunkError for Vite CSS preload failures
- Move ConnectionMonitor and ConnectionBanner outside ErrorBoundary so they
  remain visible when the error boundary catches a render crash
- Add test for CSS preload error retry
This commit is contained in:
ashim-hq
2026-04-21 00:01:59 +08:00
parent da52088e39
commit 70f9f3d51d
3 changed files with 49 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/src/App.tsx
+34 -29
View File
@@ -167,36 +167,41 @@ function ConnectionMonitor() {
export function App() {
return (
<ErrorBoundary>
<>
<ConnectionMonitor />
<ConnectionBanner />
<Toaster position="bottom-right" />
<BrowserRouter>
<KeyboardShortcutProvider>
<AuthGuard>
<Suspense fallback={<PageLoader />}>
<Routes>
<Route path="/login" element={<LoginPage />} />
<Route path="/change-password" element={<ChangePasswordPage />} />
<Route path="/automate" element={<AutomatePage />} />
<Route path="/files" element={<FilesPage />} />
<Route path="/fullscreen" element={<FullscreenGridPage />} />
<Route path="/privacy" element={<PrivacyPolicyPage />} />
{/* Redirects: old color tools consolidated into adjust-colors */}
<Route
path="/brightness-contrast"
element={<Navigate to="/adjust-colors" replace />}
/>
<Route path="/saturation" element={<Navigate to="/adjust-colors" replace />} />
<Route path="/color-channels" element={<Navigate to="/adjust-colors" replace />} />
<Route path="/color-effects" element={<Navigate to="/adjust-colors" replace />} />
<Route path="/:toolId" element={<ToolPage />} />
<Route path="/" element={<HomePage />} />
</Routes>
</Suspense>
</AuthGuard>
</KeyboardShortcutProvider>
</BrowserRouter>
</ErrorBoundary>
<ErrorBoundary>
<Toaster position="bottom-right" />
<BrowserRouter>
<KeyboardShortcutProvider>
<AuthGuard>
<Suspense fallback={<PageLoader />}>
<Routes>
<Route path="/login" element={<LoginPage />} />
<Route path="/change-password" element={<ChangePasswordPage />} />
<Route path="/automate" element={<AutomatePage />} />
<Route path="/files" element={<FilesPage />} />
<Route path="/fullscreen" element={<FullscreenGridPage />} />
<Route path="/privacy" element={<PrivacyPolicyPage />} />
{/* Redirects: old color tools consolidated into adjust-colors */}
<Route
path="/brightness-contrast"
element={<Navigate to="/adjust-colors" replace />}
/>
<Route path="/saturation" element={<Navigate to="/adjust-colors" replace />} />
<Route
path="/color-channels"
element={<Navigate to="/adjust-colors" replace />}
/>
<Route path="/color-effects" element={<Navigate to="/adjust-colors" replace />} />
<Route path="/:toolId" element={<ToolPage />} />
<Route path="/" element={<HomePage />} />
</Routes>
</Suspense>
</AuthGuard>
</KeyboardShortcutProvider>
</BrowserRouter>
</ErrorBoundary>
</>
);
}
apps/web/src/lib/lazy-with-retry.ts
+2 -1
View File
@@ -7,7 +7,8 @@ export function isChunkError(error: unknown): boolean {
msg.includes("dynamically imported module") ||
msg.includes("loading chunk") ||
msg.includes("loading css chunk") ||
msg.includes("failed to fetch")
msg.includes("failed to fetch") ||
msg.includes("unable to preload")
);
}
tests/unit/web/lazy-with-retry.test.ts
+13
View File
@@ -33,6 +33,19 @@ describe("retryDynamicImport", () => {
expect(importFn).toHaveBeenCalledTimes(3);
});
it("retries CSS preload errors", async () => {
const mod = { default: () => null };
const importFn = vi
.fn()
.mockRejectedValueOnce(
new TypeError("Unable to preload CSS for /assets/tool-page-DDbXBANV.css"),
)
.mockResolvedValue(mod);
const result = await retryDynamicImport(importFn, 3, 0);
expect(result).toBe(mod);
expect(importFn).toHaveBeenCalledTimes(2);
});
it("only retries chunk-related errors, not other errors", async () => {
const err = new Error("Some other error");
const importFn = vi.fn().mockRejectedValue(err);