volodymyrlykhachov / cypress-grep-example

Example application with grep tags inside the test names

cypress-grep-example

Example application with grep tags inside the test names

The demo example for the cypress-grep plugin.

Watch the video intro to cypress-grep which shows how this repository tags tests, uses cypress-grep plugin, and sets up the TypeScript intelligent code completion.

You can also watch How I organize pull request workflows where I show how the GitHub workflows in .github/workflows are organized to run the smoke tests first on pull request.

Install and start the app

Before filtering by test title and tag, we need to install dependencies and start the application

$ npm install
$ npm start

Running tests by title

We can pick some tests to run using part of their title.

$ npx cypress run --env grep="the current number of todo items"

Runs just a single test found in cypress/integration/counter-spec.js. The rest of the tests are still loaded, but are marked pending. To really target specific tests, add --spec ... argument

$ npx cypress run --env grep="the current number of todo items" \
  --spec cypress/integration/counter-spec.js

Running tests by tag

Some tests in this repo in the cypress/integration folder have the tag @smoke in their config object. The symbol @ has no meaning, I just like to use this prefix to make tags searchable.

// cypress/integration/routing-spec.js
describe('TodoMVC - React', function () {
  context('Routing', function () {
    // other tests

    it('should allow me to display all items', { tags: '@smoke' }, function () {
      ...
    })

    // if you have more than one tag, use an array
    it('should respect the back button', { tags: ['@smoke'] }, function () {
      ...
    })
  })
})

To run just the tests with substring @smoke you can do:

$ npx cypress run --env grepTag=@smoke
cypress-grep: filtering using tag "@smoke"

See the .github/workflows/main.yml that first runs the smoke tests and then all the tests during the CI run. You can see the runs in the repo's Actions tab.

Repeat and burn tests

You can run the selected tests multiple times by using the burn=N parameter. For example, run all all the tests in the spec A five times using:

$ npx cypress run --env burn=5 --spec cypress/integration/A.js
# run the smoke tests 3 times
$ npx cypress run --env grepTag=@smoke,burn=3

Upgrade to Cypress v10

See the pull request #79 that updates this repo to use Cypress v10

Print test names

To see the test names and their tags, run npm run print-tests which uses find-cypress-specs.