Fix async karma - jasmine tests

- Fix that use async wait for rendering
-- Make proper usage of async and await
- Add waitUntil util method for tests
This commit is contained in:
Clemente Raposo 2021-01-13 17:32:56 +00:00 committed by Dillon-Brown
parent fc9fcfd2cf
commit 3e9aaa6675
7 changed files with 171 additions and 224 deletions

View file

@ -17,6 +17,7 @@ import {BrowserDynamicTestingModule} from '@angular/platform-browser-dynamic/tes
import {BrowserAnimationsModule} from '@angular/platform-browser/animations';
import {LanguageStore} from '@store/language/language.store';
import {languageStoreMock} from '@store/language/language.store.spec.mock';
import {waitUntil} from '@app-common/testing/utils.spec';
@Component({
@ -77,31 +78,17 @@ describe('BooleanFilterFieldComponent', () => {
expect(testHostComponent).toBeTruthy();
});
it('should have value', () => {
it('should have value', async (done) => {
expect(testHostComponent).toBeTruthy();
testHostComponent.field = {
type: 'boolean',
value: '1',
metadata: null,
definition: {
options: 'dom_int_bool'
},
criteria: {
values: ['1'],
operator: '='
},
formControl: new FormControl('1')
};
testHostFixture.detectChanges();
testHostFixture.whenStable().then(() => {
const field = testHostFixture.nativeElement.getElementsByTagName('scrm-boolean-filter')[0];
expect(field).toBeTruthy();
await waitUntil(() => field.getElementsByTagName('tag-input').item(0));
const tagInput = field.getElementsByTagName('tag-input').item(0);
expect(tagInput).toBeTruthy();
@ -119,7 +106,7 @@ describe('BooleanFilterFieldComponent', () => {
expect(deleteIcon).toBeTruthy();
});
done();
});

View file

@ -71,21 +71,11 @@ describe('DynamicEnumEditFieldComponent', () => {
expect(testHostComponent).toBeTruthy();
});
it('should have value', () => {
it('should have value', async (done) => {
expect(testHostComponent).toBeTruthy();
testHostComponent.field = {
type: 'dynamicenum',
value: '_customer',
metadata: null,
definition: {
options: 'account_type_dom'
}
};
testHostFixture.detectChanges();
testHostFixture.whenStable().then(() => {
await testHostFixture.whenRenderingDone();
const field = testHostFixture.nativeElement.getElementsByTagName('scrm-dynamicenum-edit')[0];
@ -108,7 +98,6 @@ describe('DynamicEnumEditFieldComponent', () => {
expect(deleteIcon).toBeTruthy();
});
done();
});
});

View file

@ -17,6 +17,7 @@ import {datetimeFormatterMock} from '@services/formatters/datetime/datetime-form
import {DateFormatter} from '@services/formatters/datetime/date-formatter.service';
import {dateFormatterMock} from '@services/formatters/datetime/date-formatter.service.spec.mock';
import {CurrencyFormatter} from '@services/formatters/currency/currency-formatter.service';
import {waitUntil} from '@app-common/testing/utils.spec';
@Component({
selector: 'enum-edit-field-test-host-component',
@ -71,21 +72,11 @@ describe('EnumEditFieldComponent', () => {
expect(testHostComponent).toBeTruthy();
});
it('should have value', () => {
it('should have value', async (done) => {
expect(testHostComponent).toBeTruthy();
testHostComponent.field = {
type: 'enum',
value: '_customer',
metadata: null,
definition: {
options: 'account_type_dom'
}
};
testHostFixture.detectChanges();
testHostFixture.whenStable().then(() => {
await testHostFixture.whenRenderingDone();
const field = testHostFixture.nativeElement.getElementsByTagName('scrm-enum-edit')[0];
@ -108,26 +99,16 @@ describe('EnumEditFieldComponent', () => {
expect(deleteIcon).toBeTruthy();
done();
});
});
it('should allow removing value', () => {
it('should allow removing value', async (done) => {
expect(testHostComponent).toBeTruthy();
const element = testHostFixture.nativeElement;
testHostComponent.field = {
type: 'enum',
value: '_customer',
metadata: null,
definition: {
options: 'account_type_dom'
}
};
testHostFixture.detectChanges();
testHostFixture.whenStable().then(() => {
await testHostFixture.whenRenderingDone();
const deleteIcon = element.getElementsByTagName('delete-icon').item(0);
@ -136,36 +117,29 @@ describe('EnumEditFieldComponent', () => {
deleteIcon.click();
testHostFixture.detectChanges();
testHostFixture.whenRenderingDone().then(() => {
await testHostFixture.whenStable();
const tag = element.getElementsByClassName('tag__text');
const field = testHostFixture.nativeElement.getElementsByTagName('scrm-enum-edit')[0];
expect(field).toBeTruthy();
await waitUntil(() => !field.getElementsByTagName('tag').item(0));
const tag = field.getElementsByTagName('tag');
expect(tag).toBeTruthy();
expect(tag.length).toEqual(0);
done();
});
});
});
it('should allow adding value', () => {
it('should allow adding value', async (done) => {
expect(testHostComponent).toBeTruthy();
const element = testHostFixture.nativeElement;
testHostComponent.field = {
type: 'enum',
value: '_customer',
metadata: null,
definition: {
options: 'account_type_dom'
}
};
testHostFixture.detectChanges();
testHostFixture.whenStable().then(() => {
await testHostFixture.whenRenderingDone();
const deleteIcon = element.getElementsByTagName('delete-icon').item(0);
@ -174,16 +148,16 @@ describe('EnumEditFieldComponent', () => {
deleteIcon.click();
testHostFixture.detectChanges();
testHostFixture.whenRenderingDone().then(() => {
await testHostFixture.whenStable();
const input = element.getElementsByTagName('tag-input-form').item(0);
input.click();
testHostFixture.detectChanges();
testHostFixture.whenRenderingDone().then(() => {
await testHostFixture.whenStable();
const menu = window.document.getElementsByClassName('ng2-dropdown-menu').item(0);
const menu = document.getElementsByClassName('ng2-dropdown-menu').item(0);
const item = menu.getElementsByClassName('ng2-menu-item').item(0);
expect(menu).toBeTruthy();
@ -192,7 +166,7 @@ describe('EnumEditFieldComponent', () => {
item.parentElement.click();
testHostFixture.detectChanges();
testHostFixture.whenRenderingDone().then(() => {
await testHostFixture.whenStable();
const tag = element.getElementsByTagName('tag').item(0);
@ -207,12 +181,7 @@ describe('EnumEditFieldComponent', () => {
expect(newDeleteIcon).toBeTruthy();
});
});
});
done();
});
});
});

View file

@ -17,6 +17,7 @@ import {datetimeFormatterMock} from '@services/formatters/datetime/datetime-form
import {DateFormatter} from '@services/formatters/datetime/date-formatter.service';
import {dateFormatterMock} from '@services/formatters/datetime/date-formatter.service.spec.mock';
import {CurrencyFormatter} from '@services/formatters/currency/currency-formatter.service';
import {waitUntil} from '@app-common/testing/utils.spec';
@Component({
selector: 'multienum-edit-field-test-host-component',
@ -24,7 +25,7 @@ import {CurrencyFormatter} from '@services/formatters/currency/currency-formatte
})
class MultiEnumEditFieldTestHostComponent {
field: Field = {
type: 'enum',
type: 'multienum',
value: null,
valueList: [
'_customer',
@ -75,25 +76,11 @@ describe('MultiEnumEditFieldComponent', () => {
expect(testHostComponent).toBeTruthy();
});
it('should have value', () => {
it('should have value', async (done) => {
expect(testHostComponent).toBeTruthy();
testHostComponent.field = {
type: 'enum',
value: null,
valueList: [
'_customer',
'_reseller'
],
metadata: null,
definition: {
options: 'account_type_dom'
}
};
testHostFixture.detectChanges();
testHostFixture.whenStable().then(() => {
await testHostFixture.whenRenderingDone();
const field = testHostFixture.nativeElement.getElementsByTagName('scrm-multienum-edit')[0];
@ -129,30 +116,18 @@ describe('MultiEnumEditFieldComponent', () => {
expect(deleteIcon2).toBeTruthy();
done();
});
});
it('should allow removing value', () => {
it('should allow removing value', async (done) => {
expect(testHostComponent).toBeTruthy();
testHostFixture.detectChanges();
await testHostFixture.whenRenderingDone();
const element = testHostFixture.nativeElement;
testHostComponent.field = {
type: 'enum',
value: null,
valueList: [
'_customer',
'_reseller'
],
metadata: null,
definition: {
options: 'account_type_dom'
}
};
testHostFixture.detectChanges();
testHostFixture.whenStable().then(() => {
await waitUntil(() => element.getElementsByTagName('delete-icon').item(0));
const deleteIcon = element.getElementsByTagName('delete-icon').item(0);
@ -161,17 +136,13 @@ describe('MultiEnumEditFieldComponent', () => {
deleteIcon.click();
testHostFixture.detectChanges();
testHostFixture.whenRenderingDone().then(() => {
await testHostFixture.whenRenderingDone();
const tag = element.getElementsByClassName('tag__text');
const tag = element.getElementsByTagName('tag');
expect(tag).toBeTruthy();
expect(tag.length).toEqual(1);
});
});
done();
});
});

View file

@ -26,7 +26,7 @@ import {dataTypeFormatterMock} from '@services/formatters/data-type.formatter.sp
})
class MultiEnumFilterFieldTestHostComponent {
field: Field = {
type: 'enum',
type: 'multienum',
value: null,
valueList: [
'_customer',
@ -82,5 +82,35 @@ describe('MultiEnumFilterFieldComponent', () => {
expect(testHostComponent).toBeTruthy();
});
it('should have value', async (done) => {
expect(testHostComponent).toBeTruthy();
testHostFixture.detectChanges();
await testHostFixture.whenRenderingDone();
const field = testHostFixture.nativeElement.getElementsByTagName('scrm-multienum-filter')[0];
expect(field).toBeTruthy();
const tagInput = field.getElementsByTagName('tag-input').item(0);
expect(tagInput).toBeTruthy();
const tag = tagInput.getElementsByTagName('tag').item(0);
expect(tag).toBeTruthy();
const tagText = tag.getElementsByClassName('tag__text').item(0);
expect(tagText.textContent).toContain('Customer');
expect(tagText.textContent).not.toContain('_customer');
const deleteIcon = tagInput.getElementsByTagName('delete-icon').item(0);
expect(deleteIcon).toBeTruthy();
done();
});
});

View file

@ -20,18 +20,9 @@ import {listStoreFactoryMock} from '@store/record-list/record-list.store.spec.mo
import {BrowserDynamicTestingModule} from '@angular/platform-browser-dynamic/testing';
import {NoopAnimationsModule} from '@angular/platform-browser/animations';
import {RelateEditFieldModule} from '@fields/relate/templates/edit/relate.module';
import {take} from 'rxjs/operators';
import {interval} from 'rxjs';
import {ModuleNameMapper} from '@services/navigation/module-name-mapper/module-name-mapper.service';
import {moduleNameMapperMock} from '@services/navigation/module-name-mapper/module-name-mapper.service.spec.mock';
export const waitUntil = async (untilTruthy: Function): Promise<boolean> => {
while (!untilTruthy()) {
await interval(25).pipe(take(1)).toPromise();
}
// eslint-disable-next-line compat/compat
return Promise.resolve(true);
};
import {waitUntil} from '@app-common/testing/utils.spec';
@Component({
selector: 'relate-edit-field-test-host-component',

View file

@ -0,0 +1,10 @@
import {take} from 'rxjs/operators';
import {interval} from 'rxjs';
export const waitUntil = async (untilTruthy: Function): Promise<boolean> => {
while (!untilTruthy()) {
await interval(25).pipe(take(1)).toPromise();
}
// eslint-disable-next-line compat/compat
return Promise.resolve(true);
};