Closed plweil closed 9 months ago
nagash77
commented
1 year ago Hi @plweil unfortunately we will not be able to replicate your component in order to replicate this behavior and so I do not see a way forward on further investigation. Have you taken any steps to simplify the test to verify you can intercept the second call when that is the only call being intercepted?
I would suggest you check out the Cypress Discord Community 
plweil
commented
1 year ago Hi @nagash77 Simplifying the test as you suggested does not change anything. Cypress still cannot intercept that XHR GET request.
Am I telling Cypress to wait for this request properly? Or, barring something really unusual or unexpected about this app, shouldn't it work as written? I don't think this is Vue- or component-specific. It's just a XHR redirect from Laravel. Surely you don't need to replicate exactly all of the different apps and components people are using(?)
Or, to put the question somewhat differently, theoretically, what could prevent Cypress from catching the redirect?
jennifer-shehane
commented
9 months ago @plweil It’s not obvious what would prevent it from being intercepted in this case. That’s why we would need some way to run and see the behavior to track down what makes your case different. The code looks like it should work if ththere is an XHR that matches.
Current behavior
I'm testing a form in a Laravel/Vue/Inertia application that can select from a list of users. The form adds a new user (an XHR post) to the database. The Laravel controller then redirects back to the form (an XHR GET). The form's user menu now contains the updated list of users.
This works manually. But when I test in Cypress, it fails. I set up an interceptor for each XHR request. But even though the redirect occurs, the second XHR request (the one aliased as "@loadPage") is still spinning around in the Cypress spec window. It's as if Cypress is just plain missing the redirect.
Desired behavior
Cypress should obey the second interceptor, wait for and recognize the redirect (XHR GET), and then "see" the updated content on the page.
To reproduce this, I have the following:
A form in a Vue 3 component with a list of registered members in a select. The form links to a second form in a modal that allows you to add a new member to the database via Inertia's form helper
The form helper submits the new user data, hits a Laravel UserController that adds the new user and redirects back to the page. The form on this page now contains the updated user data, which is detectable via
cy.contains()When this is done manually, everything works as intended
Test code to reproduce
Cypress Version
12.17.2
Node version
16.20.1
Operating System
macOS 12.6.8
Debug Logs
Other
If there is some other way to catch the redirect other than the interceptor I am using, I'd love to know what it is.