GitHub Actions integration in Cypress - Build an Automation Script

Run Cypress tests automatically using GitHub Actions

Preconditions (2)

Step 1: Create a .github/workflows directory in the repository root

Step 2: Add a workflow YAML file named cypress-tests.yml inside .github/workflows

Step 3: Configure the workflow to trigger on push and pull request events

Step 4: Set up the job to run on the latest Ubuntu runner

Step 5: Install Node.js using actions/setup-node

Step 6: Install project dependencies using npm install

Step 7: Run Cypress tests using npx cypress run

Step 8: Verify the workflow completes successfully in GitHub Actions

✅ Expected Result: GitHub Actions workflow runs Cypress tests automatically on each push or pull request and reports success or failure in the Actions tab

Automation Requirements - cypress

Assertions Needed:

Verify the GitHub Actions workflow file exists and is valid YAML

Verify the workflow triggers on push and pull request

Verify the Cypress tests run and pass in the workflow logs

Best Practices:

Use explicit steps for setup, install, and test

Use official GitHub Actions like actions/setup-node

Keep workflow YAML clean and readable

Use caching for node_modules if possible to speed up runs

Automated Solution

Cypress

name: Cypress Tests

on:
  push:
    branches:
      - main
  pull_request:
    branches:
      - main

jobs:
  cypress-run:
    runs-on: ubuntu-latest

    steps:
      - name: Checkout repository
        uses: actions/checkout@v3

      - name: Setup Node.js
        uses: actions/setup-node@v3
        with:
          node-version: '18'

      - name: Install dependencies
        run: npm install

      - name: Run Cypress tests
        run: npx cypress run

This GitHub Actions workflow is named Cypress Tests. It triggers on push and pull_request events targeting the main branch.

The job cypress-run runs on the latest Ubuntu runner.

Steps include:

• Checkout repository: Uses actions/checkout@v3 to get the code.
• Setup Node.js: Uses actions/setup-node@v3 to install Node.js version 18.
• Install dependencies: Runs npm install to install project packages.
• Run Cypress tests: Runs npx cypress run to execute tests.

This setup ensures tests run automatically on GitHub servers whenever code changes are pushed or pull requests are created, providing quick feedback on test results.

Common Mistakes - 4 Pitfalls

{'mistake': 'Not specifying the Node.js version in setup-node action', 'why_bad': 'Without specifying the version, the workflow may use an unexpected Node.js version causing test failures.', 'correct_approach': "Always specify a stable Node.js version like '18' in the setup-node action."}

{'mistake': 'Running Cypress tests without installing dependencies first', 'why_bad': 'Tests will fail because Cypress and other packages are not installed.', 'correct_approach': "Run 'npm install' before running Cypress tests."}

{'mistake': 'Not triggering workflow on pull requests', 'why_bad': "Tests won't run on pull requests, missing early feedback on code changes.", 'correct_approach': 'Configure workflow triggers for both push and pull_request events.'}

{'mistake': 'Hardcoding branch names without considering main branch name', 'why_bad': "If the default branch is named differently, workflow won't trigger.", 'correct_approach': 'Use the correct default branch name or configure triggers accordingly.'}

Bonus Challenge

Now add caching for node_modules to speed up workflow runs

Show Hint