angular / angular/components

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

Ouverte
#30,014 4 commentaires 12 réactions 0 personnes assignées Voir sur GitHub
area: cdk/tree P3
Langage dominant
TypeScript
Étoiles
25k
Forks
6.8k
Merge moyen
1 j 8 h
PR mergées (30 j)
91

Description

### Is this a regression?

- [x] Yes, this behavior used to work in the previous version

### 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](https://stackblitz.com/edit/stackblitz-starters-acc226?file=src%2Fmain.ts)
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](https://stackblitz.com/edit/stackblitz-starters-pkwrp2?file=src%2Fmain.ts)
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

- Angular: 18.X.Y (reproduced on 18.1.X and 18.2.X)
- CDK/Material: all versions since 18.2.0
- Browser(s): Google Chrome 130
- Operating System (e.g. Windows, macOS, Ubuntu): macOS

Guide de contribution

Ouvrir le guide de contribution

Piste de recherche

Commencez par les reproductions StackBlitz liées et comparez le nombre d’appels à getChildren entre 18.1.5 et 18.2.X lors du développement des nœuds. Suivez le chemin TreeControl de mat-tree qui appelle getChildren, puis vérifiez que le correctif produit exactement un appel pour chaque nœud développé, y compris les enfants asynchrones.

Rédigé par le modèle d'indexation à partir du texte de l'issue.

Évaluation

Stack technique
angular, typescript
Domaine
frontend
Type d'issue
Bug
Difficulté
4/5
Temps estimé
3-5 jours
Activité
À l'abandon
Clarté
Plutôt claire
Accessibilité débutants
35/100

Recevez les nouvelles issues par e-mail

Un résumé court des issues GitHub adaptées aux débutants.