page-objects-vs-gui-custom-commands icon indicating copy to clipboard operation
page-objects-vs-gui-custom-commands copied to clipboard

Project to demonstrate Page Objects and GUI custom commands with Cypress.io

Page Objects vs GUI Custom Commands

This is a sample project to demonstrate the differences between writing end-to-end tests using the Page Objects pattern, using Cypress custom commands, or none of them at all.

The application under test is Mattermost Preview Mode, and it can be found on Docker Hub.

Installation

Here you will find instructions for installing the dev dependencies, besides the installation of the application under test (dev environment).

Dev Dependencies

Run npm install to install the dev dependencies.

You will need Node.js and NPM installed for it.

Dev environment

For installation instructions of Mattermost, read their official documentation.

Running the tests

Here you will find instructions for running the tests in both headless and interactive modes.

Headless Mode

With the Mattermost application up-and-running, run npm test to run the tests in headless mode.

Interactive Mode

With the Mattermost application up-and-running, run npm run cy:open to open the Cypress Runner, then click the > Run 1 integration spec button to run the tests in interactive mode.

Implementation

Here you will find the implementation of:

  • The tests
  • The Page Object
  • And the GUI custom command

Made with 💚 by Walmyr.