Hide XHR calls on Cypress test runner

Viewed 1822

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;
  },
})
3 Answers

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

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?

You can also use this command:

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

Note: At least is working for the 9.7.0 Cypress version

Related