Angular 22 made OnPush the default.

Your Eager component now depends on who renders it.

a timer sets store.last 100→101 one change detection pass runs
EagerParentMIGRATED TO EAGER
EagerPriceCHECKED
renders101
GeneratedParentONPUSH · NOT MARKED
EagerPriceNEVER REACHED
renders100the same component, the same store
WHAT GETS THAT BRANCH CHECKED
  • a DOM event handled inside the child
  • a new input on the OnPush parent
  • a signal read in the child's template
  • markForCheck() on the child
A timer, a WebSocket message or an HTTP callback writing a plain field is none of them.
Angular 22.1.6 · TypeScript 6.0.3 · every value asserted by the demo's 18 tests
gdhami.net