From ffb94740eaf6cd6fb4b7922e7cd6e189b2ebcf12 Mon Sep 17 00:00:00 2001
From: Julien Poyard <jpoy77@yahoo.com>
Date: Tue, 5 Jul 2022 07:45:24 +0200
Subject: [PATCH] fix(module:tree): tree select search slow in virtual mode

---
 components/tree/tree.component.ts |  5 +++-
 components/tree/tree.spec.ts      | 45 ++++++++++++++++++++-----------
 2 files changed, 34 insertions(+), 16 deletions(-)

diff --git a/components/tree/tree.component.ts b/components/tree/tree.component.ts
index eaf74fb531..514484ed9f 100644
--- a/components/tree/tree.component.ts
+++ b/components/tree/tree.component.ts
@@ -485,7 +485,10 @@ export class NzTreeComponent
 
   ngOnInit(): void {
     this.nzTreeService.flattenNodes$.pipe(takeUntil(this.destroy$)).subscribe(data => {
-      this.nzFlattenNodes = !!this.nzVirtualHeight && this.nzHideUnMatched ? data.filter(d => !d.canHide) : data;
+      this.nzFlattenNodes =
+        !!this.nzVirtualHeight && this.nzHideUnMatched && this.nzSearchValue?.length > 0
+          ? data.filter(d => !d.canHide)
+          : data;
       this.cdr.markForCheck();
     });
 
diff --git a/components/tree/tree.spec.ts b/components/tree/tree.spec.ts
index c6950fd317..52c88a0d7d 100644
--- a/components/tree/tree.spec.ts
+++ b/components/tree/tree.spec.ts
@@ -146,25 +146,40 @@ describe('tree', () => {
 
       [
         {
-          title: 'should display 7 nodes when hideUnMatched=false and virtualHeight = undefined',
-          when: { hideUnMatched: false },
-          then: 7
+          title:
+            "should display 7 nodes when hideUnMatched=false and virtualHeight = undefined and nzSearchValue = '0-1'",
+          when: { hideUnMatched: false, searchValue: '0-1' },
+          then: { matchedNodeList: 3, nzFlattenNodes: 7 }
         },
         {
-          title: "should display 7 nodes when hideUnMatched=false and virtualHeight = '300px'",
-          when: { hideUnMatched: false, virtualHeight: '300px' },
-          then: 7
+          title:
+            "should display 7 nodes when hideUnMatched=false and virtualHeight = '300px' and nzSearchValue = '0-1'",
+          when: { hideUnMatched: false, virtualHeight: '300px', searchValue: '0-1' },
+          then: { matchedNodeList: 3, nzFlattenNodes: 7 }
         },
         {
-          title: 'should display 7 nodes when hideUnMatched=true and virtualHeight = undefined',
-          when: { hideUnMatched: true },
-          then: 7
+          title:
+            "'should display 7 nodes when hideUnMatched=true and virtualHeight = undefined and nzSearchValue = '0-1'",
+          when: { hideUnMatched: true, searchValue: '0-1' },
+          then: { matchedNodeList: 3, nzFlattenNodes: 7 }
         },
         {
           title:
-            "should display 4 matched nodes based on nzSearchValue when hideUnMatched=true and virtualHeight = '300px'",
+            "should display 4 matched nodes based on nzSearchValue when hideUnMatched=true and virtualHeight = '300px' and nzSearchValue = undefined",
           when: { hideUnMatched: true, virtualHeight: '300px' },
-          then: 4
+          then: { matchedNodeList: 0, nzFlattenNodes: 3 }
+        },
+        {
+          title:
+            "should display 4 matched nodes based on nzSearchValue when hideUnMatched=true and virtualHeight = '300px' and nzSearchValue = ''",
+          when: { hideUnMatched: true, virtualHeight: '300px', searchValue: '' },
+          then: { matchedNodeList: 0, nzFlattenNodes: 3 }
+        },
+        {
+          title:
+            "should display 4 matched nodes based on nzSearchValue when hideUnMatched=true and virtualHeight = '300px' and nzSearchValue = '0-1'",
+          when: { hideUnMatched: true, virtualHeight: '300px', searchValue: '0-1' },
+          then: { matchedNodeList: 3, nzFlattenNodes: 4 }
         }
       ].forEach(({ title, when, then }) => {
         it(
@@ -172,7 +187,7 @@ describe('tree', () => {
           fakeAsync(() => {
             // Given
             const { component, fixture, nativeElement } = testBed;
-            component.searchValue = '0-1';
+            component.searchValue = when.searchValue;
             component.virtualHeight = when.virtualHeight;
             component.hideUnMatched = when.hideUnMatched;
             // When
@@ -182,13 +197,13 @@ describe('tree', () => {
             // Then
             expect(component.treeComponent.getMatchedNodeList().length)
               .withContext('treeComponent.getMatchedNodeList().length')
-              .toBe(3);
+              .toBe(then.matchedNodeList);
             expect(component.treeComponent.nzFlattenNodes.length)
               .withContext('treeComponent.nzFlattenNodes.length')
-              .toBe(then);
+              .toBe(then.nzFlattenNodes);
             expect(nativeElement.querySelectorAll('nz-tree-node').length)
               .withContext('number of displayed nz-tree-node elements')
-              .toBe(then);
+              .toBe(then.nzFlattenNodes);
           })
         );
       });