Cypress as of today (v 9.2.1) doesn’t provide any support for tagging tests. But fortunately due to the large open-source community that cypress has we have a few ways using which we can achieve tag tests. Let’s further deep dive into this:
 

Method 1: Using cypress-select-tests (This is DEPRECATED)

Step 1: Install the cypress-select-tests plugin using the command:

1
npm install --save-dev cypress-select-tests

cypress select tests package json
 

Step 2: Under cypress/plugins/index.js write:

1
2
3
4
const selectTestsWithGrep = require('cypress-select-tests/grep')
module.exports = (on, config) => {
  on('file:preprocessor', selectTestsWithGrep(config))
}

cypress select tests plugins index js
 

Step 3: The next step is to Tag our Tests. I will be using two types of tags for this article: ‘Smoke’ and ‘E2E’. I would be filtering the tests on the basis of the Test Title, but this plugin provides other ways to filter as well:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
 ## run tests with "works" in their full titles
 $ npx cypress open --env grep=works

 ## runs only specs with "foo" in their filename
 $ npx cypress run --env fgrep=foo

 ## runs only tests with "works" from specs with "foo"
 $ npx cypress run --env fgrep=foo,grep=works

 ## runs tests with "feature A" in the title
 $ npx cypress run --env grep='feature A'

 ## runs only specs NOT with "foo" in their filename
 $ npx cypress run --env fgrep=foo,invert=true

 ## runs tests NOT with "feature A" in the title
 $ npx cypress run --env grep='feature A',invert=true

 
In TC01.spec.js I am adding the keyword ‘Smoke’ to the title of the test:
cypress test smoke tag
 
In TC02_fixtures.spec.js I am adding the keyword ‘E2E’ to the title of the test:

 
In TC03_writeReadFile.spec.js I am adding both keywords ‘E2E’ and ‘Smoke’ to the title of the test:
cypress test smoke end to end tag
 

Now, If we want to execute only tests with the ‘Smoke’ tag we will use the command:

1
npx cypress run --env grep="Smoke"

After Execution, you could see that Tests 1 and 3 that have the Keyword ‘Smoke’ in their title are executed, and the rest all are in pending (skipped/Not Executed) state.

cypress smoke tag test execution

Similarly, If we want to execute only tests with the ‘E2E’ tag we will use the command:

1
npx cypress run --env grep="E2E"

After Execution, you could see that Tests 2 and 3 that have the Keyword ‘E2E’ in their title are executed, and the rest all are in pending (skipped/Not Executed) state.

cypress end to end tag test execution

Now it seems a bit confusing that the tests that are not executed are marked under ‘Pending’. As it turns out, this is a known behavior of Mocha Test reporter and you can learn more about it from this Github Thread.
 

Method 2: Using a Custom Function

There is one more way you can apply tags to your tests as suggested by Marie Drake in her blog and in my opinion, this is a much robust way of doing it.

Step 1: Create a file called filterTests.js under the support folder and add:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
const TestFilters = (givenTags, runTest) => {
    if (Cypress.env('tags')) {
      const tags = Cypress.env('tags').split(',')
      const isFound = givenTags.some((givenTag) => tags.includes(givenTag))
 
      if (isFound) {
        runTest()
      }
    } else {
      runTest()
    }
  };
 
  export default TestFilters

cypress tags filter tests js file

What this does, in a nutshell, is it filters the tests based on tags that we provide from the CLI. It searches for the tags in the js files where we have added the TestFilters function.

Step 2: For this to work you have to import the filterTests in all test files and add the TestFilters function.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import TestFilters from '../support/filterTests.js'

TestFilters(['smoke', 'regression'], () => {
  describe('Some Test Suite', () => {

    it('Some Test Case', () => {
      /..../
    })

    it('Some Test Case 2', () => {
      /..../
    })

  })
})

Now, if you don’t want to add any tags in that case just add an empty array:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
import TestFilters from '../support/filterTests.js'

TestFilters([], () => {
  describe('Some Test Suite', () => {

    it('Some Test Case', () => {
      /..../
    })

    it('Some Test Case 2', () => {
      /..../
    })

  })
})

 
For our case, we have added the tags – smoke, regression for the following test suites. And for the rest, we have passed an empty array.

test suite with cypress tags tc05
 
test suite with cypress tags tc08
 
test suite with cypress tags tc19
 
Step 3:

1. To execute tests with only one tag(regression) we will use the command:

1
Cypress_tags=regression npx cypress run

As per our implementation only test suites, 5 and 8 should be executed and the rest of them shouldn’t be.

cypress test execution report with one tag
 
2. To execute tests with two tags(regression, smoke) we will use the command:

1
Cypress_tags=regression,smoke npx cypress run

As per our implementation only test suites, 5,8, and 19 should be executed and the rest of them shouldn’t be.

cypress test execution report with two tags
 
3. To execute all tests irrespective of any tags we will use the command:

1
npx cypress run

cypress test execution for all tests
 

Method 3: Using cypress-grep

Step 1: Install the cypress-grep plugin using the command:

1
npm i -D cypress-grep

 
Step 2: Under cypress/plugins/index.js write:

1
2
3
4
module.exports = (on, config) => {
  require('cypress-grep/src/plugin')(config)
  return config
}

 
Step 3: Under cypress/support/index.js write:

1
require('cypress-grep')()

 
Step 4: Now, we can directly run the tests by grepping texts from the title. Let’s execute the test with the text “username and password in URL” in the title.

execute test using test title

So we will use the command:

1
npx cypress run --env grep="username and password in URL"

Since the text that we are grepping is unique to one test, so only that test will execute and all other tests will be marked as ‘Pending’. You can read more about why the tests that are not executed are marked as pending from the cypress docs.

Test execution by grepping test title using cypress grep
 
Step 5: We can also add tags to test suite or test case level and add tags and then execute the test cases. Let’s add the tags ‘smoke’ and ‘regression’ to test cases and test suites and execute them based on the added tags.

TC_25_filterFindWithin.spec.js Added ‘regression’ tag in one of the test cases
test case with regression tag
 
TC_26_jqueryCommands.spec.js Added ‘smoke’ tag in one of the test cases
test case with smoke tag
 
TC_27_cypressRecursion.spec.js Added ‘smoke’ tag in the test suite
test suite with smoke tag
 
Now if we want to run the tests with ‘regression’ tag, we will use the command:

1
npx cypress run --env grepTags="regression"

test execution with regression tag

As we can see above only the test having the ‘regression’ tag from TC_25_filterFindWithin.spec.js was executed, the rest of the tests were not executed and marked as ‘pending’.

Now, similarly if we want to run the tests with ‘smoke’ tag, we will use the command:

1
npx cypress run --env grepTags="smoke"

And, if we want to execute both ‘smoke’ and ‘regression’ tags together we will use the command:

1
npx cypress run --env grepTags="smoke regression"

test execution with smoke and regression tags

As we can see above only test suites TC 25,26 and 27 were executed rest all were marked as pending.

Similarly, there are other ways also you can play around with tags and execute the test cases. I would recommend you to go through the readme page for the cypress-grep plugin.

Do check out 🙂

Github: https://github.com/alapanme/Cypress-Automation
All Cypress Articles: https://testersdock.com/cypress-tutorial/