Skip to content

fix(grid): prevent NaN column width when hidden grid has all columns sized#17457

Open
viktorkombov wants to merge 3 commits into
masterfrom
vkombov/fix-17425
Open

fix(grid): prevent NaN column width when hidden grid has all columns sized#17457
viktorkombov wants to merge 3 commits into
masterfrom
vkombov/fix-17425

Conversation

@viktorkombov

@viktorkombov viktorkombov commented Jul 23, 2026

Copy link
Copy Markdown
Contributor

Closes #17418

Description

getPossibleColumnWidth() divided the available width by columnsToSize when every visible column already had an explicit or constrained width.

When the grid is hidden through a wrapper and has no measurable width, calcWidth falls back to the sum of the column widths. In this case, computedWidth equals sumExistingWidths and columnsToSize is 0, resulting in 0 / 0 = NaN. This then poisons the cached column widths and can cause an infinite sizing loop.

When the grid is using the column-width sum fallback and there are no columns left to auto-size, return the "0px" sentinel so the existing valid column widths are preserved.

Motivation / Context

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:

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 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 a grid column autosizing edge case where getPossibleColumnWidth() could divide by zero when all visible columns already have explicit/constrained widths, which—especially for grids hidden via a wrapper (display: none) and without an explicit grid width—could yield NaN/Infinity and poison cached column width calculations.

Changes:

  • Added a guard in getPossibleColumnWidth() to return the grid’s default minimum column width when columnsToSize <= 0, avoiding division by zero.
  • Added a unit test reproducing the hidden-wrapper scenario to ensure no NaN width is produced and cached pixel widths remain finite.

Reviewed changes

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

File Description
projects/igniteui-angular/grids/grid/src/grid-base.directive.ts Prevents NaN/Infinity possible-width derivation by early-returning a safe fallback when no columns remain to auto-size.
projects/igniteui-angular/grids/grid/src/column.spec.ts Adds a regression test covering the hidden-wrapper + all-columns-sized scenario and validates computed widths remain finite.

@viktorkombov viktorkombov added 🛠️ status: in-development Issues and PRs with active development on them and removed ❌ status: awaiting-test PRs awaiting manual verification labels Jul 24, 2026
Copilot AI review requested due to automatic review settings July 24, 2026 08:34
@viktorkombov viktorkombov added ❌ status: awaiting-test PRs awaiting manual verification and removed 🛠️ status: in-development Issues and PRs with active development on them labels Jul 24, 2026

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

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

Comment thread projects/igniteui-angular/grids/grid/src/grid-base.directive.ts Outdated
Comment thread projects/igniteui-angular/grids/grid/src/grid-base.directive.ts
Copilot AI review requested due to automatic review settings July 24, 2026 09:03

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

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

Comments suppressed due to low confidence (1)

projects/igniteui-angular/grids/grid/src/grid-base.directive.ts:5647

  • getPossibleColumnWidth() still divides by columnsToSize without guaranteeing it’s > 0. The new guard only covers isColumnWidthSum, but columnsToSize can also be 0 (or negative) when all visible columns have explicit/constrained widths even with a measurable grid width, leading to Infinity/NaN widths and poisoning _columnWidth/defaultWidth caches. Consider short-circuiting whenever columnsToSize <= 0 to avoid the division entirely.
        // When the grid has no measurable width, calculateGridWidth() falls back to the
        // sum of its column widths and sets isColumnWidthSum. If all visible columns
        // already have explicit or constrained widths, columnsToSize is 0 and
        // computedWidth equals sumExistingWidths, resulting in 0 / 0 = NaN.
        // Return the "0px" sentinel so _derivePossibleWidth() preserves the existing
        // valid column widths.
        if (columnsToSize <= 0 && this.isColumnWidthSum) {
            return '0px';
        }

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Grid throws "Maximum call stack size exceeded" and becomes unresponsive when binding an empty data source while hidden (display:none)

2 participants