[ACCS-5551] unit test added

This commit is contained in:
Anukriti Singh
2023-10-13 16:29:41 +05:30
parent 2c0b64d8b1
commit 3c61188ccb
10 changed files with 119 additions and 17 deletions
@@ -1,12 +1,12 @@
<label class="adf-property-label"
[attr.data-automation-id]="'card-dateitem-label-' + property.key"
[ngClass]="{'adf-property-label-not-editable' : nonEditableField}"
[ngClass]="{'adf-property-label-not-editable' : isNonEditableField}"
*ngIf="showProperty() || isEditable()"
[attr.for]="'card-view-dateitem-' + property.key">
{{ property.label | translate }}
</label>
<div class="adf-property-value adf-property-value-padding-top"
[ngClass]="{'adf-property-dateitem-edit-mode' : editable, 'adf-property-label-not-editable' : nonEditableField}">
[ngClass]="{'adf-property-dateitem-edit-mode' : editable, 'adf-property-label-not-editable' : isNonEditableField}">
<span *ngIf="!isEditable() && !property.multivalued"
[attr.data-automation-id]="'card-' + property.type + '-value-' + property.key">
<span *ngIf="showProperty()"
@@ -232,6 +232,45 @@ describe('CardViewDateItemComponent', () => {
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;
@@ -159,7 +159,7 @@ export class CardViewDateItemComponent extends BaseCardView<CardViewDateItemMode
return !this.editable && this.showProperty();
}
get nonEditableField(): boolean {
get isNonEditableField(): boolean {
return this.editable && !this.property.editable;
}
}
@@ -2,7 +2,7 @@
<div
[attr.data-automation-id]="'card-select-label-' + property.key"
class="adf-property-label"
[ngClass]="{'adf-property-label-not-editable' : nonEditableField}"
[ngClass]="{'adf-property-label-not-editable' : isNonEditableField}"
>{{ property.label | translate }}</div>
<div class="adf-property-field">
<div
@@ -16,7 +16,7 @@
<mat-select
[(value)]="value"
panelClass="adf-select-filter"
[ngClass]="{'adf-property-select-edit-mode' : isEditable(),'adf-property-normal-mode':!isEditable(),'adf-property-label-not-editable' : nonEditableField}"
[ngClass]="{'adf-property-select-edit-mode' : isEditable(),'adf-property-normal-mode':!isEditable(),'adf-property-label-not-editable' : isNonEditableField}"
(selectionChange)="onChange($event)"
data-automation-class="select-box"
[aria-label]="property.label | translate"
@@ -251,4 +251,22 @@ describe('CardViewSelectItemComponent', () => {
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);
});
});
@@ -110,7 +110,7 @@ export class CardViewSelectItemComponent extends BaseCardView<CardViewSelectItem
return this.appConfig.get<number>('content-metadata.selectFilterLimit', CardViewSelectItemComponent.HIDE_FILTER_LIMIT);
}
get nonEditableField(): boolean {
get isNonEditableField(): boolean {
return this.editable && !this.property.editable;
}
}
@@ -5,13 +5,13 @@
[floatLabel]="'always'"
appearance="standard">
<mat-label *ngIf="showProperty || isEditable" [attr.data-automation-id]="'card-textitem-label-' + property.key" class="adf-property-label"
[ngClass]="{'adf-property-label-not-editable' : nonEditableField}">
[ngClass]="{'adf-property-label-not-editable' : isNonEditableField}">
{{ property.label | translate }}
</mat-label>
<input matInput
*ngIf="!property.multiline"
class="adf-property-value"
[ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : nonEditableField}"
[ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : isNonEditableField}"
title="{{property.label | translate }}"
[placeholder]="property.default"
[attr.aria-label]="property.label | translate"
@@ -29,7 +29,7 @@
[cdkAutosizeMaxRows]="1"
[cdkAutosizeMaxRows]="5"
class="adf-property-value"
[ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : nonEditableField}"
[ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : isNonEditableField}"
[placeholder]="property.default"
[attr.aria-label]="property.label | translate"
[formControl]="textInput"
@@ -43,7 +43,7 @@
<div *ngSwitchCase="'chipsTemplate'"
class="adf-property-field adf-textitem-chip-list-container">
<mat-label *ngIf="showLabelForChips" [attr.data-automation-id]="'card-textitem-label-' + property.key" class="adf-property-label"
[ngClass]="{'adf-property-label-not-editable' : nonEditableField}">
[ngClass]="{'adf-property-label-not-editable' : isNonEditableField}">
{{ property.label | translate }}
</mat-label>
<mat-chip-list #chipList
@@ -63,7 +63,7 @@
[floatLabel]="'never'">
<input matInput
class="adf-property-value"
[ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : nonEditableField}"
[ngClass]="{'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : isNonEditableField}"
title="{{property.label | translate }}"
[placeholder]="editedValue ? '' : property.default | translate"
[attr.aria-label]="property.label | translate"
@@ -84,14 +84,14 @@
<mat-form-field class="adf-property-field adf-card-textitem-field" appearance="standard"
[floatLabel]="'never'">
<mat-label *ngIf="showProperty || isEditable" [attr.data-automation-id]="'card-textitem-label-' + property.key" class="adf-property-label"
[ngClass]="{'adf-property-label-not-editable' : nonEditableField}">
[ngClass]="{'adf-property-label-not-editable' : isNonEditableField}">
{{ property.label | translate }}
</mat-label>
<input matInput
[type]=property.inputType
class="adf-property-value"
title="{{property.label | translate }}"
[ngClass]="{'adf-textitem-clickable-value': !isEditable,'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : nonEditableField}"
[ngClass]="{'adf-textitem-clickable-value': !isEditable,'adf-property-edit-mode' : editable,'adf-property-normal-mode':!editable, 'adf-property-label-not-editable' : isNonEditableField}"
[placeholder]="property.default"
[attr.aria-label]="property.label | translate"
[(ngModel)]="editedValue"
@@ -296,6 +296,51 @@ describe('CardViewTextItemComponent', () => {
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', () => {
@@ -237,7 +237,7 @@ export class CardViewTextItemComponent extends BaseCardView<CardViewTextItemMode
return !this.editable && this.showProperty;
}
get nonEditableField(): boolean {
get isNonEditableField(): boolean {
return this.editable && !this.property.editable;
}
}
@@ -160,7 +160,7 @@ describe('Custom InfoDrawer', () => {
});
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]'));