inteligr8/alfresco-ng2-components
1
0
Fork 0
mirror of https://github.com/Alfresco/alfresco-ng2-components.git synced 2025-05-12 17:04:57 +00:00
Code Issues Packages Projects Releases Wiki Activity

[AAE-10644] Fix tests that have no expectations - core lib part 1 (#7891)

Browse Source 
* [AAE-10644] Fix tests that have no expectations - core lib part 1

* [AAE-10644] fix app config tests

* replace subscription with spy

* use done instead of await in subject related unit test
This commit is contained in:
Tomasz Gnyp 2022-10-30 21:07:10 +01:00 committed by GitHub
parent bc57305e1e
commit 2f6d196411
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 279 additions and 412 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

50
lib/core/src/lib/app-config/app-config.service.spec.ts
View File

@ -16,7 +16,7 @@
*/ */
import { HttpClient, HttpClientModule } from '@angular/common/http'; import { HttpClient, HttpClientModule } from '@angular/common/http';
import { fakeAsync, TestBed } from '@angular/core/testing'; import { TestBed } from '@angular/core/testing';
import { AppConfigService } from './app-config.service'; import { AppConfigService } from './app-config.service';
import { AppConfigModule } from './app-config.module'; import { AppConfigModule } from './app-config.module';
import { ExtensionConfig, ExtensionService } from '@alfresco/adf-extensions'; import { ExtensionConfig, ExtensionService } from '@alfresco/adf-extensions';
@ -68,7 +68,6 @@ describe('AppConfigService', () => {
extensionService = TestBed.inject(ExtensionService); extensionService = TestBed.inject(ExtensionService);
appConfigService = TestBed.inject(AppConfigService); appConfigService = TestBed.inject(AppConfigService);
appConfigService.load();
}); });
it('should merge the configs from extensions', () => { it('should merge the configs from extensions', () => {
@ -111,19 +110,25 @@ describe('AppConfigService', () => {
expect(appConfigService.get('application.name')).toEqual('custom name'); expect(appConfigService.get('application.name')).toEqual('custom name');
}); });
it('should stream only the selected attribute changes when using select', fakeAsync(() => { it('should stream only the selected attribute when using select', (done) => {
appConfigService.config.testProp = true;
appConfigService.select('testProp').subscribe((property) => { appConfigService.select('testProp').subscribe((property) => {
expect(property).toBeTruthy(); expect(property).toEqual(true);
done();
}); });
}));
it('should stream the page size value when is set', fakeAsync(() => {
appConfigService.config.testProp = true; appConfigService.config.testProp = true;
appConfigService.load();
});
it('should stream the value when is set', (done) => {
appConfigService.onLoad.subscribe((config) => { appConfigService.onLoad.subscribe((config) => {
expect(config.testProp).toBeTruthy(); expect(config.testProp).toBe(true);
done();
}); });
}));
appConfigService.config.testProp = true;
appConfigService.load();
});
it('should skip the optional port number', () => { it('should skip the optional port number', () => {
appConfigService.config.testUrl = 'http://{hostname}{:port}'; appConfigService.config.testUrl = 'http://{hostname}{:port}';
@ -164,24 +169,23 @@ describe('AppConfigService', () => {
expect(appConfigService.get('testUrl')).toBe('ftp://localhost:9090'); expect(appConfigService.get('testUrl')).toBe('ftp://localhost:9090');
}); });
it('should load external settings', () => { it('should load external settings', async () => {
appConfigService.load().then((config) => { const config = await appConfigService.load();
expect(config).toEqual(mockResponse); expect(config).toEqual(mockResponse);
});
}); });
it('should retrieve settings', () => { it('should retrieve settings', async () => {
appConfigService.load().then(() => { await appConfigService.load();
expect(appConfigService.get('ecmHost')).toBe(mockResponse.ecmHost);
expect(appConfigService.get('bpmHost')).toBe(mockResponse.bpmHost); expect(appConfigService.get('ecmHost')).toBe(mockResponse.ecmHost);
expect(appConfigService.get('application.name')).toBe(mockResponse.application.name); expect(appConfigService.get('bpmHost')).toBe(mockResponse.bpmHost);
}); expect(appConfigService.get('application.name')).toBe(mockResponse.application.name);
}); });
it('should take excluded file list', () => { it('should take excluded file list', async () => {
appConfigService.load().then(() => { await appConfigService.load();
expect(appConfigService.get('files.excluded')[0]).toBe('excluded');
}); expect(appConfigService.get('files.excluded')[0]).toBe('excluded');
}); });
}); });

