candle-annotator/openspec/changes/archive/2026-02-20-code-review-fix/specs/error-boundary/spec.md at 925e7284e33f1af4d058fe210335c44a2f50a316

Marko Djordjevic 925e7284e3 Archive code-review-fix change and sync specs to main

- 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>

2026-02-20 08:54:59 +01:00

1.3 KiB

Raw Blame History

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

1.3 KiB Raw Blame History