[AAE-485] Fix card view int item validator (#5135)

* [AAE-485] Fix card view int item validator

* Improve code

* Fix unit tests

* Remove outdated test

* Fix login of int validator

* Fix e2e test

* fix linting

lib/content-services/content-metadata/components/content-metadata-card/content-metadata-card.component.spec.ts

@@ -83,7 +83,7 @@ describe('ContentMetadataCardComponent', () => {
         expect(contentMetadataComponent.preset).toBe(preset);
     });
 
-    it('should pass through the preset to the underlying component', () => {
+    it('should pass through the displayEmpty to the underlying component', () => {
         component.displayEmpty = true;
         fixture.detectChanges();
         const contentMetadataComponent = fixture.debugElement.query(By.directive(ContentMetadataComponent)).componentInstance;

lib/content-services/content-metadata/components/content-metadata/mock-data.ts

@@ -32,7 +32,7 @@ export const mockGroupProperties = [
                 'multiline': false,
                 'pipes': [],
                 'clickCallBack': null,
-                displayValue: 400
+                'displayValue': 400
             },
             {
                 'label': 'Image Height',
@@ -47,7 +47,7 @@ export const mockGroupProperties = [
                 'multiline': false,
                 'pipes': [],
                 'clickCallBack': null,
-                displayValue: 400
+                'displayValue': 400
             }
         ]
     },
@@ -67,7 +67,7 @@ export const mockGroupProperties = [
                 'multiline': false,
                 'pipes': [],
                 'clickCallBack': null,
-                displayValue: 400
+                'displayValue': 400
             }
         ]
     }

lib/core/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts

@@ -77,22 +77,6 @@ describe('CardViewTextItemComponent', () => {
             expect(value.nativeElement.innerText.trim()).toBe('User Name');
         });
 
-        it('should NOT render the default as value if the value is empty, editable is false and displayEmpty is false', () => {
-            component.property = new CardViewTextItemModel({
-                label: 'Text label',
-                value: '',
-                key: 'textkey',
-                default: 'FAKE-DEFAULT-KEY',
-                editable: false
-            });
-            component.displayEmpty = false;
-            fixture.detectChanges();
-
-            const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`));
-            expect(value).not.toBeNull();
-            expect(value.nativeElement.innerText.trim()).toBe('');
-        });
-
         it('should render the default as value if the value is empty, editable is false and displayEmpty is true', () => {
             component.property = new CardViewTextItemModel({
                 label: 'Text label',
@@ -125,22 +109,6 @@ describe('CardViewTextItemComponent', () => {
             expect(value.nativeElement.innerText.trim()).toBe('FAKE-DEFAULT-KEY');
         });
 
-        it('should NOT render the default as value if the value is empty, clickable is false and displayEmpty is false', () => {
-            component.property = new CardViewTextItemModel({
-                label: 'Text label',
-                value: '',
-                key: 'textkey',
-                default: 'FAKE-DEFAULT-KEY',
-                clickable: false
-            });
-            component.displayEmpty = false;
-            fixture.detectChanges();
-
-            const value = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${component.property.key}"]`));
-            expect(value).not.toBeNull();
-            expect(value.nativeElement.innerText.trim()).toBe('');
-        });
-
         it('should render the default as value if the value is empty, clickable is false and displayEmpty is true', () => {
             component.property = new CardViewTextItemModel({
                 label: 'Text label',

lib/core/card-view/components/card-view/card-view.component.spec.ts

@@ -42,7 +42,7 @@ describe('CardViewComponent', () => {
     });
 
     it('should render the label and value', async(() => {
-        component.properties = [new CardViewTextItemModel({label: 'My label', value: 'My value', key: 'some key'})];
+        component.properties = [new CardViewTextItemModel({ label: 'My label', value: 'My value', key: 'some key' })];
         fixture.detectChanges();
         fixture.whenStable().then(() => {
             fixture.detectChanges();
@@ -93,30 +93,6 @@ describe('CardViewComponent', () => {
         });
     }));
 
-    it('should NOT render anything if the value is empty, not editable and displayEmpty is false', async(() => {
-        component.properties = [new CardViewTextItemModel({
-            label: 'My default label',
-            value: null,
-            default: 'default value',
-            key: 'some-key',
-            editable: false
-        })];
-        component.editable = true;
-        component.displayEmpty = false;
-        fixture.detectChanges();
-
-        fixture.whenStable().then(() => {
-            fixture.detectChanges();
-
-            const labelValue = fixture.debugElement.query(By.css('.adf-property-label'));
-            expect(labelValue).toBeNull();
-
-            const value = fixture.debugElement.query(By.css('.adf-property-value'));
-            expect(value).not.toBeNull();
-            expect(value.nativeElement.innerText.trim()).toBe('');
-        });
-    }));
-
     it('should render the default value if the value is empty, not editable and displayEmpty is true', async(() => {
         component.properties = [new CardViewTextItemModel({
             label: 'My default label',

lib/core/card-view/models/card-view-textitem.model.spec.ts

@@ -46,12 +46,13 @@ describe('CardViewTextItemModel', () => {
             expect(itemModel.displayValue).toBe('Banuk');
         });
 
-        it('should return the default value if the value is not present', () => {
+        it('should return the default value if the value is not present the first time it loads', () => {
             properties.value = undefined;
             properties.default = 'default-value';
             const itemModel = new CardViewTextItemModel(properties);
-
             expect(itemModel.displayValue).toBe('default-value');
+            itemModel.value = '';
+            expect(itemModel.displayValue).toBe('');
         });
 
         it('should apply a pipe on the value if it is present', () => {

lib/core/card-view/models/card-view-textitem.model.ts

@@ -33,14 +33,14 @@ export class CardViewTextItemModel extends CardViewBaseItemModel implements Card
         this.multivalued = !!cardViewTextItemProperties.multivalued;
         this.pipes = cardViewTextItemProperties.pipes || [];
         this.clickCallBack = cardViewTextItemProperties.clickCallBack ? cardViewTextItemProperties.clickCallBack : null;
+
+        if (this.default && this.isEmpty()) {
+            this.value = this.default;
+        }
     }
 
-    get displayValue() {
+    get displayValue(): string {
-        if (this.isEmpty()) {
+        return this.applyPipes(this.value);
-            return this.default;
-        } else {
-            return this.applyPipes(this.value);
-        }
     }
 
     private applyPipes(displayValue) {