How to store session through all test using Cypress

Question

Im currently trying to learn Cypress 10 and I came to an issue where I see that every it I do, it clears the cookies which is not what I want and here is my code...

Suite('My First Test', () => {
  before(() => {
    prepare();

    cy.visit('https://barrythrill.com');

    cy.get('.start-from-zero').should('be.visible').click();

    ...
  });

  Scenario('My first test cases', () => {
    Given('we are on the webpage');

    When('we save the list', () => {
          // no cy.visit
      ... // we save the list it will automatically login and it creates a cookie called BAR (has a dynamic cookie)
    });

    Then('we are able to open all-list and close it', () => {
      ... // no cy.visit
    });

    When('we remove the list through API', () => {
      ... // no cy.visit
    });
    Then('we should still be logged it', () => {
        ... // cy.visit(''https://barrythrill.com')
            // We should still be logged in through ` When('we save the list', ()`
    });
  });
});

I was not able to figure out how I can use cy.session here or to create a correct tests for my test cases. I wonder if anyone here can help me on either how I can improve my code where I can still be logged in through whole test or how I can implement cy.session without needing to call cy.visit for each it?

Answer 1

I presume prepare() is getting your cookies?

I think what you need to do is add a beforeEach() with cy.session() and call prepare() inside it.

beforeEach(() => {
  cy.session('prepare', () => {
    prepare();
  })
})

The session is invoked for every it(), but only the first time calls prepare() - after that it sets cookies from cache.

You probably still need the before() as-is to allow cy.visit() to work.

Here I'm starting at the top of Cypress recipe page, and test1 ends up at the Blogs section which is where test2 starts off.

---

Preserving location between tests

Not sure this works with cucumber, or if any visit at all mucks up your test flow.

Cypress recommends performing cy.visit() straight after cy.session() as in the following sample.

You can preserve the last location after each test with a afterEach(). The visit in the next beforeEach() call will use that location.

Cypress.session.clearAllSavedSessions()

let location = 'https://docs.cypress.io/examples/examples/recipes'

beforeEach(() => {
  cy.session('cookies', () => {
    cy.setCookie('test', 'my-cookie')
  })
  cy.visit(location)
})

afterEach(() => {
  location = cy.state('window').location.href
})

it('test1', () => {
  expect(cy.state('window').location.href)
    .to.eq('https://docs.cypress.io/examples/examples/recipes')

  cy.getCookie('test').then(cookie => {
    expect(cookie.value).to.eq('my-cookie')
  })

  // navigate elsewhere
  cy.visit('https://docs.cypress.io/examples/examples/recipes#Blogs')
});

it('test2', () => {
  expect(cy.state('window').location.href)
    .to.eq('https://docs.cypress.io/examples/examples/recipes#Blogs')

  cy.getCookie('test').then(cookie => {
    expect(cookie.value).to.eq('my-cookie')
  })
});