cypress

I am new to Cypress for javascrpt testing. I'm testing a basic react app with css. Whether I import css directly or use css modules, the test always fails with: ul { ^ ParseError: Unexpected token That ParseError is shown in the cypress test runner. It also has this text in the test runner sidebar: This occurred while Cypress was compiling and bundling your test code. This is usually caused by: A missing file or dependency A syntax error in the file or one of its dependencies Fix the error in your code and re-run your tests. Even with an out of the box create-react-app app, the App.test.js

Is this: cy.get('[name=planSelect]').contains(dummyPlan) equivalent to this: cy.get('[name=planSelect]').should('contain', dummyPlan) And if so, which is preferred? The first is more of an implicit assertion, but it's shorter and cleaner to my mind. Follow-up question: After looking around to see how best to select elements for e2e testing I found that the Cypress docs recommend using data-cy attributes. Is there a reason this would be better than just adding name attributes to the markup? Should name only be used for forms fields? The result on your cypress test will be the same if the

Must be missing something obvious but I am very much stuck on logins into Django due to its CSRF protection. I looked Check out our example recipes using cy.getCookie() to test logging in using HTML web forms but that really doesn't help that much if the first thing it recommends is disabling CSRF. What Django wants: This is what a normal, CSRF-protected, Django login view is expecting in its incoming POST data: csrfmiddlewaretoken=Y5WscShtwZn3e1eCyahdqPURbfHczLyXfyPRsEOWacdUcGNYUn2EK6pWyicTLSXT username=guest password=password next It is not looking for the CSRF in the request headers and it

I have some ad calls that are only made on mobile devices. In Chrome, I can use Device Mode and simulate a mobile device, and the resulting ad call from the server is correctly tailored to mobile. I'm not sure how Chrome does this, except possibly by sending a different user agent. In the Cypress.io documentation, it says the user agent can be changed in the configuration file (Cypress.json). But, I need to run a test for a desktop viewport and then a mobile viewport with a mobile user agent. Is there a way to change the user agent programmatically? The other answers do not set the User-Agent

I have a single endpoint in the application. We hit the same api for each request with different action in the params. URL: /application/api Sample Request Payload 1: { "action": "CARD_TRANSACTION_HISTORY", "data": { "date_from": "2018-12-01", "date_to": "2018-12-31", "total": 5 }, "meta": {} } Sample Request Payload 2: { "action": "CARD_BALANCE", "data": { "date_from": "2018-12-01", "date_to": "2018-12-31", "total": 5 }, "meta": {} } Sample Request Payload 3: { "action": "CURRENCY_RATES", "data": { "date_from": "2018-12-01", "date_to": "2018-12-31", "total": 5 }, "meta": {} } the action in

I know that it is possible to wait for multiple XHR requests on the same url as shown here . However, I would like to wait for two requests running in parallel. cy.wait('@users') cy.wait('@users') When I add two waits as shown above, the second one sometimes timeouts when they finish very closely together, as it basically misses the XHR. CypressError: Timed out retrying: cy.wait() timed out waiting 30000ms for the 1st response to the route: 'users'. No response ever occurred. I do not like the introduction of flakiness. Is there a better way to write this that I am missing? You can wait for an

I'm trying to find a way to check if an error has been written to the console when running a cypress unit test. I know how to log something to the console cy.log('log this to the console'); but not how to check if an error has been written to it. any suggestions how to read errors from the (browser) console log? note: probably not the "smart" way to test but sometimes my js libraries which I use would "complain" and write the errors to the browser log. this is to simplify testing. Edit: the following does not directly log to terminal when in headless mode, but it nonetheless fails the test on

When using cypress.io to test an angular web page, whats the best / most reliable way to detect when the page is fully loaded and idle. Not just the onload event. Needs to include all XHR requests, angular digest cycles complete and all rendering complete including all animations complete. The reason is that at this point I want to test that the page does NOT contain an element and cant test that until all the above is fully complete. You can make Cypress wait for any request to complete before it proceeds. So if you want to wait for all XHR of a certain page, you can do the following for each