Cypress: Cypress is not capturing app XHR its only capturing 3rd party XHR calls

Created on 19 Apr 2018  路  19Comments  路  Source: cypress-io/cypress

Current behavior:

Request(XHR) going to 3rd party is captured
image
Request going to our own api is not captured:
image

Desired behavior:

Every XHR request on page load should be captured.

Steps to reproduce:

cy.visit('/');
          cy.get('select#users').select('ShootCoordinator')
          cy.get('input').click();
          cy.wait(2000)
          cy.get('.filter-callout.medium-text').contains('Filters')
          cy.visit('/asosstudio/');

Versions

Latest version of Cypress, latest version of Chrome and on Windows 7 OS

unexpected behavior

Most helpful comment

I guess I know the answer. For some reason Cypress is not intercepting requests, when application uses Fetch API instead of XHR API.

Our application under test contains a lib which checks if browser knows about 'fetch' function. If not, it fallbacks to XHR-based requests. So, our solution was to "disable" fetch feature to cause this fallback. Our tests do the following:

(support/index.js)

Cypress.on('window:before:load', (win) => {
    win.fetch = null;
});

But in your case it might not work. Check with your developers if they use Fetch API, and if yes, ask if they can provide fallback to XHR API.

I can't swear that your problem is of the same origin, but it looks exactly like ours to me.

All 19 comments

@brian-mann please help on above

@arun290636 Can you provide a minimal reproducible example?

Have you tried setting up a cy.route() to listen for the request and cy.wait() to ensure it is captured?

Also, am I correct in seeing that you are visiting localhost:3000 and also doing a POST request to a localhost:3000 endpoint?

Sorry, it is a bit difficult as @ValerieThoma said to track down the issue just from screenshots. If there is any way you could get us closer to reproducing it ourselves, that would help.

@ValerieThoma @jennifer-shehane I have tried all options and not working for me. See below document for more details:
CypressIssue.docx

@jennifer-shehane you are right i am visiting localhost:3000 and making request to local host.
Page URL - http://localhost:3000/abc/

XHR calls
http://localhost:3000/abc/api/User/GetUserInformation
Request Method:GET
https://dam-dev-web.xyz.com/abc/Tasks?group=shoots
Request Method:OPTIONS
http://localhost:3000/abc/api/TaskData/GetTasks/Shoot
Request Method:POST

@jennifer-shehane I have tried in our test environment as well . Its not capturing XHR requests.

@jennifer-shehane @ValerieThoma let me know if you want me to share my screen etc.

Ok, I see the code you posted in your example. You are writing:
cy.wait('@testing', { timeout: 600000 }.

Where did you originally define the testing alias I'm not seeing that included in the code. Since that is the xhr you are concerned about, I'd like to see the route where you defined the testing alias. Thanks.

I guess I know the answer. For some reason Cypress is not intercepting requests, when application uses Fetch API instead of XHR API.

Our application under test contains a lib which checks if browser knows about 'fetch' function. If not, it fallbacks to XHR-based requests. So, our solution was to "disable" fetch feature to cause this fallback. Our tests do the following:

(support/index.js)

Cypress.on('window:before:load', (win) => {
    win.fetch = null;
});

But in your case it might not work. Check with your developers if they use Fetch API, and if yes, ask if they can provide fallback to XHR API.

I can't swear that your problem is of the same origin, but it looks exactly like ours to me.

Does this mean that cypress doesn't support Fetch API? I confirm that Fetch requests won't be captured by cypress.

It doesn't. There is an open issue for that: https://github.com/cypress-io/cypress/issues/687

Unfortunately we have to close this issue as there is not enough information to reproduce the problem.

Please comment in this issue with a reproducible example and we will reopen the issue. 馃檹

hi @jennifer-shehane,

I have similar issue when Cypress cannot catch 3rd party XHR call. Can you please help?

image

Thanks

@manphannvg Since there is content ?s=&t...after the end of your glob pattern, you'll need to add another*` to make sure it matches correctly. Can you try?

**/properties/searchmetadata*

@jennifer-shehane, Thanks for quick response. Unfortunately, it still not work

image

@manphannvg Can you use the Cypress.minimatch method to confirm the glob is matching the entire url. https://on.cypress.io/minimatch#Examples

@manphannvg Can you use the Cypress.minimatch method to confirm the glob is matching the entire url. https://on.cypress.io/minimatch#Examples

It's a true. But still cannot be catched @jennifer-shehane
image

Hi, did you get a solution to this? I'm facing the same problem, cypress is not catching the xhr requests in Left Hand Pane (LHP) but they are there in the network tab of dev tools.
The problem is, i can see the requests in LHP when i run the code in one single describe, it() block but using multiple blocks, i don't see the requests.

Note that routes using the Fetch API will not be intercepted using cy.route: https://on.cypress.io/route currently. https://github.com/cypress-io/cypress/issues/95

Was this page helpful?
0 / 5 - 0 ratings

Related issues

carloscheddar picture carloscheddar  路  3Comments

zbigniewkalinowski picture zbigniewkalinowski  路  3Comments

brian-mann picture brian-mann  路  3Comments

EirikBirkeland picture EirikBirkeland  路  3Comments

rbung picture rbung  路  3Comments