From 80fc23946102f050a1e4617c08dcbb65d2ef8249 Mon Sep 17 00:00:00 2001
From: Silviu Popa <silviucpopa@gmail.com>
Date: Tue, 20 Oct 2020 18:49:16 +0300
Subject: [PATCH] [AAE-3908] - fix clear value icon on card view text item
 (#6269)

---
 .../card-view-textitem.component.html         |  2 +-
 .../card-view-textitem.component.spec.ts      | 19 +++++++++++++++++++
 .../card-view-textitem.component.ts           |  1 +
 3 files changed, 21 insertions(+), 1 deletion(-)

diff --git a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html
index 20b942076f..7635dfafb4 100644
--- a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html
+++ b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.html
@@ -34,7 +34,7 @@
                     *ngIf="isEditable"
                     mat-icon-button
                     aria-label="Clear"
-                    (click)="editedValue=''">
+                    (click)="clearValue()">
                 <mat-icon>cancel</mat-icon>
             </button>
             <mat-icon matSuffix
diff --git a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts
index 2b59bf5ff9..27c7f45552 100644
--- a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts
+++ b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts
@@ -393,6 +393,25 @@ describe('CardViewTextItemComponent', () => {
             fixture.detectChanges();
             expect(clipboardService.copyContentToClipboard).toHaveBeenCalledWith('myValueToCopy', 'CORE.METADATA.ACCESSIBILITY.COPY_TO_CLIPBOARD_MESSAGE');
         });
+
+        it('should clear value when clear value icon is clicked', async () => {
+            component.property.value = 'testValue';
+            component.property.icon = 'FAKE_ICON';
+            component.property.clickable = true;
+            component.property.editable = true;
+            component.editable = true;
+            component.property.isValid = () => true;
+
+            fixture.detectChanges();
+            await fixture.whenStable();
+            fixture.detectChanges();
+            const clickEl = fixture.debugElement.query(By.css(`.adf-property-clear-value`));
+            clickEl.triggerEventHandler('click', new MouseEvent('click'));
+
+            fixture.detectChanges();
+            const elementValue = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`));
+            expect(elementValue.nativeElement.textContent).toEqual('');
+        });
     });
 
     describe('Update', () => {
diff --git a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.ts b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.ts
index 95289a4dc0..77e464f3ab 100644
--- a/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.ts
+++ b/lib/core/card-view/components/card-view-textitem/card-view-textitem.component.ts
@@ -175,6 +175,7 @@ export class CardViewTextItemComponent extends BaseCardView<CardViewTextItemMode
 
     clearValue() {
         this.editedValue = '';
+        this.textInput.setValue('');
     }
 
     copyToClipboard(valueToCopy: string) {