diff --git a/apps/example-app/app/examples/14-async-component.spec.ts b/apps/example-app/app/examples/14-async-component.spec.ts new file mode 100644 index 00000000..6a2ca2e5 --- /dev/null +++ b/apps/example-app/app/examples/14-async-component.spec.ts @@ -0,0 +1,16 @@ +import { fakeAsync, tick } from '@angular/core/testing'; +import { render, screen, fireEvent } from '@testing-library/angular'; + +import { AsyncComponent } from './14-async-component'; + +test('can use fakeAsync utilities', fakeAsync(async () => { + await render(AsyncComponent); + + const load = await screen.findByRole('button', { name: /load/i }); + fireEvent.click(load); + + tick(10_000); + + const hello = await screen.findByText('Hello world'); + expect(hello).toBeInTheDocument(); +})); diff --git a/apps/example-app/app/examples/14-async-component.ts b/apps/example-app/app/examples/14-async-component.ts new file mode 100644 index 00000000..fbfd45ff --- /dev/null +++ b/apps/example-app/app/examples/14-async-component.ts @@ -0,0 +1,27 @@ +import { ApplicationInitStatus, Component, OnDestroy } from '@angular/core'; +import { Subject } from 'rxjs'; +import { delay, filter, mapTo } from 'rxjs/operators'; + +@Component({ + selector: 'app-fixture', + template: ` + +
{{ data }}
+ `, +}) +export class AsyncComponent implements OnDestroy { + actions = new Subject(); + data$ = this.actions.pipe( + filter((x) => x === 'LOAD'), + mapTo('Hello world'), + delay(10_000), + ); + + load() { + this.actions.next('LOAD'); + } + + ngOnDestroy() { + this.actions.complete(); + } +} diff --git a/projects/jest-utils/src/lib/create-mock.ts b/projects/jest-utils/src/lib/create-mock.ts index 1c1dea5c..7d18f152 100644 --- a/projects/jest-utils/src/lib/create-mock.ts +++ b/projects/jest-utils/src/lib/create-mock.ts @@ -29,6 +29,19 @@ export function createMock(type: Type): Mock { return mock; } +export function createMockWithValues( + type: Type, + values: Partial>, +): Mock { + const mock = createMock(type); + + Object.entries(values).forEach(([field, value]) => { + (mock as any)[field] = value; + }); + + return mock; +} + export function provideMock(type: Type): Provider { return { provide: type, diff --git a/projects/jest-utils/tsconfig.lib.json b/projects/jest-utils/tsconfig.lib.json index 0ef28c60..7a6179a2 100644 --- a/projects/jest-utils/tsconfig.lib.json +++ b/projects/jest-utils/tsconfig.lib.json @@ -14,7 +14,7 @@ "importHelpers": true, "allowSyntheticDefaultImports": true, "types": ["jest"], - "lib": ["dom", "es2015"] + "lib": ["dom", "es2018"] }, "angularCompilerOptions": { "enableIvy": false, diff --git a/projects/testing-library/tsconfig.lib.json b/projects/testing-library/tsconfig.lib.json index 3cac73f3..8506c888 100644 --- a/projects/testing-library/tsconfig.lib.json +++ b/projects/testing-library/tsconfig.lib.json @@ -13,7 +13,7 @@ "experimentalDecorators": true, "importHelpers": false, "types": ["node", "jest"], - "lib": ["dom", "es2015", "es2018.promise"] + "lib": ["dom", "es2018"] }, "angularCompilerOptions": { "enableIvy": false,