Using Cypress fixtures to provide mock data

When it comes to writing E2E tests, fixtures play a great role in making sure the tests are not flaky (don’t have different results in different test runs). Consider that your tests rely on fetching data from your API server, or your tests include snapshot testing, which includes fetching images from a Content Delivery Network (CDN) or a third-party API. Although they’re technically required for the tests to run successfully, it is not important that the server data and the images are fetched from the original source; therefore, we can create fixtures for them. In this recipe, we’ll create fixtures for the bucket data to avoid having to run the server for the e2e tests.

Getting ready

The app that we are going to work with resides in start/apps/chapter11/ng-cy-mock-data inside the cloned repository. However, the e2e tests are in the folder start/apps/chapter11/ng-cy-mock-data-e2e. In this recipe, we’re...