4

I am trying to hide XHR calls on cypress test runner. I have added the below code in my support/index.js but it still doesn't work. Could anyone please suggest how it works?

Cypress.Server.defaults({
  delay:500,
  force404:false,
  ignore: (xhr) => {
    return false;
  },
})
Ask
  • 113
  • 1
  • 6

3 Answers3

15

Try this, works for me

Add the following to cypress/support/index.js:

// Hide fetch/XHR requests
const app = window.top;
if (!app.document.head.querySelector('[data-hide-command-log-request]')) {
  const style = app.document.createElement('style');
  style.innerHTML =
    '.command-name-request, .command-name-xhr { display: none }';
  style.setAttribute('data-hide-command-log-request', '');

  app.document.head.appendChild(style);
}

Referred and obtained details https://gist.github.com/simenbrekken/3d2248f9e50c1143bf9dbe02e67f5399

Niluka Monnankulama
  • 302
  • 2
  • 11
  • this works like a charm with Cypress v12.2 - Thanks a ton @Niluka Monnankulama – Jan and RESTless Mar 07 '23 at 12:03
  • Thanks a lot, this was a pain seeing all this queries in the test runner I'm very thankful to you the suite test run very quickly thanks to this, and we have less noise in the list – Mohamed FAIDA Jun 23 '23 at 09:14
1

It looks like Cypress.Server is deprecated along with cy.server() (possibly it's the same thing).

An intercept might do what you want

cy.intercept(url, (req) => {
  if (req.type === 'xhr') {
    // custom logic for handling
  }
})

But I don't think the example code you used was intended to "hide" the xhr requests. What is it you want to do with them?

Fody
  • 23,754
  • 3
  • 20
  • 37
1

You can also use this command:

Cypress.Server.defaults({
   
        ignore: (xhr) => bool   
})

Note: At least is working for the 9.7.0 Cypress version

alexandru catanet
  • 89
  • 3
  • 9