I am building a web application using React JS. I am writing integration tests for my application using Cypress. Now I am writing a test to assert the value in the localStorage. But the localStorage value is always returning null even though the application actually stores the expected value in the localStorage.
Here is my code:
describe('Login', () => {
it ('redirects to dashboard page when login is successful', () => {
const accessToken = "fake access token"
cy.intercept('POST', '**/user/login', {
"accessToken": accessToken,
"token":{
"id":"c09dd33fbdcbf780ddb4d784002f1b4c8413cc298f2465f5f3e3c3481b2aa7f586d14f04af163a1c",
"user_id":31,
"client_id":1,
"name":"User Access Token",
"scopes":[],
"revoked":false,
"created_at":"2022-05-24 20:39:48",
"updated_at":"2022-05-24 20:39:48",
"expires_at":"2025-05-24T20:39:48.000000Z"
}})
cy.intercept('GET', '**/user/me', {
"data":{
"roles":[
{
"id":4,
"identifier":5,
"title":"Super Admin",
"created_at":null
}],
"user":{
"id":31,
"name":"Super Admin",
"email":"superadmin@gmail.com",
"created_at":"2022-05-24T13:14:53.000000Z",
"roles":[
{
"id":4,
"identifier":5,
"title":"Super Admin",
"created_at":null
}],
"internal_admin_access_disabled":false
},
"restaurant_staff":null
}
});
cy.get('input[cy-data-id="email"]').type('test-email@gmail.com')
cy.get('input[cy-data-id="password"]').type('password');
cy.get('button[cy-data-id="btn-login"]').click();
cy.location('pathname').should('eq', '/dashboard');
// eslint-disable-next-line jest/valid-expect
expect(localStorage.getItem('access_token')).to.eq(accessToken);
})
})
The localStorage.getItem('access_token') is always returning null in the test. What is wrong with my code, and how can I test it?