925e7284e3
- Synced 14 capability delta specs to main specs - Created 6 new main specs: api-authentication, error-boundary, input-validation, security-headers, shared-types - Updated 8 existing specs with security, validation, and performance requirements - Archived change to openspec/changes/archive/2026-02-20-code-review-fix/ Co-Authored-By: Claude Sonnet 4.6 <noreply@anthropic.com>
23 lines
1.3 KiB
Markdown
23 lines
1.3 KiB
Markdown
## ADDED Requirements
|
|
|
|
### Requirement: React Error Boundary component
|
|
The application SHALL include a React Error Boundary component that catches JavaScript errors in its child component tree and renders a fallback UI instead of crashing to a white screen. The fallback SHALL display: an error message, a "Reload" button that calls `window.location.reload()`, and a "Try Again" button that resets the error boundary state.
|
|
|
|
#### Scenario: Child component throws during render
|
|
- **WHEN** CandleChart or any child component throws an error during rendering
|
|
- **THEN** the Error Boundary catches the error and renders the fallback UI instead of a white screen
|
|
|
|
#### Scenario: Fallback UI interaction
|
|
- **WHEN** the user sees the error fallback and clicks "Try Again"
|
|
- **THEN** the Error Boundary resets its state and attempts to re-render the child component tree
|
|
|
|
#### Scenario: Error logging
|
|
- **WHEN** the Error Boundary catches an error
|
|
- **THEN** the error and component stack are logged via `console.error`
|
|
|
|
### Requirement: Error Boundary placement in layout
|
|
The root layout (`src/app/layout.tsx`) SHALL wrap `{children}` with the Error Boundary component so that any render error in any page is caught.
|
|
|
|
#### Scenario: Layout wraps children
|
|
- **WHEN** the application renders any page
|
|
- **THEN** the page content is wrapped inside an Error Boundary
|