Using fixtures in tests in Cypress - Framework Patterns

Framework Mode - Using fixtures in tests

Folder Structure

  cypress/
  ├── e2e/                  # Test specs
  │   └── login.cy.js       # Example test using fixtures
  ├── fixtures/             # Test data files (JSON, CSV, etc.)
  │   └── user.json         # User data fixture
  ├── support/              # Custom commands and utilities
  │   ├── commands.js       # Custom Cypress commands
  │   └── e2e.js            # Support file loaded before tests
  cypress.config.js         # Cypress configuration file
  

Test Framework Layers

• Fixtures Layer: Contains static test data files in cypress/fixtures/. These files provide reusable data for tests.
• Test Specs Layer: Test files in cypress/e2e/ that load fixture data and perform test actions and assertions.
• Support Layer: Custom commands and utilities in cypress/support/ to keep tests clean and reusable.
• Configuration Layer: cypress.config.js manages environment settings, base URLs, and test options.

Configuration Patterns

Use cypress.config.js to define base URLs and environment variables.

  // cypress.config.js
  import { defineConfig } from 'cypress'

  export default defineConfig({
    e2e: {
      baseUrl: 'https://example.com',
      env: {
        username: 'testuser',
        password: 'password123'
      },
      supportFile: 'cypress/support/e2e.js'
    }
  })
  

Fixtures are loaded in tests using cy.fixture('filename').then(data => {...}) or with beforeEach hooks for reusability.

Test Reporting and CI/CD Integration

• Use Cypress built-in reporters or integrate with mochawesome for detailed HTML reports.
• Configure CI pipelines (GitHub Actions, Jenkins, GitLab CI) to run npx cypress run headlessly.
• Store test artifacts like screenshots and videos for failed tests to help debugging.
• Use environment variables in CI to manage credentials securely.

Best Practices

• Keep fixture data simple and realistic: Use JSON files with clear, minimal data to avoid confusion.
• Load fixtures in beforeEach hooks: This ensures fresh data for each test and avoids shared state issues.
• Use descriptive fixture file names: Name files by purpose, e.g., user.json, products.json.
• Separate test data from test logic: This makes tests easier to read and maintain.
• Secure sensitive data: Avoid storing passwords or secrets in fixtures; use environment variables instead.

Self Check

Where would you add a new fixture file for storing product information used in multiple tests?

Key Result

Organize test data in fixtures folder and load them in tests for reusable, clean test automation.