Problem
After clicking any "LOG IN AS" button on the user selection screen, the app crashes with:
Minified React error #300: Element type is invalid: expected a string
(for built-in components) or a class/function but got: undefined
The error originates in LoginPage-vtcKBA7m.js and the component stack shows it occurs during the transition from LoginPage to the post-login dashboard view.
What Works
- User selection screen renders correctly
- Backend API is fully functional (
/api/v1/auth/demo-users, /api/v1/auth/login, /health all respond)
- All lazy-loaded JS chunks exist and load (200 status, correct sizes)
- No CSP violations
- No network failures
What Fails
- After
login() succeeds and React Router navigates to /dashboard, a lazy-loaded component in the route tree returns undefined instead of a valid React component
- This happens in both SRE deployment and likely in the production Docker build (same JS assets)
Steps to Reproduce
- Open the app
- Click any "LOG IN AS" button
- App crashes with "SOMETHING WENT WRONG" error boundary
Likely Cause
A component imported via React.lazy() in App.tsx resolves to undefined. This typically happens when:
- A module uses
export default but the lazy import expects named export (or vice versa)
- A dependency is missing from the production build
- A circular import causes a module to evaluate to
undefined
Environment
- Frontend:
nginx-sre.conf on port 8080
- Backend: FastAPI on port 8000, all routes registered (342 routes)
- Database: PostgreSQL with PostGIS, fully seeded
- Tested via Playwright on Chromium
Problem
After clicking any "LOG IN AS" button on the user selection screen, the app crashes with:
The error originates in
LoginPage-vtcKBA7m.jsand the component stack shows it occurs during the transition fromLoginPageto the post-login dashboard view.What Works
/api/v1/auth/demo-users,/api/v1/auth/login,/healthall respond)What Fails
login()succeeds and React Router navigates to/dashboard, a lazy-loaded component in the route tree returnsundefinedinstead of a valid React componentSteps to Reproduce
Likely Cause
A component imported via
React.lazy()inApp.tsxresolves toundefined. This typically happens when:export defaultbut the lazy import expects named export (or vice versa)undefinedEnvironment
nginx-sre.confon port 8080