bug(TREE): Tree with nested nodes renders child-nodes twice with new childrenAccessor

[BeniFreitag]

trafficstars

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

Angular 18.1 or 18.2.6 with the deprecated NestedTreeControl.

Description

Tree with nested nodes (childrenAccessor) renders child-nodes twice, when there's are items having no children.

Reproduction

StackBlitz link Steps to reproduce:

1. start with this example: Tree with nested nodes (childrenAccessor)
2. add a new item at the beginning of the datasource, having no children (e.g. { name: 'Sample' })
3. expand Fruit or Vegetables, the children are rendered twice.

Expected Behavior

Child nodes should be rendered once.

Actual Behavior

Child nodes are rendered twice.

Additional Information

Only occours when using the new childrenAccessor in Angular 18.2. It workes with the depricated NestedTreeControl.

Environment

• Angular: 18.2.6
• CDK/Material: 18.2.6
• Browser(s): Chrome 129
• Operating System (e.g. Windows, macOS, Ubuntu): Windows

[adelinor]

I am facing the same issue. Reverting CDK/Material to version 18.1.0 did not resolve this issue for me.

[wagnermaciel]

This appears to be fixed in our latest version 18.2.9

https://stackblitz.com/edit/qbsqut?file=src%2Fexample%2Ftree-flat-child-accessor-overview-example.ts

[angular-automatic-lock-bot[bot]]

This issue has been automatically locked due to inactivity. Please file a new issue if you are encountering a similar or related problem.

Read more about our automatic conversation locking policy.

_{This action has been performed automatically by a bot.}