1 year ago
#316454
303
Error: Timeout - Async function did not complete within 5000ms although test function is not async
I am writing Angular 13 component tests. When starting the test suite in watch mode, it always runs flawlessly the first time. But from the second time on, all my integrated tests consistently fail with an error like the following.
1) displays two columns
TableComponent Integrated tests desktop one column with data display of type regular
Error: Timeout - Async function did not complete within 5000ms (set by jasmine.DEFAULT_TIMEOUT_INTERVAL)
at <Jasmine>
But the test is not async. Here is the test code:
@Component({
selector: 'app-test-host',
template: '<app-table [data]="data" [config]="config"></app-table>',
})
class TestHostComponent {
data: Array<Record<string, unknown>>
config: TableConfig<Record<string, unknown>>
}
describe('TableComponent', () => {
let testHostComponentFixture: ComponentFixture<TestHostComponent>
let testHostComponent: TestHostComponent
let tableComponentFixture: ComponentFixture<TableComponent<Record<string, unknown>>>
let tableComponent: TableComponent<Record<string, unknown>>
const setupDependencies = async (dependencies: Partial<TestModuleMetadata>) => {
await TestBed.configureTestingModule({
declarations: dependencies.declarations,
imports: dependencies.imports,
schemas: dependencies.schemas,
providers: [TableComponent],
}).compileComponents()
}
// [...] Isolated tests
describe('Integrated tests', () => {
beforeEach(async () => {
await setupDependencies({
imports: [InlineSVGModule, HttpClientModule],
declarations: [TestHostComponent, TableComponent, CoIconComponent],
})
})
describe('desktop', () => {
describe('one column with data display of type regular', () => {
beforeEach(async () => {
testHostComponentFixture = TestBed.createComponent(TestHostComponent)
testHostComponent = testHostComponentFixture.componentInstance
testHostComponent.config = [
{
columnName: 'Lorem',
columnType: 'data',
alignment: 'left',
dataDisplayType: 'regular',
dataId: 'lorem',
},
]
testHostComponent.data = [{ lorem: 'ipsum' }, { lorem: 'dolor' }, { lorem: 'sit' }, { lorem: 'amet' }]
testHostComponentFixture.detectChanges()
await testHostComponentFixture.whenStable()
})
it('displays two columns', () => {
const columns = testHostComponentFixture.debugElement.queryAll(By.css('tr:nth-child(1) td'))
expect(columns.length).toEqual(2)
})
})
})
})
})
When having more tests in the Integrated tests
suite, all of them fail but only after a first successful run. It doesn't seem to matter, what I test in there. Isolated tests and tests in other files are unaffected.
I tried destroying the fixture in an afterEach
hook but it didn't solve the problem. I am at a loss.
angular
jasmine
angular-test
0 Answers
Your Answer