Skip to content

fix(combo): address NG0100 in zoneless apps - 21.2.x#17315

Open
ddaribo wants to merge 4 commits into
21.2.xfrom
bpachilova/combo-ng0100-fix-17310-21.2.x
Open

fix(combo): address NG0100 in zoneless apps - 21.2.x#17315
ddaribo wants to merge 4 commits into
21.2.xfrom
bpachilova/combo-ng0100-fix-17310-21.2.x

Conversation

@ddaribo

@ddaribo ddaribo commented Jun 8, 2026

Copy link
Copy Markdown
Contributor

Closes #17310

Description

Addresses the causes of NG0100 error in zoneless apps.

  1. 'attr.aria-activedescendant: As the focusedItem is read from a QueryList, when a focused item scrolls out of the viewport, the children QueryList no longer contains it and focusedItem would be null. The IgxDropDownItemNavigationDirective activeDescendant HostBinding reads the target's (dropdown) activeDescendant field, which calls focusedItem. With Angular's new zoneless run-time, on scroll the value gets updated between two diferent change detection passes, so the error is thrown.
    The fix caches the active desc. id in the combo-dropdown component.

  2. combo item template bindings properties errors - Sync _selected and _disableTransitions from the comboApi service once per CD cycle - in ngDoCheck.

Motivation / Context

Prevent the NG0100 error.

Type of Change (check all that apply):

  • Bug fix
  • New functionality
  • Breaking change (fix or feature that would cause existing functionality to not work as expected)
  • Refactoring (no functional changes)
  • Documentation
  • Demos
  • CI/CD
  • Tests
  • Changelog
  • Skills/Agents

Component(s) / Area(s) Affected:

Combo, Simple combo

How Has This Been Tested?

  • Unit tests
  • Manual testing
  • Automated e2e tests

Test Configuration:

  • Angular version:
  • Browser(s):
  • OS:

Screenshots / Recordings

Checklist:

  • All relevant tags have been applied to this PR
  • This PR includes unit tests covering all the new code (test guidelines)
  • This PR includes API docs for newly added methods/properties (api docs guidelines)
  • This PR includes feature/README.MD updates for the feature docs
  • This PR includes general feature table updates in the root README.MD
  • This PR includes CHANGELOG.MD updates for newly added functionality
  • This PR contains breaking changes
  • This PR includes ng update migrations for the breaking changes (migrations guidelines)
  • This PR includes behavioral changes and the feature specification has been updated with them
  • Accessibility (ARIA, keyboard navigation, focus management) has been verified

Copilot AI review requested due to automatic review settings June 8, 2026 12:29

Copilot AI left a comment

Copy link
Copy Markdown
Contributor

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Pull request overview

This PR addresses NG0100: ExpressionChangedAfterItHasBeenCheckedError occurrences in IgxCombo / IgxSimpleCombo when running under Angular zoneless change detection, primarily triggered by virtual scrolling interactions.

Changes:

  • Cache a stable aria-activedescendant id in IgxComboDropDownComponent to avoid QueryList-driven focusedItem fluctuations during virtual scroll.
  • Stabilize combo item template-bound values by syncing selection/transition state once per CD cycle (ngDoCheck) in IgxComboItemComponent.
  • Add zoneless-focused unit tests to reproduce/guard against the reported scrolling NG0100 regressions (issue #17310).

Reviewed changes

Copilot reviewed 4 out of 4 changed files in this pull request and generated 4 comments.

File Description
projects/igniteui-angular/drop-down/src/drop-down/drop-down.base.ts Adjusts activeDescendant typing to support null and (with suggested fix) ensures stable nullish semantics.
projects/igniteui-angular/combo/src/combo/combo.component.spec.ts Adds zoneless test coverage to ensure virtual scroll + active-descendant scenarios no longer throw NG0100.
projects/igniteui-angular/combo/src/combo/combo-item.component.ts Caches selection/transition values per CD cycle via ngDoCheck to stabilize template bindings.
projects/igniteui-angular/combo/src/combo/combo-dropdown.component.ts Implements cached active-descendant id and updates it on focus/selection changes to avoid scroll-time NG0100.

Comment thread projects/igniteui-angular/drop-down/src/drop-down/drop-down.base.ts Outdated
Comment thread projects/igniteui-angular/combo/src/combo/combo-dropdown.component.ts Outdated
@ddaribo ddaribo force-pushed the bpachilova/combo-ng0100-fix-17310-21.2.x branch 2 times, most recently from 5bcbaa9 to 7b6b120 Compare June 8, 2026 12:49
@ddaribo ddaribo force-pushed the bpachilova/combo-ng0100-fix-17310-21.2.x branch from 7b6b120 to 91ed5a8 Compare June 8, 2026 12:50
@ddaribo ddaribo linked an issue Jun 8, 2026 that may be closed by this pull request
@ddaribo ddaribo requested a review from MonikaKirkova June 9, 2026 10:34
@RivaIvanova RivaIvanova added 💥 status: in-test PRs currently being tested and removed ❌ status: awaiting-test PRs awaiting manual verification labels Jun 9, 2026
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Projects

None yet

Development

Successfully merging this pull request may close these issues.

IgxCombo, IgxSimpleCombo throw NG0100 in zoneless apps

4 participants