App & Browser Testing Made Easy

Give your users a seamless experience by testing on 3000+ real devices and browsers. Don't compromise with emulators and simulators

Get Started free
Home Guide How to use Cypress Clear Cookies Command?

How to use Cypress Clear Cookies Command?

By Siddharth Murugan, Community Contributor -

Before getting started, let us understand what cookies are. Cookies are pieces of information that are stored by websites in our browsers. This information will be utilized by the respective websites based on their needs. Sometimes there may be a need to clear those cookies to test a website. 

How do Cypress cookies work?

Cypress runner/browser makes use of cookies to store user-related information. By default, Cypress removes the cookies before executing the scripts. But sometimes, we may need to clear our cookies in between while executing our test script. 

Cypress has provided the following commands to clear our cookies manually:

  • cy.clearCookie()
  • cy.clearCookies() 
  • cy.clearAllCookies()

We can pass arguments and clear cookies based on our needs. Each of the three commands has its purpose. We will look into it with more details below.

Benefits of using the Cypress Clear Cookies Command

For some test scenarios, we may need to log in with multiple users in the same domain for a Cypress test case which might need to clear our cookies to achieve it.

  • Using clear cookies commands provided by Cypress, we can log in with multiple user accounts as required by the test case. 
  • Also, it improves our browser performance, gives better control over cookie data, and increases web apps’ security.  

Let’s see how Cypress clears cookies between tests from our script.

Types of Cypress Clear Cookies Commands

Cypress automation makes it very simple and easy to clear cookies with the below three commands:

1. For clearing one particular cookie

cy.clearCookie(name,options)

2. For clearing multiple cookies with specific domain

cy.clearCookies(options)

3. For clearing all cookies across different domain

cy.clearAllCookies(options)

Using Cypress Clear Cookies Command

Clear Cookie commandArgumentsDescriptionExample
clearCookiename, options
  1. This is the name of the cookie which has the specific value
  2. Options can have below values in the form of object
  • domain – name of the domain for which you need to clear cookies
  • log – A boolean value to make the clear cookie command display in cypress execution window
  • Timeout – Waiting time for cypress runner
cy.clearCookie(“_gat

_browserstack”)

Above command clears the cookie named _gat_browserstack

clearCookiesoptionsOptions can have below values in the form of object
  • domain – name of the domain for which you need to clear cookies
  • log – A boolean value to make the clear cookie command display in cypress execution window
  • Timeout – Waiting time for cypress runner
cy.clearCookies({dom

ain:’browserstack.co

m’,log:false,timeout:1

5000})

Above command clears all the cookies related to the domain browserstack.com

clearAllCookiesoptionsOptions can have below values in the form of object
  • log – A boolean value to make the clear cookie command display in cypress execution window
  • Timeout – Waiting time for cypress runner
cy.clearAllCookies({lo

g:true,timeout:15000})

Above command clears all the cookies across all the domain

Let’s get our hands dirty by executing the clear cookies command

1. Clearing a single cookie with clearCookie command

We are now going to execute a script which could clear a single cookie

describe('template spec', () => {
it('passes', () => {
//Visiting the browserstack website
cy.visit('https://browserstack.com')
//Getting the list of cookies which are stored
cy.getCookies()
//Clearing the cookie named “_get_browserstack”
cy.clearCookie("_gat_browserstack")
//Viewing the cookies back whether the required cookie got deleted
cy.getCookies()
})
})

Note: It is mandatory for cy.clearCookie function to pass the argument as the name of the cookie. Without specifying the name of the cookie, the command will fail. Always use clearCookie to clear any specific cookie.

2. Clearing Multiple Cookies for a Specific Domain

Similarly, now let’s clear all the cookies with a specific domain using clearCookies command

describe('template spec', () => {
it('passes', () => {
//Visiting browserstack website
cy.visit('https://browserstack.com')
//Getting the list of cookies which on stored in browser
cy.getCookies()
//Clearing the cookies with specific domain
cy.clearCookies({domain:'browserstack.com',log:true,timeout:15000})
//Getting all the cookies list currently available
cy.getCookies()
})
})

Note: It is not mandatory to pass options as arguments. Suppose we want to clear all the cookies limiting to any specific domain. In that case, we can simply use cy.clearCookies() command without specifying any arguments that clear all cookies for the current domain.

3. Clearing Multiple Cookies for all the Domains

We are now going to clear all the cookies which got stored in cypress with clearAllCookies command,

describe('template spec', () => {
it('passes', () => {
//Visiting browserstack website
cy.visit('https://browserstack.com')
//Getting the list of cookies which on stored in browser
cy.getCookies()
//Clearing all the cookies
cy.clearAllCookies()
//Getting all the cookies list currently available
cy.getCookies()
})
})

Viewing more details from the Cypress runner

  • When you execute the above piece of code, you will see the execution steps in Cypress runner. 
  • Try to inspect clearCookie and getCookies command.

cypress inspect element

You can view the browser console log for the cookies which got stored and cookies that are cleared while executing the clear cookie command.

cleared cookies list

Conclusion:

With that, you might be able to understand how to clear a cookie/cookies in Cypress and where to use clearCookie, clearCookies, and clearAllCookies commands. Also, the arguments which we need to pass for all the commands to use effectively. 

Cypress is an emerging testing framework and can test it across multiple devices. Browserstack provides you with a robust infrastructure to test on multiple devices with Cypress for 

Run Cypress Tests at Scale

Tags
Automation Testing Cypress

Featured Articles

Cypress Unit Testing Tutorial

What is Cypress Test Suite?

App & Browser Testing Made Easy

Seamlessly test across 20,000+ real devices with BrowserStack