Skip to content

fix(grid): correct Excel filter virtual sizing - 21.2.x - #17526

Open
viktorkombov wants to merge 1 commit into
21.2.xfrom
vkombov/fix-17521-21.2.x
Open

fix(grid): correct Excel filter virtual sizing - 21.2.x#17526
viktorkombov wants to merge 1 commit into
21.2.xfrom
vkombov/fix-17521-21.2.x

Conversation

@viktorkombov

Copy link
Copy Markdown
Contributor

Closes #17513
Closes #17521

Description

Uses the first rendered Excel-style filter item to initialize the virtual item size. Theme-specific spacing is kept within the measured item, stabilizing the scrollbar and ensuring the last Indigo item is reachable.

Motivation / Context

The configured virtual item size could differ from the rendered height, causing scrollbar thumb lag. In the Indigo theme, the scroll range could also end before the last item was fully visible.

Type of Change (check all that apply):

  • Bug fix
  • New functionality
  • Breaking change
  • Refactoring (no functional changes)
  • Documentation
  • Demos
  • CI/CD
  • Tests
  • Changelog
  • Skills/Agents

Component(s) / Area(s) Affected:

  • Grid Excel-style filtering
  • Fluent and Indigo styles
  • Virtual item sizing

How Has This Been Tested?

  • Unit tests
  • Manual testing
  • Automated e2e tests

Added unit coverage verifying that the rendered item height is applied to the virtualizer. Manually verified the Indigo StackBlitz reproduction by dragging the scrollbar thumb to the bottom.

Test Configuration:

  • Angular version: 22
  • Browser(s): Chrome
  • OS: Windows

Screenshots / Recordings

See the recording attached to the related issue.

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
  • This PR contains breaking changes
  • This PR includes ng update migrations for breaking changes (migrations guidelines)
  • This PR includes behavioral changes and the feature specification has been updated
  • Accessibility (ARIA, keyboard navigation, focus management) has been verified

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

Fixes Excel-style filtering virtualization sizing in Ignite UI for Angular grids by deriving the virtual item height from the first rendered list item, preventing scrollbar thumb lag and ensuring the last item remains reachable (notably in Indigo).

Changes:

  • Initialize the Excel-style search virtual item size from a measured rendered list item height.
  • Adjust Indigo/Fluent Excel-filtering styles to keep theme spacing aligned with virtualization sizing assumptions.
  • Add/extend unit test coverage to verify the measured item size is applied to the virtualizer.

Reviewed changes

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

Show a summary per file
File Description
src/app/virtual-for-directive/virtual-for.sample.html Updates the virtualization sample markup to apply heights on the list-item host (supports consistent sizing behavior).
src/app/virtual-for-directive/virtual-for.sample.css Ensures list item content fills the fixed-height host in the sample (height: 100%).
projects/igniteui-angular/grids/grid/src/grid-filtering-ui.spec.ts Adds a unit test asserting rendered item height is propagated to the virtualizer item size and cache.
projects/igniteui-angular/grids/core/src/filtering/excel-style/excel-style-search.component.ts Measures the first rendered Excel filter list item to stabilize itemSize used by the virtualizer.
projects/igniteui-angular/core/src/core/styles/components/grid/_excel-filtering-theme.scss Adjusts Fluent/Indigo styling to keep spacing consistent with measured/virtualized item sizing.

💡 Add a code-review agent skill for context-aware, tailored reviews. Learn more in the docs.

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.

2 participants