Some of my website's HTTP requests are failing only in the Cypress browser (e.g. signing up for a new account). After debugging, it was discovered this was due to the response header returning a different content-type in the Cypress browser.
Chrome browser:
content-type: application/json
Cypress browser (not running headlessly):
Content-type: application/json; charset=utf-8
Cypress is adding "charset=utf-8" to the content-type.
Return the same content-type as the Chrome browser.
3.1.5
Chrome 72
I also encountered the same problem. Previously my app checks the Content-Type of the http response by doing a string comparison which fails. I refactored it so it checks the existence of the desired type instead:
// wrong
response.headers.get('Content-Type') === 'application/json'
// right
response.headers.get('Content-Type').includes('application/json')
I don't think you can always safely assume that browsers will only send 'application/json' in the Content-Type header. Hope that helps.
@yusinto yeah, that was my solution to this problem as well.
In my case strange is that,
when running test on _locally deployed_ (localhost) web page, the header is unchanged: application/json
But when testing the same web app _remotely deployed_ (s3 + CloudFront), the header is extended with charset=utf-8
This is a symptom of ExpressJS (which Cypress uses for the internal proxy server) forcing charset=utf-8 on all responses, which will be fixed by #4698.
The code for this is done in cypress-io/cypress#4698, but has yet to be released.
We'll update this issue and reference the changelog when it's released.
Released in 3.4.1.
Thank you!
Most helpful comment
@yusinto yeah, that was my solution to this problem as well.