Skip to content

Commit

Permalink
feat(spectator): provide the index in the defer block method
Browse files Browse the repository at this point in the history
  • Loading branch information
@profanis
profanis committed Mar 4, 2024
1 parent eca951b commit cefc3a5
Show file tree
Hide file tree
Showing 4 changed files with 64 additions and 62 deletions.
42 changes: 21 additions & 21 deletions projects/spectator/jest/test/defer-block.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand Down Expand Up @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand Down
38 changes: 20 additions & 18 deletions projects/spectator/src/lib/spectator/spectator.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -51,42 +51,46 @@ export class Spectator<C> extends DomSpectator<C> {
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<DeferBlockFixture[]>): DeferBlocks {
private _deferBlocksForGivenFixture(deferBlockIndex = 0, deferBlockFixtures: Promise<DeferBlockFixture[]>): 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);
},
Expand All @@ -98,15 +102,15 @@ export class Spectator<C> extends DomSpectator<C> {
*
* @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<DeferBlockFixture[]>
deferBlockFixtures: Promise<DeferBlockFixture[]>
): Promise<DeferBlockFixture> {
const deferFixture = (await deferBlockFixture)[deferBlockIndex];
const deferFixture = (await deferBlockFixtures)[deferBlockIndex];

await deferFixture.render(deferBlockState);

Expand All @@ -120,9 +124,7 @@ export class Spectator<C> extends DomSpectator<C> {
*/
private _childrenDeferFixtures(deferFixture: DeferBlockFixture): NestedDeferBlocks {
return {
deferBlocks: {
...this._deferBlocksForGivenFixture(deferFixture.getDeferBlocks()),
},
deferBlock: (deferBlockIndex = 0) => this._deferBlocksForGivenFixture(deferBlockIndex, deferFixture.getDeferBlocks()),
};
}
}
10 changes: 5 additions & 5 deletions projects/spectator/src/lib/types.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -31,14 +31,14 @@ export type KeysMatching<T, V> = { [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<NestedDeferBlocks>;
renderPlaceholder(deferBlockIndex?: number): Promise<NestedDeferBlocks>;
renderLoading(deferBlockIndex?: number): Promise<NestedDeferBlocks>;
renderError(deferBlockIndex?: number): Promise<NestedDeferBlocks>;
renderComplete(): Promise<NestedDeferBlocks>;
renderPlaceholder(): Promise<NestedDeferBlocks>;
renderLoading(): Promise<NestedDeferBlocks>;
renderError(): Promise<NestedDeferBlocks>;
}

export interface KeyboardEventOptions {
Expand Down
36 changes: 18 additions & 18 deletions projects/spectator/test/defer-block.spec.ts
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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');
Expand Down Expand Up @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand All @@ -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');
Expand Down

0 comments on commit cefc3a5

Please sign in to comment.