diff --git a/projects/spectator/jest/test/defer-block.spec.ts b/projects/spectator/jest/test/defer-block.spec.ts index 56e2184b..06d84823 100644 --- a/projects/spectator/jest/test/defer-block.spec.ts +++ b/projects/spectator/jest/test/defer-block.spec.ts @@ -67,7 +67,7 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - await spectator.deferBlocks.renderComplete(); + await spectator.deferBlock().renderComplete(); // Assert expect(spectator.element.outerHTML).toContain('empty defer block'); @@ -78,7 +78,7 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - await spectator.deferBlocks.renderPlaceholder(); + await spectator.deferBlock().renderPlaceholder(); // Assert expect(spectator.element.outerHTML).toContain('this is the placeholder text'); @@ -89,7 +89,7 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - await spectator.deferBlocks.renderLoading(); + await spectator.deferBlock().renderLoading(); // Assert expect(spectator.element.outerHTML).toContain('this is the loading text'); @@ -100,7 +100,7 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - await spectator.deferBlocks.renderError(); + await spectator.deferBlock().renderError(); // Assert expect(spectator.element.outerHTML).toContain('this is the error text'); @@ -164,8 +164,8 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - const parentCompleteState = await spectator.deferBlocks.renderComplete(); - await parentCompleteState.deferBlocks.renderComplete(); + const parentCompleteState = await spectator.deferBlock().renderComplete(); + await parentCompleteState.deferBlock().renderComplete(); // Assert expect(spectator.element.outerHTML).toContain('complete state #1.1'); @@ -176,9 +176,9 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - const parentCompleteState = await spectator.deferBlocks.renderComplete(); - const childrenCompleteState = await parentCompleteState.deferBlocks.renderComplete(); - await childrenCompleteState.deferBlocks.renderComplete(); + const parentCompleteState = await spectator.deferBlock().renderComplete(); + const childrenCompleteState = await parentCompleteState.deferBlock().renderComplete(); + await childrenCompleteState.deferBlock().renderComplete(); // Assert expect(spectator.element.outerHTML).toContain('complete state #1.1.1'); @@ -189,9 +189,9 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - const parentCompleteState = await spectator.deferBlocks.renderComplete(); - const childrenCompleteState = await parentCompleteState.deferBlocks.renderComplete(); - await childrenCompleteState.deferBlocks.renderPlaceholder(); + const parentCompleteState = await spectator.deferBlock().renderComplete(); + const childrenCompleteState = await parentCompleteState.deferBlock().renderComplete(); + await childrenCompleteState.deferBlock().renderPlaceholder(); // Assert expect(spectator.element.outerHTML).toContain('placeholder state #1.1.1'); @@ -202,9 +202,9 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - const parentCompleteState = await spectator.deferBlocks.renderComplete(); - const childrenCompleteState = await parentCompleteState.deferBlocks.renderComplete(); - await childrenCompleteState.deferBlocks.renderComplete(1); + const parentCompleteState = await spectator.deferBlock().renderComplete(); + const childrenCompleteState = await parentCompleteState.deferBlock().renderComplete(); + await childrenCompleteState.deferBlock(1).renderComplete(); // Assert expect(spectator.element.outerHTML).toContain('complete state #1.1.2'); @@ -215,9 +215,9 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - const parentCompleteState = await spectator.deferBlocks.renderComplete(); - const childrenCompleteState = await parentCompleteState.deferBlocks.renderComplete(); - await childrenCompleteState.deferBlocks.renderPlaceholder(1); + const parentCompleteState = await spectator.deferBlock().renderComplete(); + const childrenCompleteState = await parentCompleteState.deferBlock().renderComplete(); + await childrenCompleteState.deferBlock(1).renderPlaceholder(); // Assert expect(spectator.element.outerHTML).toContain('placeholder state #1.1.2'); @@ -228,7 +228,7 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - await spectator.deferBlocks.renderPlaceholder(); + await spectator.deferBlock().renderPlaceholder(); // Assert expect(spectator.element.outerHTML).toContain('placeholder state #1'); @@ -239,7 +239,7 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - await spectator.deferBlocks.renderLoading(); + await spectator.deferBlock().renderLoading(); // Assert expect(spectator.element.outerHTML).toContain('loading state #1'); @@ -250,7 +250,7 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - await spectator.deferBlocks.renderError(); + await spectator.deferBlock().renderError(); // Assert expect(spectator.element.outerHTML).toContain('error state #1'); diff --git a/projects/spectator/src/lib/spectator/spectator.ts b/projects/spectator/src/lib/spectator/spectator.ts index 7784c61b..db370871 100644 --- a/projects/spectator/src/lib/spectator/spectator.ts +++ b/projects/spectator/src/lib/spectator/spectator.ts @@ -51,42 +51,46 @@ export class Spectator extends DomSpectator { this.detectChanges(); } - public get deferBlocks(): DeferBlocks { - return this._deferBlocksForGivenFixture(this.fixture.getDeferBlocks()); + public deferBlock(deferBlockIndex = 0): DeferBlocks { + return this._deferBlocksForGivenFixture(deferBlockIndex, this.fixture.getDeferBlocks()); } /** * - * @param deferBlockFixture Defer block fixture + * @param deferBlockFixtures Defer block fixture * @returns deferBlock object with methods to access the defer blocks */ - private _deferBlocksForGivenFixture(deferBlockFixture: Promise): DeferBlocks { + private _deferBlocksForGivenFixture(deferBlockIndex = 0, deferBlockFixtures: Promise): DeferBlocks { return { - renderComplete: async (deferBlockIndex = 0) => { + renderComplete: async () => { const renderedDeferFixture = await this._renderDeferStateAndGetFixture( DeferBlockState.Complete, deferBlockIndex, - deferBlockFixture + deferBlockFixtures ); return this._childrenDeferFixtures(renderedDeferFixture); }, - renderPlaceholder: async (deferBlockIndex = 0) => { + renderPlaceholder: async () => { const renderedDeferFixture = await this._renderDeferStateAndGetFixture( DeferBlockState.Placeholder, deferBlockIndex, - deferBlockFixture + deferBlockFixtures ); return this._childrenDeferFixtures(renderedDeferFixture); }, - renderLoading: async (deferBlockIndex = 0) => { - const renderedDeferFixture = await this._renderDeferStateAndGetFixture(DeferBlockState.Loading, deferBlockIndex, deferBlockFixture); + renderLoading: async () => { + const renderedDeferFixture = await this._renderDeferStateAndGetFixture( + DeferBlockState.Loading, + deferBlockIndex, + deferBlockFixtures + ); return this._childrenDeferFixtures(renderedDeferFixture); }, - renderError: async (deferBlockIndex = 0) => { - const renderedDeferFixture = await this._renderDeferStateAndGetFixture(DeferBlockState.Error, deferBlockIndex, deferBlockFixture); + renderError: async () => { + const renderedDeferFixture = await this._renderDeferStateAndGetFixture(DeferBlockState.Error, deferBlockIndex, deferBlockFixtures); return this._childrenDeferFixtures(renderedDeferFixture); }, @@ -98,15 +102,15 @@ export class Spectator extends DomSpectator { * * @param deferBlockState complete, placeholder, loading or error * @param deferBlockIndex index of the defer block to render - * @param deferBlockFixture Defer block fixture + * @param deferBlockFixtures Defer block fixture * @returns Defer block fixture */ private async _renderDeferStateAndGetFixture( deferBlockState: DeferBlockState, deferBlockIndex = 0, - deferBlockFixture: Promise + deferBlockFixtures: Promise ): Promise { - const deferFixture = (await deferBlockFixture)[deferBlockIndex]; + const deferFixture = (await deferBlockFixtures)[deferBlockIndex]; await deferFixture.render(deferBlockState); @@ -120,9 +124,7 @@ export class Spectator extends DomSpectator { */ private _childrenDeferFixtures(deferFixture: DeferBlockFixture): NestedDeferBlocks { return { - deferBlocks: { - ...this._deferBlocksForGivenFixture(deferFixture.getDeferBlocks()), - }, + deferBlock: (deferBlockIndex = 0) => this._deferBlocksForGivenFixture(deferBlockIndex, deferFixture.getDeferBlocks()), }; } } diff --git a/projects/spectator/src/lib/types.ts b/projects/spectator/src/lib/types.ts index 2beab309..e83133d1 100644 --- a/projects/spectator/src/lib/types.ts +++ b/projects/spectator/src/lib/types.ts @@ -31,14 +31,14 @@ export type KeysMatching = { [K in keyof T]: T[K] extends V ? K : never }[ export type SelectOptions = string | string[] | HTMLOptionElement | HTMLOptionElement[]; export type NestedDeferBlocks = { - deferBlocks: DeferBlocks; + deferBlock: (deferBlockIndex?: number) => DeferBlocks; }; export interface DeferBlocks { - renderComplete(deferBlockIndex?: number): Promise; - renderPlaceholder(deferBlockIndex?: number): Promise; - renderLoading(deferBlockIndex?: number): Promise; - renderError(deferBlockIndex?: number): Promise; + renderComplete(): Promise; + renderPlaceholder(): Promise; + renderLoading(): Promise; + renderError(): Promise; } export interface KeyboardEventOptions { diff --git a/projects/spectator/test/defer-block.spec.ts b/projects/spectator/test/defer-block.spec.ts index febd210f..2bd8bfd9 100644 --- a/projects/spectator/test/defer-block.spec.ts +++ b/projects/spectator/test/defer-block.spec.ts @@ -63,7 +63,7 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - spectator.deferBlocks.renderComplete(); + await spectator.deferBlock().renderComplete(); // Assert expect(spectator.element.outerHTML).toContain('empty defer block'); @@ -127,8 +127,8 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - const parentCompleteState = await spectator.deferBlocks.renderComplete(); - await parentCompleteState.deferBlocks.renderComplete(); + const parentCompleteState = await spectator.deferBlock().renderComplete(); + await parentCompleteState.deferBlock().renderComplete(); // Assert expect(spectator.element.outerHTML).toContain('complete state #1.1'); @@ -139,9 +139,9 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - const parentCompleteState = await spectator.deferBlocks.renderComplete(); - const childrenCompleteState = await parentCompleteState.deferBlocks.renderComplete(); - await childrenCompleteState.deferBlocks.renderComplete(); + const parentCompleteState = await spectator.deferBlock().renderComplete(); + const childrenCompleteState = await parentCompleteState.deferBlock().renderComplete(); + await childrenCompleteState.deferBlock().renderComplete(); // Assert expect(spectator.element.outerHTML).toContain('complete state #1.1.1'); @@ -152,9 +152,9 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - const parentCompleteState = await spectator.deferBlocks.renderComplete(); - const childrenCompleteState = await parentCompleteState.deferBlocks.renderComplete(); - await childrenCompleteState.deferBlocks.renderPlaceholder(); + const parentCompleteState = await spectator.deferBlock().renderComplete(); + const childrenCompleteState = await parentCompleteState.deferBlock().renderComplete(); + await childrenCompleteState.deferBlock().renderPlaceholder(); // Assert expect(spectator.element.outerHTML).toContain('placeholder state #1.1.1'); @@ -165,9 +165,9 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - const parentCompleteState = await spectator.deferBlocks.renderComplete(); - const childrenCompleteState = await parentCompleteState.deferBlocks.renderComplete(); - await childrenCompleteState.deferBlocks.renderComplete(1); + const parentCompleteState = await spectator.deferBlock().renderComplete(); + const childrenCompleteState = await parentCompleteState.deferBlock().renderComplete(); + await childrenCompleteState.deferBlock(1).renderComplete(); // Assert expect(spectator.element.outerHTML).toContain('complete state #1.1.2'); @@ -178,9 +178,9 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - const parentCompleteState = await spectator.deferBlocks.renderComplete(); - const childrenCompleteState = await parentCompleteState.deferBlocks.renderComplete(); - await childrenCompleteState.deferBlocks.renderPlaceholder(1); + const parentCompleteState = await spectator.deferBlock().renderComplete(); + const childrenCompleteState = await parentCompleteState.deferBlock().renderComplete(); + await childrenCompleteState.deferBlock(1).renderPlaceholder(); // Assert expect(spectator.element.outerHTML).toContain('placeholder state #1.1.2'); @@ -191,7 +191,7 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - await spectator.deferBlocks.renderPlaceholder(); + await spectator.deferBlock().renderPlaceholder(); // Assert expect(spectator.element.outerHTML).toContain('placeholder state #1'); @@ -202,7 +202,7 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - await spectator.deferBlocks.renderLoading(); + await spectator.deferBlock().renderLoading(); // Assert expect(spectator.element.outerHTML).toContain('loading state #1'); @@ -213,7 +213,7 @@ describe('DeferBlock', () => { const spectator = createComponent(); // Act - await spectator.deferBlocks.renderError(); + await spectator.deferBlock().renderError(); // Assert expect(spectator.element.outerHTML).toContain('error state #1');