CODEWITHSUNDEEP
cypresssession-storage
Citronex
Citronex

Reputation: 1129

Is there a way to keep session Storage between tests in Cypress

I'm currently working in an app that keeps info in Session Storage. After the login process, I see the Session Storage being cleared and the DOM being refreshed back to the login screen. I'd like to persist the Session Storage between tests per spec so I don't have to continuously logout and log back in to check multiple things in the same container.

My current setup looks like this:

describe('Quickpanel', () => {
    before(() => {
    
        cy.visit(base_url, {onBeforeLoad: (window) => {
            window.sessionStorage.setItem('someInfo',
            `{"SubsId":${info[0]},"RId":${nfo[1]}}`)
           window.sessionStorage.setItem('loc', `${info[2]}`)
        }})

        LoginPage
            .login(login_username, login_password)

        Navbar
            .clickOnBookingsSubLink('Beta Calendar')
            .verifyCalendarLoads()
            .clickBookReservationButton()
            .verifyQuickPanelIsOpen()

    })

First test runs fine and the right session storage values are set and others created using the provided info. When I move to the second "It()" is when the session storage goes away. I've also tried setting the Session Storage items in "beforeEach()" but the same issue occurs.

Any help is appreciated, thank you :)

Upvotes: 9

Views: 18848

Answers (2)

Alapan Das
Alapan Das

Reputation: 18650

You can use the cy.session() Cypress docs to achieve this. This is an experimental API. So to use it set the flag for experimentalSessionSupport to true in your cypress.json.

Upvotes: 1

Paolo
Paolo

Reputation: 5441

The cy.session() command is a cache - anything inside does not get called multiple times.

You need to call it beforeEach() test not just once before() but the setup function is only called once.

Here is a proof-of-concept

Cypress.config('experimentalSessionSupport', true)

let sessionCallCount = 0;

Cypress.session.clearAllSavedSessions()   // to avoid caching across browser reload

beforeEach(() => {                   
  cy.session('mySession', () => {     
    cy.visit('https://example.com', {
      onBeforeLoad: (window) => {
        window.sessionStorage.setItem('myKey', 'someInfo')
        sessionCallCount++
      }
    })
  })
})

it('t1', () => {
  cy.window().then(window => {
    let data = window.sessionStorage.getItem('myKey')
    expect(data).to.eq('someInfo')
    expect(sessionCallCount).to.eq(1)
  })
})

it('t2', () => {
  cy.window().then(window => {
    let data = window.sessionStorage.getItem('myKey')
    expect(data).to.eq('someInfo')          
    expect(sessionCallCount).to.eq(1)        // cached code is called only once
  })
})

Login example

Cypress.config('experimentalSessionSupport', true)

Cypress.session.clearAllSavedSessions()   // to avoid caching across browser reload

beforeEach(() => {                   
  cy.session('mySession', () => {     
    cy.visit('https://example.com', {
      onBeforeLoad: (window) => {
        cy.login(userName, password)  // sets a cookie
      }
    })
  })
})

it('t1', () => {
  cy.visit('https://example.com')  // uses cookie  set by cy.login call
})

it('t2', () => {
  cy.visit('https://example.com')  // uses cookie preserved by cy.session cache
                                   // so app sees logged-in state
                                   // and does not redirect to login page
})

Upvotes: 13

Related Questions