Integrating Cypress into Your Drupal Workflow

npm install cypress --save-dev

{
  "devDependencies": {
    "cypress": "^14.2.0"
  }
}

npx cypress open

It looks like this is your first time using Cypress: 14.2.0

✔ Verified Cypress! /Users/username/Library/Caches/Cypress/14.2.0/Cypress.app

Opening Cypress..

cypress.config.js
cypress
├── fixtures
│   └── example.json
└── support
    ├── commands.js
    └── e2e.js

const { defineConfig } = require('cypress')
module.exports = defineConfig({
  cookieDomain: 'test',
  fixturesFolder: false,
  video: false,
  pageLoadTimeout: 10000,
  e2e: {
    setupNodeEvents(on, config) {},
    baseUrl: 'http://my-website.test',
  },
  viewportWidth: 1600,
})

cypress
├── e2e
│   └── home.cy.js

describe('Homepage behavior', () => {
  it('should display the project title', () => {
    cy.visit('/');
    cy.get('h1').should('have.text', 'My Project');
  });
});

npx cypress open --config baseUrl="http://localhost:8888"

npx cypress run --config baseUrl="http://localhost:8888"

- name: Upload Cypress Screenshot to Artifact
  uses: actions/upload-artifact@v4
  if: failure()
  with:
    name: cypress-screenshots
    path: |
      cypress/screenshots

- name: Print Watchdog errors to log/watchdog.csv
  if: failure()
  run: drush watchdog:show --count=100 --severity-min=3 --fields=wid,date,type,severity,message,location --extended --format=csv > log/watchdog.csv
- name: Upload Watchdog logs to Artifact
  uses: actions/upload-artifact@v4
  if: failure()
  with:
    name: watchdog-logs
    path: |
      log/watchdog.csv