fix(grid): fix zone.onStable patterns broken in zoneless change detection - 22.0.x#17386
Open
viktorkombov wants to merge 2 commits into
Open
fix(grid): fix zone.onStable patterns broken in zoneless change detection - 22.0.x#17386viktorkombov wants to merge 2 commits into
viktorkombov wants to merge 2 commits into
Conversation
viktorkombov
added
❌ status: awaiting-test
Contributor
There was a problem hiding this comment.
Pull request overview
This PR fixes multiple Grid (and related) behaviors that previously relied on NgZone.onStable as a post-render scheduling signal, which does not emit under Angular’s zoneless change detection. It replaces those onStable patterns with render-bound scheduling and adds zoneless regression coverage across grid, hierarchical grid, tree grid, pivot grid, and for-of virtualization paths.
Changes:
- Introduces
runAfterRenderOnce(injector, cb, phase?)(core) and migrates deferred work fromNgZone.onStabletoafterNextRenderacross grid/virtualization/autosize/navigation code paths. - Updates grid behaviors to better notify/refresh in zoneless mode (e.g., signal-backed filter-row visibility, resize-driven chip recalculation, explicit resize notifications, keyboard navigation scroll activation).
- Adds/updates extensive unit tests and shared async helpers, including new zoneless-spec variants using
provideZonelessChangeDetection().
Reviewed changes
Copilot reviewed 31 out of 31 changed files in this pull request and generated 4 comments.
Show a summary per file
| File | Description |
|---|---|
| projects/igniteui-angular/test-utils/helper-utils.spec.ts | Adds shared async helpers for scroll/navigation settling and zoneless-friendly scroll detection. |
| projects/igniteui-angular/query-builder/src/query-builder/query-builder.component.spec.ts | Adjusts invalid sample test setup to use an empty FilteringExpressionsTree. |
| projects/igniteui-angular/grids/tree-grid/src/tree-grid.component.spec.ts | Adds zoneless auto-generated-columns coverage; updates timing awaits. |
| projects/igniteui-angular/grids/tree-grid/src/tree-grid-summaries.spec.ts | Adds zoneless runtime summary-settings test coverage; updates settling awaits. |
| projects/igniteui-angular/grids/tree-grid/src/tree-grid-keyBoardNav.spec.ts | Refactors scroll-driven navigation waits; adds zoneless navigation suite. |
| projects/igniteui-angular/grids/pivot-grid/src/pivot-grid.component.ts | Migrates post-render dimension autosizing from onStable to runAfterRenderOnce. |
| projects/igniteui-angular/grids/pivot-grid/src/pivot-grid-keyboard-nav.spec.ts | Uses settle helper to avoid fixed-delay races in virtualization navigation tests. |
| projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.virtualization.spec.ts | Improves scroll settling using shared helpers; adds a zoneless virtualization suite. |
| projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid.navigation.spec.ts | Refactors navigation tests to settle scroll/render deterministically; adds zoneless coverage. |
| projects/igniteui-angular/grids/hierarchical-grid/src/hierarchical-grid-navigation.service.ts | Subscribes to chunkLoad before scrolling to avoid missing synchronous emissions. |
| projects/igniteui-angular/grids/grid/src/grid.zoneless.spec.ts | Adds a new zoneless regression spec suite for core grid scenarios. |
| projects/igniteui-angular/grids/grid/src/grid.search.spec.ts | Adds zoneless search+grouping coverage and improves scroll/chunkLoad synchronization. |
| projects/igniteui-angular/grids/grid/src/grid.master-detail.spec.ts | Refactors scroll-driven activation waits; adds zoneless master-detail navigation coverage. |
| projects/igniteui-angular/grids/grid/src/grid.groupby.spec.ts | Adds zoneless regression coverage for horizontal virtualization state restoration. |
| projects/igniteui-angular/grids/grid/src/grid.component.spec.ts | Replaces fixed delays with settle helper; adds zoneless aria-attribute regression coverage. |
| projects/igniteui-angular/grids/grid/src/grid-mrl-keyboard-nav.spec.ts | Uses shared navigation-with-scroll helper; adds zoneless MRL navigation scenarios. |
| projects/igniteui-angular/grids/grid/src/grid-keyBoardNav.spec.ts | Improves zoned timing comments and adds zoneless keyboard-navigation coverage for virtual grids. |
| projects/igniteui-angular/grids/grid/src/grid-keyBoardNav-headers.spec.ts | Reworks tests away from fakeAsync where afterNextRender is involved; adds zoneless header navigation tests. |
| projects/igniteui-angular/grids/grid/src/grid-filtering-ui.spec.ts | Adds zoneless filtering-row UI coverage and adjusts resize interactions/waits. |
| projects/igniteui-angular/grids/grid/src/grid-cell-selection.spec.ts | Uses settle helper for scroll-driven selection; adds zoneless selection regression coverage. |
| projects/igniteui-angular/grids/grid/src/grid-base.directive.ts | Migrates multiple onStable-based paths to runAfterRenderOnce; removes NoopNgZone detection; hardens navigation callback invocation. |
| projects/igniteui-angular/grids/grid/src/column.spec.ts | Fixes minor statement issues; adds zoneless date/time editor-format regression coverage. |
| projects/igniteui-angular/grids/grid/src/column-group.spec.ts | Makes width assertions more robust (pixel tolerance); adds zoneless width regression coverage. |
| projects/igniteui-angular/grids/core/src/resizing/resizing.service.ts | Notifies grid after pointer-resize via post-render scheduling to support zoneless. |
| projects/igniteui-angular/grids/core/src/grid-navigation.service.ts | Expands scroll-notification logic for keyboard navigation (not just ctrl-modified keys). |
| projects/igniteui-angular/grids/core/src/filtering/grid-filtering.service.ts | Makes isFilterRowVisible signal-backed to trigger OnPush template updates in zoneless mode. |
| projects/igniteui-angular/grids/core/src/filtering/base/grid-filtering-cell.component.ts | Observes filter-cell size changes and marks for check so chip visibility recomputes after resizes. |
| projects/igniteui-angular/directives/src/directives/for-of/for_of.directive.ts | Replaces onStable/afterNextRender scattered logic with runAfterRenderOnce; fixes reduce initial value. |
| projects/igniteui-angular/directives/src/directives/for-of/for_of.directive.spec.ts | Adds zoneless virtualization sizing regression tests for for-of scroll recalculation. |
| projects/igniteui-angular/core/src/core/utils.ts | Introduces runAfterRenderOnce helper (afterNextRender wrapper) as the central deferred-render scheduler. |
| projects/igniteui-angular-elements/src/app/custom-strategy.spec.ts | Replaces fixed timer waits with a deterministic childrenResolved event await. |
viktorkombov
added
❌ do not merge
and removed
❌ status: awaiting-test
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Closes #17364
Closes #17385
Closes #17318
Closes #17280
What
Grid virtualization, autosizing, and keyboard navigation relied on
NgZone.onStable, which never emits in zoneless apps. As a result, scroll-drivenchunkLoad, column autosize, filter-row rendering, and post-scroll cell activation silently never ran.This migrates all of that off
onStableand onto Angular’s render hooks.Changes
Core
Added a new central helper:
runAfterRenderOnce(injector, cb, phase?)incore/utils.ts.onStable/ɵNoopNgZonebranches.Updated every affected call site to go through
runAfterRenderOnce.Removed the private
ɵNoopNgZone-based zoneless detection.Removed the duplicated per-class
runAfterRenderhelpers.Grids
IgxFilteringService.isFilterRowVisibleis now signal-backed, so theOnPushheader row re-renders without requiring a zone tick.ResizeObserverto recompute visible chips after resize.notifyResized, instead of relying on an emptyzone.run.Ctrl.chunkLoadbefore scrolling, avoiding missed synchronous emissions.for_of,grid-base, andpivot-gridwas migrated torunAfterRenderOnce.Tests
Added zoneless duplicates using
provideZonelessChangeDetectionfor the affected grid, tree, hierarchical, and pivot suites.Centralized async test helpers in
helper-utils.spec.ts.runAfterRenderOnceconsumers now settle through shared helpers:waitForGridSettlesetGridVerticalScrollTopdispatchGridScrollEventsnavigateWithGridScrollUpdated the zoned originals to await the new render-boundary timing.
onStable.Notes
Behavior for zoned apps is unchanged in practice.
onStabletoafterNextRender.No
runOutsideAngularwas removed.No forced
detectChangeswas added in zoneless tests.Motivation / Context
Type of Change (check all that apply):
Component(s) / Area(s) Affected:
How Has This Been Tested?
Test Configuration:
Screenshots / Recordings
Checklist:
feature/README.MDupdates for the feature docsREADME.MDCHANGELOG.MDupdates for newly added functionalityng updatemigrations for the breaking changes (migrations guidelines)