Local storage management in Cypress - Test Execution Trace

Test Overview

This test checks if a web page correctly saves and retrieves data from the browser's local storage. It verifies that the stored value matches the expected value after setting it.

Test Code - Cypress

Cypress

describe('Local Storage Management Test', () => {
  it('should save and retrieve data from local storage', () => {
    cy.visit('https://example.cypress.io/commands/local-storage')
    cy.window().then((win) => {
      win.localStorage.setItem('myKey', 'myValue')
    })
    cy.window().its('localStorage').invoke('getItem', 'myKey').should('equal', 'myValue')
  })
})

Execution Trace - 4 Steps

Step	Action	System State	Assertion	Result
1	Test starts	Test runner initialized, no browser opened yet	-	PASS
2	Browser opens and navigates to 'https://example.cypress.io/commands/local-storage'	Page loads with local storage commands example	-	PASS
3	Access browser window object and set localStorage item 'myKey' to 'myValue'	Local storage now contains key 'myKey' with value 'myValue'	-	PASS
4	Retrieve localStorage item 'myKey' and assert it equals 'myValue'	Local storage item 'myKey' is 'myValue'	Assert localStorage.getItem('myKey') === 'myValue'	PASS

Failure Scenario

Failing Condition: Local storage key 'myKey' is missing or has a different value than 'myValue'

Execution Trace Quiz - 3 Questions

What does the test verify about local storage?

A That local storage is empty

B That local storage is cleared after page load

C That a specific key stores the expected value

D That local storage contains multiple keys

Key Result

Always verify local storage values explicitly after setting them to ensure your application stores data correctly.