Cypress not matching stubbed route

Question

I'm doing this in my app code:

const xhr = new XMLHttpRequest();
xhr.open("GET", "https://api.gizconnection.com/labels", true);
xhr.setRequestHeader("Authorization", "Bearer " + authService.getToken());
xhr.send(null);

and in my test I have:

it.only("test", () => {
  cy.server();
  cy.route("GET", "https://api.gizconnection.com/labels", [
    { text: "foo" }
  ]);
});

but is not matching and I'm going crazy.

In CY's log I'm seeing the request but says it doesn't match:

In Chrome's devtools I'm seeing it but the response I get is the real one from the server:

any ideas?

Answer 1

As stated in the docs here, the url must match exactly when using a string which can be tricky. I recommend using the glob pattern option:

it.only("test", () => {
  cy.server();
  cy.route("GET", "**/labels", [
    { text: "foo" }
  ]);
});