Advanced
Send render errors to a reporter
When PriceTag crashes, the error boundary shows a fallback, but nobody is told. Pass onCaughtError (and onUncaughtError too) to createRoot so every render error is reported with report(kind, error, errorInfo).
Finish report: it adds one <li> to the list #log (outside React, already in the HTML) with the text <kind>: <message> in <Component>, for example caught: Price is undefined in PriceTag. Get the component name from the first at Name in errorInfo.componentStack.
What Check tests
- The price shows and nothing is reported yet
- Breaking the price shows the boundary's fallback
- Exactly one report was added
- The report reads
caught: Price is undefined in PriceTag - Uncaught errors are reported too
Stuck? One hint at a time
The solution unlocks after your first Check. Try first: that is where the learning happens.
Runs in your browser. Your code is saved here.
Your page
Press Run to see the page.
Console
Nothing logged yet.