🌲 Cypress E2E Testing

End-to-End Testing

What is Cypress?

Cypress is an end-to-end testing framework that runs tests in a real browser. It provides excellent developer experience with time-travel debugging and automatic waiting.

💻 E2E Test

// cypress/e2e/login.cy.js
describe('Login Flow', () => {
  it('successfully logs in', () => {
    cy.visit('http://localhost:3000');
    
    cy.get('input[name="email"]').type('user@example.com');
    cy.get('input[name="password"]').type('password123');
    cy.get('button[type="submit"]').click();
    
    cy.url().should('include', '/dashboard');
    cy.contains('Welcome back!').should('be.visible');
  });
  
  it('shows error for invalid credentials', () => {
    cy.visit('http://localhost:3000');
    
    cy.get('input[name="email"]').type('wrong@example.com');
    cy.get('input[name="password"]').type('wrong');
    cy.get('button[type="submit"]').click();
    
    cy.contains('Invalid credentials').should('be.visible');
  });
});

🎯 Key Takeaways