Giter VIP home page Giter VIP logo

cypress-drupal's Introduction

E2E Testing with Cypress and Drupal

Setup

  1. For quick installation of a drupal 10 site and lando, please use lando start
  2. Setup the project with standard install profile and also configure JSON:API Module module to handle all the basic operations('GET', 'POST', 'DELETE' etc) to be performed.
  3. The example cypress scripts use a recipe, article content types. Once the lando start runs and provisions everything you need. Run the default D10 install via a browser (db connection through 'database' host with 'drupal10' for user, database, password) then import the db from the data/data.sql.gz file using lando db-import data/data.sql.gz to overwrite the default install. This DB has the preconfigured CT's taxonomies for the testing scripts.
  4. Please be mindful you may need to alias the OS browser you are using for chromium etc. See below for the linux option.

Notes

    • Setup Cypress in your /testing directory and we implemented Page Object Design Pattern as below:
      • All test framework details under in /testing/cypress directory
      • Test files(cypress/integration): create_article_via_json_api.spec.spec.js; create_article_via_ui.spec;login.spec.js
      • Page specific files(cypress/page-objects): create_article.js, login.js
      • Test data(cypress/fixtures): article_testdata.js, login_testdata.js
      • Supported/Common re-usable functions(cypress/support): commands.js, index.js
      • Plugin/Add-on components(cypress/plugins): index.js
      • Config file: cypress.json
      • Screenshots(cypress/screenshots): cypress captures screenshots of all the failure tests while execute in CLI
      • Videos folder(cypress/videos): cypress captures vidoes of all the tests while execute them in CLI
    • Create and Delete various user roles using the drush commands
    • Verify Login through http request calls with cy.request()
    • Create and Verify an article with Taxonomy Term using both UI as well as JSON:API

NPM Scripts for test execution

Clone/import this project in your drupal project and change the "baseUrl" field in cypress.json file as per your site. Next, run below commands from the testing directory under the project root:

  • npm i - install dependencies

  • npm run test:headless - spin up the test execution in headless mode in chrome browser

  • npm run test:head - spin up the test execution in head mode in chrome browser

  • npm run open - opens the cypress test runner and helps to execute the scripts in an interactive mode

    Notes:

    • Cypress automatically detects available browsers on your OS and launch that up, so this may take some seconds to begin the execution at first run.
    • If Chrome browser is not installed in your system, please install it first and proceed this script.
    • Also with the below command, we can launch any supported browser by specifying a path to the binary:cypress run --browser /usr/bin/chromium
    • Please refer this Cypress documentation for more detail

cypress-drupal's People

Contributors

rod-higgins-personal avatar rod-higgins avatar

Watchers

 avatar

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    ๐Ÿ–– Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. ๐Ÿ“Š๐Ÿ“ˆ๐ŸŽ‰

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google โค๏ธ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.