An end-to-end test has been developed for a feature that utilizes ngrx state management. This particular feature gathers user inputs over a span of 60 seconds using the auditTime() operator and then sends them to an API endpoint.
To speed up testing, instead of waiting for the full 60 seconds each time, there was an attempt to use the cy.tick(58000) function to fast forward time. However, it seems that this method doesn't actually skip time as expected.
it('should send a http post request after 60 seconds', () => {
cy.intercept('POST', '**/my-page').as('my-post'); // intercept the post
cy.clock(); // instantiate clock object
cy.visit('/home'); // visit page
// some inputs here
cy.tick(58000); // skip 58 seconds
// this wait command times out
cy.wait('@my-post', { timeout: 15000 }).then((interception: any) => {
const statusCode = interception.response.statusCode;
expect(statusCode).equal(200);
});
});
The observable that uses the auditTime operator is generated within an ngrx effect:
postObservable$ = createEffect(() =>
this.store.select(FromData.selectData).pipe(
auditTime(60_000), // important part
filter((data) => data.length > 0),
map((result) => [
...result.map((dataElement) =>
toDataDTO({
dataId: dataElement.postId,
createdAt: dataElement.createdAt,
})
),
]),
...
});
Every time, the test reaches a timeout after 15 seconds. It functions properly if the auditTime() duration is reduced to one second or shorter.
Is there a way to ensure that Cypress ticks can effectively work with rxjs operators like auditTime()?