91
lib/core/src/lib/card-view/components/card-view-dateitem/card-view-dateitem.component.spec.ts
View File

@ -15,7 +15,7 @@
* limitations under the License. * limitations under the License.
*/ */
import { ComponentFixture, fakeAsync, TestBed } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser'; import { By } from '@angular/platform-browser';
import { setupTestBed } from '../../../testing/setup-test-bed'; import { setupTestBed } from '../../../testing/setup-test-bed';
import moment from 'moment'; import moment from 'moment';
@ -189,27 +189,25 @@ describe('CardViewDateItemComponent', () => {
expect(component.datepicker.open).toHaveBeenCalled(); expect(component.datepicker.open).toHaveBeenCalled();
}); });
it('should trigger an update event on the CardViewUpdateService', (done) => { it('should trigger an update event on the CardViewUpdateService', () => {
const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
const itemUpdatedSpy = spyOn(cardViewUpdateService.itemUpdated$, 'next');
component.editable = true; component.editable = true;
component.property.editable = true; component.property.editable = true;
const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
const expectedDate = moment('Jul 10 2017', 'MMM DD YYYY'); const expectedDate = moment('Jul 10 2017', 'MMM DD YYYY');
fixture.detectChanges(); fixture.detectChanges();
const property = { ...component.property }; const property = { ...component.property };
const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe(
(updateNotification) => {
expect(updateNotification.target).toEqual(property);
expect(updateNotification.changed).toEqual({ dateKey: expectedDate.toDate() });
disposableUpdate.unsubscribe();
done();
}
);
component.onDateChanged({ value: expectedDate }); component.onDateChanged({ value: expectedDate });
expect(itemUpdatedSpy).toHaveBeenCalledWith({
target: property,
changed: {
dateKey: expectedDate.toDate()
}
});
}); });
it('should update the property value after a successful update attempt', fakeAsync(() => { it('should update the property value after a successful update attempt', async () => {
component.editable = true; component.editable = true;
component.property.editable = true; component.property.editable = true;
component.property.value = null; component.property.value = null;
@ -218,12 +216,9 @@ describe('CardViewDateItemComponent', () => {
component.onDateChanged({ value: expectedDate }); component.onDateChanged({ value: expectedDate });
fixture.whenStable().then( await fixture.whenStable();
() => { expect(component.property.value).toEqual(expectedDate.toDate());
expect(component.property.value).toEqual(expectedDate.toDate()); });
}
);
}));
it('should copy value to clipboard on double click', () => { it('should copy value to clipboard on double click', () => {
const clipboardService = TestBed.inject(ClipboardService); const clipboardService = TestBed.inject(ClipboardService);
@ -271,7 +266,7 @@ describe('CardViewDateItemComponent', () => {
expect(datePickerClearToggle).toBeNull('Clean Icon should not be in DOM'); expect(datePickerClearToggle).toBeNull('Clean Icon should not be in DOM');
}); });
it('should remove the property value after a successful clear attempt', fakeAsync(() => { it('should remove the property value after a successful clear attempt', async () => {
component.editable = true; component.editable = true;
component.property.editable = true; component.property.editable = true;
component.property.value = 'Jul 10 2017'; component.property.value = 'Jul 10 2017';
@ -279,14 +274,11 @@ describe('CardViewDateItemComponent', () => {
component.onDateClear(); component.onDateClear();
fixture.whenStable().then( await fixture.whenStable();
() => { expect(component.property.value).toBeNull();
expect(component.property.value).toBeNull(); });
}
);
}));
it('should remove the property default value after a successful clear attempt', fakeAsync(() => { it('should remove the property default value after a successful clear attempt', async () => {
component.editable = true; component.editable = true;
component.property.editable = true; component.property.editable = true;
component.property.default = 'Jul 10 2017'; component.property.default = 'Jul 10 2017';
@ -294,37 +286,34 @@ describe('CardViewDateItemComponent', () => {
component.onDateClear(); component.onDateClear();
fixture.whenStable().then( await fixture.whenStable();
() => { expect(component.property.default).toBeNull();
expect(component.property.default).toBeNull(); });
}
);
}));
it('should remove actual and default value after a successful clear attempt', fakeAsync(() => { it('should remove actual and default value after a successful clear attempt', async () => {
component.editable = true;
component.property.editable = true;
component.property.default = 'Jul 10 2017';
component.property.value = 'Jul 10 2017';
fixture.detectChanges();
const cardViewUpdateService = TestBed.inject(CardViewUpdateService); const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
const itemUpdatedSpy = spyOn(cardViewUpdateService.itemUpdated$, 'next');
component.editable = true;
component.property.editable = true;
component.property.default = 'Jul 10 2017';
component.property.value = 'Jul 10 2017';
fixture.detectChanges();
const property = { ...component.property }; const property = { ...component.property };
const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe(
(updateNotification) => {
expect(updateNotification.target).toEqual(property);
expect(updateNotification.changed).toEqual({ dateKey: null });
disposableUpdate.unsubscribe();
}
);
component.onDateClear(); component.onDateClear();
fixture.whenStable().then(() => { expect(itemUpdatedSpy).toHaveBeenCalledWith({
expect(component.property.value).toBeNull(); target: property,
expect(component.property.default).toBeNull(); changed: {
dateKey: null
}
}); });
}));
await fixture.whenStable();
expect(component.property.value).toBeNull();
expect(component.property.default).toBeNull();
});
}); });
it('should be possible update a date-time', async () => { it('should be possible update a date-time', async () => {

550
lib/core/src/lib/card-view/components/card-view-textitem/card-view-textitem.component.spec.ts
View File

@ -15,7 +15,7 @@
* limitations under the License. * limitations under the License.
*/ */
import { ComponentFixture, TestBed, tick, fakeAsync, discardPeriodicTasks } from '@angular/core/testing'; import { ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser'; import { By } from '@angular/platform-browser';
import { CardViewTextItemModel } from '../../models/card-view-textitem.model'; import { CardViewTextItemModel } from '../../models/card-view-textitem.model';
import { CardViewUpdateService } from '../../services/card-view-update.service'; import { CardViewUpdateService } from '../../services/card-view-update.service';
@ -28,7 +28,7 @@ import { CardViewIntItemModel } from '../../models/card-view-intitem.model';
import { CardViewFloatItemModel } from '../../models/card-view-floatitem.model'; import { CardViewFloatItemModel } from '../../models/card-view-floatitem.model';
import { MatChipsModule } from '@angular/material/chips'; import { MatChipsModule } from '@angular/material/chips';
import { ClipboardService } from '../../../clipboard/clipboard.service'; import { ClipboardService } from '../../../clipboard/clipboard.service';
import { DebugElement, SimpleChange } from '@angular/core'; import { SimpleChange } from '@angular/core';
import { TranslateModule } from '@ngx-translate/core'; import { TranslateModule } from '@ngx-translate/core';
import { CardViewItemValidator } from '../../interfaces/card-view-item-validator.interface'; import { CardViewItemValidator } from '../../interfaces/card-view-item-validator.interface';
@ -37,6 +37,27 @@ describe('CardViewTextItemComponent', () => {
let fixture: ComponentFixture<CardViewTextItemComponent>; let fixture: ComponentFixture<CardViewTextItemComponent>;
let component: CardViewTextItemComponent; let component: CardViewTextItemComponent;
const expectedErrorMessages = [{ message: 'Something went wrong' } as CardViewItemValidator];
const updateTextField = (key, value) => {
const editInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${key}"]`));
editInput.nativeElement.value = value;
editInput.nativeElement.dispatchEvent(new Event('input'));
fixture.detectChanges();
};
const getTextFieldValue = (key): string => {
const textItemInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${key}"]`));
expect(textItemInput).not.toBeNull();
return textItemInput.nativeElement.value;
};
const getTextFieldError = (key): string => {
const textItemInputError = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${key}"] li`));
expect(textItemInputError).not.toBeNull();
return textItemInputError.nativeElement.innerText;
};
setupTestBed({ setupTestBed({
imports: [ imports: [
TranslateModule.forRoot(), TranslateModule.forRoot(),
@ -263,18 +284,15 @@ describe('CardViewTextItemComponent', () => {
fixture.detectChanges(); fixture.detectChanges();
}); });
it('should render the default as value if the value is empty, clickable is false and displayEmpty is true', (done) => { it('should render the default as value if the value is empty, clickable is false and displayEmpty is true', async () => {
component.property.clickable = false; component.property.clickable = false;
component.displayEmpty = true; component.displayEmpty = true;
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges();
const value = getTextFieldValue(component.property.key); const value = getTextFieldValue(component.property.key);
expect(value).toBe('FAKE-DEFAULT-KEY'); expect(value).toBe('FAKE-DEFAULT-KEY');
done();
});
}); });
it('should render the default as value if the value is empty and clickable true', async () => { it('should render the default as value if the value is empty and clickable true', async () => {
@ -391,35 +409,25 @@ describe('CardViewTextItemComponent', () => {
expect(cardViewUpdateService.clicked).toHaveBeenCalled(); expect(cardViewUpdateService.clicked).toHaveBeenCalled();
}); });
it('should update input the value on input updated', fakeAsync((done) => { it('should update input the value on input updated', async () => {
const cardViewUpdateService = TestBed.inject(CardViewUpdateService); const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
const itemUpdatedSpy = spyOn(cardViewUpdateService.itemUpdated$, 'next');
component.property.clickable = true;
component.property.editable = true; component.property.editable = true;
component.editable = true; component.editable = true;
component.property.isValid = () => true; component.property.isValid = () => true;
const expectedText = 'changed text'; const expectedText = 'changed text';
component.ngOnChanges({});
fixture.detectChanges();
fixture.whenStable().then(() => {
fixture.detectChanges();
const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe((updateNotification) => { updateTextField(component.property.key, expectedText);
expect(updateNotification.target).toEqual({ ...component.property }); await fixture.whenStable();
expect(updateNotification.changed).toEqual({ textkey: expectedText });
expect(getTextFieldValue(component.property.key)).toEqual(expectedText); expect(itemUpdatedSpy).toHaveBeenCalledWith({
disposableUpdate.unsubscribe(); target: { ...component.property },
done(); changed: {
}); textkey: expectedText
}
updateTextField(component.property.key, expectedText);
tick(1000);
fixture.detectChanges();
discardPeriodicTasks();
}); });
})); expect(getTextFieldValue(component.property.key)).toEqual(expectedText);
});
it('should copy value to clipboard on double click', async () => { it('should copy value to clipboard on double click', async () => {
const clipboardService = TestBed.inject(ClipboardService); const clipboardService = TestBed.inject(ClipboardService);
@ -476,184 +484,101 @@ describe('CardViewTextItemComponent', () => {
fixture.detectChanges(); fixture.detectChanges();
}); });
it('should call the isValid method with the edited value', fakeAsync((done) => { it('should call the isValid method with the edited value', async () => {
fixture.detectChanges(); spyOn(component.property, 'isValid');
fixture.whenStable().then(() => {
fixture.detectChanges();
spyOn(component.property, 'isValid'); updateTextField(component.property.key, 'updated-value');
updateTextField(component.property.key, 'updated-value'); await fixture.whenStable();
tick(600);
fixture.detectChanges();
fixture.whenStable().then(() => {
expect(component.property.isValid).toHaveBeenCalledWith('updated-value');
done();
});
});
}));
it('should trigger the update event if the editedValue is valid', fakeAsync((done) => { expect(component.property.isValid).toHaveBeenCalledWith('updated-value');
});
it('should trigger the update event if the editedValue is valid', async () => {
const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
spyOn(cardViewUpdateService, 'update');
component.property.isValid = () => true; component.property.isValid = () => true;
fixture.detectChanges(); updateTextField(component.property.key, 'updated-value');
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges();
const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
const property = { ...component.property };
spyOn(cardViewUpdateService, 'update'); const property = { ...component.property };
updateTextField(component.property.key, 'updated-value'); expect(cardViewUpdateService.update).toHaveBeenCalledWith(property, 'updated-value');
tick(600); });
fixture.detectChanges();
fixture.whenStable().then(() => {
expect(cardViewUpdateService.update).toHaveBeenCalledWith(property, 'updated-value');
done();
});
});
}));
it('should NOT trigger the update event if the editedValue is invalid', fakeAsync((done) => { it('should NOT trigger the update event if the editedValue is invalid', async () => {
const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
spyOn(cardViewUpdateService, 'update');
component.property.isValid = () => false; component.property.isValid = () => false;
fixture.detectChanges(); updateTextField(component.property.key, 'updated-value');
fixture.whenStable().then(() => { await fixture.whenStable();
fixture.detectChanges();
const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
spyOn(cardViewUpdateService, 'update'); expect(cardViewUpdateService.update).not.toHaveBeenCalled();
updateTextField(component.property.key, 'updated-value'); });
tick(600);
fixture.detectChanges();
fixture.whenStable().then(() => {
expect(cardViewUpdateService.update).not.toHaveBeenCalled();
done();
});
});
}));
it('should set the errorMessages properly if the editedValue is invalid', fakeAsync((done) => { it('should set the errorMessages properly if the editedValue is invalid', async () => {
const expectedErrorMessages = [{ message: 'Something went wrong' } as CardViewItemValidator];
component.property.isValid = () => false; component.property.isValid = () => false;
component.property.getValidationErrors = () => expectedErrorMessages; component.property.getValidationErrors = () => expectedErrorMessages;
fixture.detectChanges(); updateTextField(component.property.key, 'updated-value');
fixture.whenStable().then(() => { await fixture.whenStable();
updateTextField(component.property.key, 'updated-value'); expect(component.errors).toBe(expectedErrorMessages);
tick(600); });
fixture.detectChanges();
fixture.whenStable().then(() => {
expect(component.errors).toBe(expectedErrorMessages);
done();
});
});
}));
it('should render the error when the editedValue is invalid', fakeAsync((done) => { it('should render the error', () => {
const expectedErrorMessages = [{ message: 'Something went wrong' } as CardViewItemValidator]; component.errors = expectedErrorMessages;
component.property.isValid = () => false;
component.property.getValidationErrors = () => expectedErrorMessages;
component.editable = true; component.editable = true;
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => {
updateTextField(component.property.key, 'updated-value'); const errorMessage: HTMLElement = fixture.debugElement.nativeElement.querySelector('.adf-textitem-editable-error');
tick(600); expect(errorMessage.textContent).toBe(expectedErrorMessages[0].message);
fixture.detectChanges(); });
fixture.whenStable().then(() => {
const errorMessage = fixture.debugElement.nativeElement.querySelector('.adf-textitem-editable-error').textContent;
expect(errorMessage).toBe('Something went wrong');
done();
});
});
}));
it('should reset erros when exiting editable mode', fakeAsync(() => { it('should NOT display error when exiting editable mode', () => {
let errorMessage: string; component.errors = expectedErrorMessages;
const expectedErrorMessages = [{ message: 'Something went wrong' } as CardViewItemValidator];
component.property.isValid = () => false;
component.property.getValidationErrors = () => expectedErrorMessages;
component.editable = true; component.editable = true;
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => {
updateTextField(component.property.key, 'updated-value'); let errorMessage: HTMLElement = fixture.debugElement.nativeElement.querySelector('.adf-textitem-editable-error');
tick(600); expect(errorMessage.textContent).toBe(expectedErrorMessages[0].message);
fixture.detectChanges();
fixture.whenStable().then(() => {
component.editable = false; component.editable = false;
fixture.detectChanges();
fixture.detectChanges(); errorMessage = fixture.debugElement.nativeElement.querySelector('.adf-textitem-editable-error');
errorMessage = fixture.debugElement.nativeElement.querySelector('.adf-textitem-editable-error'); expect(errorMessage).toBeNull();
expect(errorMessage).toBe(null); });
expect(component.errors).toEqual([]);
});
});
}));
it('should update the property value after a successful update attempt', async () => { it('should update the property value after a successful update attempt', async () => {
component.property.isValid = () => true; component.editedValue = 'TEST';
component.update(); component.update();
fixture.detectChanges(); expect(component.property.value).toEqual(component.editedValue);
await fixture.whenStable();
expect(component.property.value).toBe(component.editedValue);
}); });
it('should render the default as value if the value is empty, clickable is true and displayEmpty is true', fakeAsync(async (done) => { it('should trigger an update event on the CardViewUpdateService [integration]', async () => {
const functionTestClick = () => done(); const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
const itemUpdatedSpy = spyOn(cardViewUpdateService.itemUpdated$, 'next');
component.property.isValid = () => true;
const expectedText = 'changed text';
component.property = new CardViewTextItemModel({ updateTextField(component.property.key, expectedText);
label: 'Text label', await fixture.whenStable();
value: '',
key: 'textkey', expect(itemUpdatedSpy).toHaveBeenCalledWith({
default: 'FAKE-DEFAULT-KEY', target: { ...component.property },
clickable: true, changed: {
clickCallBack: () => { textkey: expectedText
functionTestClick();
} }
}); });
component.displayEmpty = true;
fixture.detectChanges();
await fixture.whenStable();
const inputField = getTextField(component.property.key);
inputField.nativeElement.click();
}));
it('should trigger an update event on the CardViewUpdateService [integration]', (done) => {
component.property.isValid = () => true;
const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
const expectedText = 'changed text';
fixture.detectChanges();
fixture.whenStable().then(() => {
const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe(
(updateNotification) => {
expect(updateNotification.target).toEqual({ ...component.property });
expect(updateNotification.changed).toEqual({ textkey: expectedText });
disposableUpdate.unsubscribe();
done();
}
);
updateTextField(component.property.key, expectedText);
});
}); });
it('should update the value using the updateItem$ subject', (async () => { it('should update the value using the updateItem$ subject', () => {
component.property.isValid = () => true;
const cardViewUpdateService = TestBed.inject(CardViewUpdateService); const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
component.property.isValid = () => true;
const expectedText = 'changed text'; const expectedText = 'changed text';
fixture.detectChanges();
await fixture.whenStable();
let value = getTextFieldValue(component.property.key); let value = getTextFieldValue(component.property.key);
expect(value).toEqual('Lorem ipsum'); expect(value).toEqual('Lorem ipsum');
expect(component.property.value).toBe('Lorem ipsum'); expect(component.property.value).toBe('Lorem ipsum');
@ -661,43 +586,45 @@ describe('CardViewTextItemComponent', () => {
cardViewUpdateService.updateElement({ key: component.property.key, value: expectedText } as any); cardViewUpdateService.updateElement({ key: component.property.key, value: expectedText } as any);
component.ngOnChanges({ property: new SimpleChange(value, expectedText, false) }); component.ngOnChanges({ property: new SimpleChange(value, expectedText, false) });
fixture.detectChanges(); fixture.detectChanges();
await fixture.whenStable();
value = getTextFieldValue(component.property.key); value = getTextFieldValue(component.property.key);
expect(value).toEqual(expectedText); expect(value).toEqual(expectedText);
expect(component.property.value).toBe(expectedText); expect(component.property.value).toBe(expectedText);
})); });
it('should update multiline input the value on input updated', (done) => { it('should render the default as value if the value is empty, clickable is true and displayEmpty is true', () => {
component.property.value = '';
component.property.clickable = true;
component.displayEmpty = true;
fixture.detectChanges();
const inputField = getTextFieldValue(component.property.key);
expect(inputField).toBe('Lorem ipsum');
});
it('should update multiline input the value on input updated', async () => {
const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
const itemUpdatedSpy = spyOn(cardViewUpdateService.itemUpdated$, 'next');
spyOn(component, 'update').and.callThrough();
component.property.isValid = () => true; component.property.isValid = () => true;
component.property.multiline = true; component.property.multiline = true;
const expectedText = 'changed text'; const expectedText = 'changed text';
spyOn(component, 'update').and.callThrough();
const cardViewUpdateService = TestBed.inject(CardViewUpdateService);
fixture.detectChanges(); updateTextField(component.property.key, expectedText);
fixture.whenStable().then(() => { await fixture.whenStable();
const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe((updateNotification) => { expect(itemUpdatedSpy).toHaveBeenCalledWith({
expect(updateNotification.target).toEqual({ ...component.property }); target: { ...component.property },
expect(updateNotification.changed).toEqual({ textkey: expectedText }); changed: {
disposableUpdate.unsubscribe(); textkey: expectedText
done(); }
});
updateTextField(component.property.key, expectedText);
tick(600);
fixture.detectChanges();
fixture.whenStable().then(() => {
expect(component.update).toHaveBeenCalled();
fixture.detectChanges();
expect(getTextFieldValue(component.property.key)).toEqual(expectedText);
expect(component.property.value).toBe(expectedText);
});
}); });
expect(component.update).toHaveBeenCalled();
expect(getTextFieldValue(component.property.key)).toEqual(expectedText);
expect(component.property.value).toBe(expectedText);
}); });
}); });
@ -719,21 +646,35 @@ describe('CardViewTextItemComponent', () => {
fixture.detectChanges(); fixture.detectChanges();
}); });
it('should show validation error when string passed', fakeAsync((done) => { it('should show validation error when string passed', async () => {
updateTextField(component.property.key, 'update number');
await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => {
updateTextField(component.property.key, 'update number'); const errorMessage = getTextFieldError(component.property.key);
tick(600); expect(errorMessage).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR');
fixture.detectChanges(); });
fixture.whenStable().then(() => {
const error = getTextFieldError(component.property.key); it('should NOT show validation error for empty string', async () => {
expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR'); updateTextField(component.property.key, '');
expect(component.property.value).toBe(10); await fixture.whenStable();
done(); fixture.detectChanges();
});
}); const errorElement = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-error-textkey"]'));
})); expect(errorElement).toBeNull();
});
it('should NOT show validation error for null', async () => {
updateTextField(component.property.key, null);
await fixture.whenStable();
fixture.detectChanges();
const inputElement = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-value-textkey"]'));
const errorElement = fixture.debugElement.query(By.css('[data-automation-id="card-textitem-error-textkey"]'));
expect(inputElement.nativeElement.value).toBe('');
expect(errorElement).toBeNull();
});
it('should show validation error for only spaces string', async () => { it('should show validation error for only spaces string', async () => {
updateTextField(component.property.key, ' '); updateTextField(component.property.key, ' ');
@ -765,80 +706,55 @@ describe('CardViewTextItemComponent', () => {
expect(errorElement).toBeNull(); expect(errorElement).toBeNull();
}); });
it('should show validation error for float number', fakeAsync((done) => { it('should show validation error for float number', async () => {
updateTextField(component.property.key, 123.456);
await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => {
updateTextField(component.property.key, 123.456); const error = getTextFieldError(component.property.key);
tick(600); expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR');
fixture.detectChanges(); expect(component.property.value).toBe(10);
fixture.whenStable().then(() => { });
const error = getTextFieldError(component.property.key); it('should show validation error for exceed the number limit (2147483648)', async () => {
expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR'); updateTextField(component.property.key, 2147483648);
expect(component.property.value).toBe(10); await fixture.whenStable();
done();
});
});
}));
it('should show validation error for exceed the number limit (2147483648)', fakeAsync((done) => {
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => {
updateTextField(component.property.key, 2147483648); const error = getTextFieldError(component.property.key);
tick(600); expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR');
fixture.detectChanges(); expect(component.property.value).toBe(10);
fixture.whenStable().then(() => { });
const error = getTextFieldError(component.property.key); it('should not show validation error for below the number limit (2147483647)', async () => {
expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.INT_VALIDATION_ERROR'); updateTextField(component.property.key, 2147483647);
expect(component.property.value).toBe(10); await fixture.whenStable();
done();
});
});
}));
it('should not show validation error for below the number limit (2147483647)', fakeAsync((done) => {
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => {
updateTextField(component.property.key, 2147483647); const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`));
fixture.detectChanges(); expect(error).toBeFalsy();
fixture.whenStable().then(() => { expect(component.property.value).toBe('2147483647');
const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); });
expect(error).toBeFalsy();
expect(component.property.value).toBe('2147483647'); it('should update input the value on input updated', async () => {
done();
});
});
}));
it('should update input the value on input updated', (done) => {
const expectedNumber = 2020; const expectedNumber = 2020;
const itemUpdatedSpy = spyOn(cardViewUpdateService.itemUpdated$, 'next');
spyOn(component, 'update').and.callThrough(); spyOn(component, 'update').and.callThrough();
fixture.detectChanges();
fixture.whenStable().then(() => {
const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe((updateNotification) => { updateTextField(component.property.key, expectedNumber);
expect(updateNotification.target).toEqual({ ...component.property }); await fixture.whenStable();
expect(updateNotification.changed).toEqual({ textkey: expectedNumber.toString() });
disposableUpdate.unsubscribe();
done();
});
updateTextField(component.property.key, expectedNumber); expect(itemUpdatedSpy).toHaveBeenCalledWith({
tick(600); target: { ...component.property },
fixture.detectChanges(); changed: {
fixture.whenStable().then(() => { textkey: expectedNumber.toString()
const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); }
expect(error).toBeFalsy();
expect(getTextFieldValue(component.property.key)).toEqual(expectedNumber.toString());
expect(component.property.value).toBe(expectedNumber.toString());
});
}); });
const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`));
expect(error).toBeFalsy();
expect(getTextFieldValue(component.property.key)).toEqual(expectedNumber.toString());
expect(component.property.value).toBe(expectedNumber.toString());
}); });
}); });
@ -861,87 +777,45 @@ describe('CardViewTextItemComponent', () => {
fixture.detectChanges(); fixture.detectChanges();
}); });
it('should show validation error when string passed', fakeAsync((done) => { it('should show validation error when string passed', async () => {
updateTextField(component.property.key, 'hello there');
await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => {
updateTextField(component.property.key, 'hello there'); const error = getTextFieldError(component.property.key);
tick(600); expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.FLOAT_VALIDATION_ERROR');
fixture.detectChanges(); expect(component.property.value).toBe(floatValue);
fixture.whenStable().then(() => { });
const error = getTextFieldError(component.property.key);
expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.FLOAT_VALIDATION_ERROR');
expect(component.property.value).toBe(floatValue);
done();
});
});
}));
it('should show validation error for empty string (float)', fakeAsync((done) => { it('should show validation error for empty string (float)', async () => {
updateTextField(component.property.key, ' ');
await fixture.whenStable();
fixture.detectChanges(); fixture.detectChanges();
fixture.whenStable().then(() => {
updateTextField(component.property.key, ' '); const error = getTextFieldError(component.property.key);
tick(600); expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.FLOAT_VALIDATION_ERROR');
fixture.detectChanges(); expect(component.property.value).toBe(floatValue);
fixture.whenStable().then(() => { });
const error = getTextFieldError(component.property.key);
expect(error).toEqual('CORE.CARDVIEW.VALIDATORS.FLOAT_VALIDATION_ERROR');
expect(component.property.value).toBe(floatValue);
done();
});
});
}));
it('should update input the value on input updated', (done) => { it('should update input the value on input updated', async () => {
const expectedNumber = 88.44; const expectedNumber = 88.44;
const itemUpdatedSpy = spyOn(cardViewUpdateService.itemUpdated$, 'next');
spyOn(component, 'update').and.callThrough(); spyOn(component, 'update').and.callThrough();
fixture.detectChanges();
fixture.whenStable().then(() => {
const disposableUpdate = cardViewUpdateService.itemUpdated$.subscribe((updateNotification) => { updateTextField(component.property.key, expectedNumber);
expect(updateNotification.target).toEqual({ ...component.property }); await fixture.whenStable();
expect(updateNotification.changed).toEqual({ textkey: expectedNumber.toString() });
disposableUpdate.unsubscribe();
done();
});
updateTextField(component.property.key, expectedNumber); expect(itemUpdatedSpy).toHaveBeenCalledWith({
tick(600); target: { ...component.property },
fixture.detectChanges(); changed: {
fixture.whenStable().then(() => { textkey: expectedNumber.toString()
const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`)); }
expect(error).toBeFalsy();
expect(getTextFieldValue(component.property.key)).toEqual(expectedNumber.toString());
expect(component.property.value).toBe(expectedNumber.toString());
});
}); });
const error = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${component.property.key}"] li`));
expect(error).toBeFalsy();
expect(getTextFieldValue(component.property.key)).toEqual(expectedNumber.toString());
expect(component.property.value).toBe(expectedNumber.toString());
}); });
}); });
const updateTextField = (key, value) => {
const editInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${key}"]`));
editInput.nativeElement.value = value;
editInput.nativeElement.dispatchEvent(new Event('input'));
fixture.detectChanges();
};
const getTextFieldValue = (key): string => {
const textItemInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${key}"]`));
expect(textItemInput).not.toBeNull();
return textItemInput.nativeElement.value;
};
const getTextField = (key): DebugElement => {
const textItemInput = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-value-${key}"]`));
expect(textItemInput).not.toBeNull();
return textItemInput;
};
const getTextFieldError = (key): string => {
const textItemInputError = fixture.debugElement.query(By.css(`[data-automation-id="card-textitem-error-${key}"] li`));
expect(textItemInputError).not.toBeNull();
return textItemInputError.nativeElement.innerText;
};
}); });