Changing data for route in cypress test for QraphQ

Question

I have an Angular application using QraphQL. I write a test in cypress, looking like this:

it('should do something', () => {
  cy.server();
  cy.route('POST', '/graphql', 'fixture:data1.json');
  // data is loaded from the endpoint to populate the page
  cy.visit('http://localhost:3000/#/something/somethingElse');

  // when the button is clicked, the same endpoint is called again,
  // but now I need it to deliver some other data.
  cy.get('button')
    .click();
});

Can anyone provide me with a way to set this up? Thanks in advance

Answer 1

Maybe you can use easygraphql to solve this challenge!! There are multiple packages that can be used:

1. easygraphql-now: you can create a script on your package.json that will run "easygraphql-now schema.gql --graphiql --local -p=7000" where you pass the schema route, local and graphiql flag, and the port... so when you run it; it will create a mocked server of the passed schema, so your Angular application will make request to a server that will respond a mock of your query. Here is a post that can be useful.

2. easygraphql-mock: if you want to return a complete mock of the type, you can use this package, and with this, you don't have to create fixtures for each type.

3. easygraphql-tester: It's similar to easygraphql-mock but with the difference that you can return the mock of the query, check the docs

If you decide to use easygraphql to solve this, feel free to create the example on the repo, there is an issue here to create an example using Cypress