[Angular] Error boundaries: wrap heavy third-party widgets in @boundary and route onViewError through GlobalErrorHandler (after Angular 22.2) #1166

New Issue

2026-10-02T04:44:19Z

spikerj commented

2026-10-02 04:44:19 +00:00

Why

Angular 22.2 adds @boundary template blocks (developer preview) plus an onViewError hook: a render-time error in one widget shows a fallback instead of taking out the whole view (today: blank page / broken route).

Ref: https://blog.ninja-squad.com/2026/09/23/what-is-new-angular-22.2

What changes for us

We already have a custom ErrorHandler → client-error reporting: libraries/platform/error-reporting/src/lib/provide-error-reporting.ts (~L12). Wire onViewError into it so boundary-caught errors are still reported.
Candidate hosts (heaviest third-party render surfaces): three.js scenes (space game, night-sky viewer, globe), monaco editors (playgrounds), maplibre / leaflet / google maps views, ngx-extended-pdf-viewer, v86 emulator. 54 files already use @defer — boundary placement can follow those seams.
Add a shared fallback component (themed, "this panel failed to load — retry / report") reusing the quick-actions "report an issue" flow.

Acceptance criteria

@boundary around at least the widgets above, with a shared fallback
errors caught by a boundary are reported via the existing error-reporting pipeline
specs prove a throwing child renders the fallback while siblings stay alive

Blocked by the Angular 22.2 upgrade ticket. Size: M. Developer preview — keep the surface small.

Links: Blocked by #1165.

Filed from the 2026-10-02 spikersoft-angular pnpm outdated changelog review.

## Why Angular 22.2 adds **`@boundary`** template blocks (developer preview) plus an `onViewError` hook: a render-time error in one widget shows a fallback instead of taking out the whole view (today: blank page / broken route). Ref: https://blog.ninja-squad.com/2026/09/23/what-is-new-angular-22.2 ## What changes for us - We already have a custom `ErrorHandler` → client-error reporting: `libraries/platform/error-reporting/src/lib/provide-error-reporting.ts` (~L12). Wire `onViewError` into it so boundary-caught errors are still reported. - Candidate hosts (heaviest third-party render surfaces): three.js scenes (space game, night-sky viewer, globe), monaco editors (playgrounds), maplibre / leaflet / google maps views, ngx-extended-pdf-viewer, v86 emulator. 54 files already use `@defer` — boundary placement can follow those seams. - Add a shared fallback component (themed, "this panel failed to load — retry / report") reusing the quick-actions "report an issue" flow. ## Acceptance criteria - [ ] `@boundary` around at least the widgets above, with a shared fallback - [ ] errors caught by a boundary are reported via the existing error-reporting pipeline - [ ] specs prove a throwing child renders the fallback while siblings stay alive **Blocked by** the Angular 22.2 upgrade ticket. Size: **M**. Developer preview — keep the surface small. **Links:** Blocked by #1165. --- _Filed from the 2026-10-02 spikersoft-angular `pnpm outdated` changelog review._

spikerj added the enhancement label 2026-10-02 04:44:19 +00:00

spikerj referenced this issue

2026-10-02 04:44:29 +00:00

[Angular] Upgrade to Angular 22.2 + Vitest 5 + jsdom 30.1 once Nx supports 22.2 (blocked on Nx 23.3 / nrwl/nx#37234) #1165

Sign in to join this conversation.

1 Participants

Notifications

Due Date

No due date set.

Dependencies

No dependencies set.

Reference: spikerj/spikersoft-issues#1166