mirror of
https://github.com/RooVetGit/Roo-Code.git
synced 2026-08-28 05:27:24 +00:00
This change addresses potential grey/blank screen or crashing issues in the webview by:
1. **Adding an ErrorBoundary:** I introduced an `ErrorBoundary` component at the root of `webview-ui/src/App.tsx`. This component catches JavaScript rendering errors in its children, displaying a user-friendly fallback UI instead of a blank or broken screen. It also logs the error to the console for easier debugging.
2. **Implementing Loading/Timeout Logic:** I modified `webview-ui/src/App.tsx` to:
* Display a "Loading..." message while the initial extension state (`didHydrateState`) is being processed.
* Implement a 10-second timeout. If state hydration doesn't complete within this period, an error message is shown, guiding you to try reloading or checking for updates. This provides better feedback than a persistent blank screen.
3. **Adding Unit Tests:**
* I created tests for the `ErrorBoundary` to ensure it correctly catches errors and renders the fallback UI or child components as expected.
* I created tests for the `App.tsx` loading and timeout logic to verify that loading indicators and error messages are displayed appropriately under different hydration scenarios.
These changes aim to make the webview more resilient to rendering errors and provide better feedback to you during initialization, improving the overall user experience and aiding in diagnosing future issues.
|
||
|---|---|---|
| .. | ||
| .storybook | ||
| audio | ||
| public | ||
| src | ||
| .eslintrc.json | ||
| .gitignore | ||
| .npmrc | ||
| components.json | ||
| index.html | ||
| jest.config.cjs | ||
| package-lock.json | ||
| package.json | ||
| tsconfig.json | ||
| vite.config.ts | ||