Token-based authentication in Cypress - Test Execution Trace

Test Overview

This test logs in using a token-based authentication and verifies that the user dashboard loads successfully.

Test Code - Cypress

Cypress

describe('Token-based authentication test', () => {
  it('logs in with token and verifies dashboard', () => {
    // Set token in local storage
    cy.visit('/');
    cy.window().then(win => {
      win.localStorage.setItem('authToken', 'fake-jwt-token-123');
    });
    // Reload to apply token
    cy.reload();
    // Navigate to dashboard
    cy.visit('/dashboard');
    // Check if dashboard heading is visible
    cy.get('h1').should('contain.text', 'User Dashboard');
  });
});

Execution Trace - 5 Steps

Step	Action	System State	Assertion	Result
1	Visit the home page	Browser opens at '/' with empty local storage	-	PASS
2	Set 'authToken' in local storage with a fake JWT token	Local storage now contains 'authToken' with value 'fake-jwt-token-123'	-	PASS
3	Reload the page to apply the token	Page reloads, token is present in local storage	-	PASS
4	Navigate to '/dashboard' page	Browser navigates to '/dashboard' page	-	PASS
5	Find the heading element and check its text contains 'User Dashboard'	Dashboard page is loaded with heading visible	Verify heading text contains 'User Dashboard'	PASS

Failure Scenario

Failing Condition: The token is missing or invalid, so the dashboard page does not load correctly.

Execution Trace Quiz - 3 Questions

What is the purpose of setting 'authToken' in local storage in this test?

A To clear the browser cache before testing

B To store user preferences for the dashboard

C To simulate a logged-in user by providing the authentication token

D To test if local storage is writable

Key Result

Setting the authentication token directly in local storage is a fast way to simulate a logged-in user in tests without going through the login UI.