angular / components

Component infrastructure and Material Design components for Angular
https://material.angular.io
MIT License
24.39k stars 6.76k forks source link

bug(mat-tree): TreeControl's getChildren is called unexpectedly many times since cdk/material v18.2.0 and is especially problematic with asynchronous actions #30014

Open lmuraru-plenty opened 1 week ago

lmuraru-plenty commented 1 week ago

Is this a regression?

The previous version in which this bug was not present was

18.1.5

Description

I've recently upgraded a project's @angular/cdk & @angular/material packages to 18.2, and I noticed a problem with the TreeControl when getChildren was asynchronous: sometimes it would result in an infinite loop of asynchronous actions; other times, it would perform a very large number of asynchronous actions; previous to 18.2 (18.1.5 was the last version it worked as expected), it would have only started a single asynchronous action per node. This is especially noticeable when the asynchronous action involves some kind of XHR.

Looking a bit further into it, I noticed that synchronous getChildren calls have also regressed in 18.2.0: there are now a lot more calls to this method than in cdk/material 18.1.5.

Reproduction

18.2.X:

StackBlitz link: StackBlitz 18.2.X Steps to reproduce:

  1. Play around with the expand icons
  2. Notice the number of calls to getChildren at the top of the rendered page - it increases wildly more than the previous minor cdk/material version, and sometimes enters a seemingly infinite loop

Expected Behavior

There should be exactly 1 call to getChildren for each expanded node

18.1.X:

StackBlitz link: StackBlitz 18.1.X Steps to reproduce:

  1. Play around with the expand icons
  2. Notice the number of calls to getChildren at the top of the rendered page - it increases by 1 for each expanded node

Actual Behavior

The number of calls to getChildren increases wildly, and I've also managed to un-deterministically enter a seemingly infinite loop.

Environment