DEV Community

loading...

Overcoming SameSite cookie issue in Cypress when running on Chrome or Edge

poponuts
quality ๐Ÿ‘Œ | testing ๐Ÿงช | automation ๐Ÿค–
ใƒป2 min read

New year ๐ŸŽ‰, new me ๐Ÿคช... or maybe not, coz my โค๏ธ for Cypress has not died off... Well, almost.

You see, I just changed company last December (yey!) and my first few days were spent on building a basic automation framework. Understandably, first thing I tried out is the UI login ๐Ÿ”‘ (Sorry, API does not have the wow factor when you're doing a demo)

So, I told myself, "I got this and let me work my magic!" but boy, was I so wrong! Manually doing it, obviously, it works fine. Using Cypress' default browser, Electron, it works great. Having fun yet so far! Here we go... using Chrome, NA-DA โŒ! I got an 401 Unauthorised access error!

I could have been very lazy and just told everyone that if it works with Electron, then it should be fine but no, I was determined to make it work with Chrome. It took me maybe a couple of days, munching snacks while my belly blew up, and a thousand times clicking Stackoverflow and Github Cypress issues looking for an answer but there was none ๐Ÿ™…! I had to look outside Cypress and more on generic Javascript and after multiple hair-twisting re-tries scraping the XHR requests, I found the holy grail ๐Ÿ™๐Ÿป

With me hoping that customer churn rate with Cypress does not further increase, here's how you should do it:
Under cypress/plugins/index.js, include the following condition:

module.exports = (on, config) => {
    on('before:browser:launch', (browser = {}, launchOptions) => {
        if (browser.name === 'chrome' || browser.name === 'edge') {
            launchOptions.args.push('--disable-features=SameSiteByDefaultCookies') // bypass 401 unauthorised access on chromium-based browsers
            return launchOptions
        }
    })
}
Enter fullscreen mode Exit fullscreen mode

With the above code, SameSite default cookie issues are by-passed when using Chromium-based browsers. This includes Edge so don't forget to include that browser in the condition.

Again, happy Cypress testing! ๐Ÿค—

Discussion (1)

Collapse
amgadhassannabil profile image
AmgadHassanNabil

Thank you very much this worked like magic :D been stuck in this for sometime