diff --git a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html index 823afd3249..e6a4dcf049 100644 --- a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html +++ b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.html @@ -1,12 +1,12 @@
+ [ngClass]="{'adf-property-dateitem-edit-mode' : editable, 'adf-property-label-not-editable' : isNonEditableField}"> { expect(clipboardService.copyContentToClipboard).toHaveBeenCalledWith('Jul 10, 2017', 'CORE.METADATA.ACCESSIBILITY.COPY_TO_CLIPBOARD_MESSAGE'); }); + it('should not show divider when editable is true', () => { + component.editable = true; + spyOn(component, 'showProperty').and.returnValue(true); // Mock showProperty result + const result = component.showDivider; + expect(result).toBe(false); + }); + + it('should not show divider when showProperty returns false', () => { + component.editable = false; + spyOn(component, 'showProperty').and.returnValue(false); + const result = component.showDivider; + expect(result).toBe(false); + }); + + it('should show divider when editable is false', () => { + component.editable = false; + spyOn(component, 'showProperty').and.returnValue(true); + const result = component.showDivider; + expect(result).toBe(true); + }); + + it('should return true for isNonEditableField when editable is true and property.editable is false', () => { + component.editable = true; + component.property.editable = false; + + const result = component.isNonEditableField; + + expect(result).toBe(true); + }); + + it('should return false for isNonEditableField when editable is false and property.editable is true', () => { + component.editable = false; + component.property.editable = true; + + const result = component.isNonEditableField; + + expect(result).toBe(false); + }); + describe('clear icon', () => { it('should render the clear icon in case of displayClearAction:true', () => { component.editable = true; diff --git a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.ts b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.ts index 4425c93c43..a3df603bf0 100644 --- a/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.ts @@ -159,7 +159,7 @@ export class CardViewDateItemComponent extends BaseCardView{{ property.label | translate }}
{ expect(filterInput).not.toBe(null); }); }); + + it('should return true for isNonEditableField when editable is true and property.editable is false', () => { + component.editable = true; + component.property.editable = false; + + const result = component.isNonEditableField; + + expect(result).toBe(true); + }); + + it('should return false for isNonEditableField when editable is false and property.editable is true', () => { + component.editable = false; + component.property.editable = true; + + const result = component.isNonEditableField; + + expect(result).toBe(false); + }); }); diff --git a/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.ts b/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.ts index 7e91a9668a..cb5399d6bf 100644 --- a/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-selectitem/card-view-selectitem.component.ts @@ -110,7 +110,7 @@ export class CardViewSelectItemComponent extends BaseCardView('content-metadata.selectFilterLimit', CardViewSelectItemComponent.HIDE_FILTER_LIMIT); } - get nonEditableField(): boolean { + get isNonEditableField(): boolean { return this.editable && !this.property.editable; } } diff --git a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.html b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.html index 787c55e449..f3685aeb69 100644 --- a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.html +++ b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.html @@ -5,13 +5,13 @@ [floatLabel]="'always'" appearance="standard"> + [ngClass]="{'adf-property-label-not-editable' : isNonEditableField}"> {{ property.label | translate }} + [ngClass]="{'adf-property-label-not-editable' : isNonEditableField}"> {{ property.label | translate }} + [ngClass]="{'adf-property-label-not-editable' : isNonEditableField}"> {{ property.label | translate }} { const labelElement = fixture.debugElement.query(By.css(`.adf-property-label`)); expect(labelElement).toBeNull(); }); + + it('should not show divider when editable is true', () => { + component.editable = true; + spyOnProperty(component, 'showProperty', 'get').and.returnValue(true); + + const result = component.showDivider; + + expect(result).toBe(false); + }); + + it('should not show divider when showProperty returns false', () => { + component.editable = false; + spyOnProperty(component, 'showProperty', 'get').and.returnValue(false); + + const result = component.showDivider; + + expect(result).toBe(false); + }); + + it('should show divider when editable is false', () => { + component.editable = false; + spyOnProperty(component, 'showProperty', 'get').and.returnValue(true); + + const result = component.showDivider; + + expect(result).toBe(true); + }); + + it('should return true for isNonEditableField when editable is true and property.editable is false', () => { + component.editable = true; + component.property.editable = false; + + const result = component.isNonEditableField; + + expect(result).toBe(true); + }); + + it('should return false for isNonEditableField when editable is false and property.editable is true', () => { + component.editable = false; + component.property.editable = true; + + const result = component.isNonEditableField; + + expect(result).toBe(false); + }); }); describe('clickable', () => { @@ -474,7 +519,7 @@ describe('CardViewTextItemComponent', () => { fixture.detectChanges(); expect(clipboardService.copyContentToClipboard).toHaveBeenCalledWith('myValueToCopy', 'CORE.METADATA.ACCESSIBILITY.COPY_TO_CLIPBOARD_MESSAGE'); }); - + }); describe('Update', () => { diff --git a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts index 61983b002c..3b99c22d81 100644 --- a/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts +++ b/lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.ts @@ -237,7 +237,7 @@ export class CardViewTextItemComponent extends BaseCardView { }); it('should render a icon with title', () => { - component.nodeIcon = "/assets/images/ft_ic_miscellaneous.svg"; + component.nodeIcon = '/assets/images/ft_ic_miscellaneous.svg'; fixture.detectChanges(); const icon = fixture.debugElement.queryAll(By.css('[info-drawer-node-icon]')); const srcAttribute = icon[0].nativeElement.getAttribute('src'); @@ -200,7 +200,7 @@ describe('Header visibility InfoDrawer', () => { }); it('should show info drawer header by default', () => { - component.nodeIcon = "/assets/images/ft_ic_miscellaneous.svg"; + component.nodeIcon = '/assets/images/ft_ic_miscellaneous.svg'; fixture.detectChanges(); const title: any = fixture.debugElement.queryAll(By.css('[info-drawer-title]')); const icon = fixture.debugElement.queryAll(By.css('[info-drawer-node-icon]'));