'Cypress - How can I run test files in order

When I press the "run all specs" button or use the run command that runs all files in Cypress it runs all test files alphabetically, so I don't want that.

I want to sort all of them with my own rules.


Let's say I have 3 steps in a chat app test.

  1. Can connect the chat app
  2. Can connect the chat
  3. Can the user send a message

I want to test every step without being tied to each other. What I mean, Testing one of their own function. What I do is as follows

chat_app_connect.spec.js

describe('Server Connecting Test', () => {
    it('Visit Server page', () => {
        cy.visit('https://chat.page..');
    });

    it('Check welcome messages', () => {
        cy.contains('Live Support');
        cy.contains('Hello, Stranger');
    });

    it('Check URL and status of circle', () => {
        // URL
        cy.url()
            .should('include', '/hello');
        // Status Circle    
        cy.get('circle')
            .should('have.class', 'positive');
    });
});

chat_connect.spec.js

import './chat_app_connect.spec.js';

describe('Chat Connecting Test', () => {
    it('Type customer name', () => {
        cy.get('input')
            .clear()
            .type('E2E Test');
    });
    it('Click to the submit button', () => {
        cy.get('.submit-button')
            .click();
    });
    it('Check URL and status of circle', () => {
        // URL
        cy.url()
            .should('equal', 'https://client.dev.octopus.chat/');
        // Status Circle
        cy.get('circle', { timeout: 5000 })
            .should('have.class', 'positive');
    });
});

chatting.spec.js

import './chat_connect.spec.js';

describe('Chatting Tests', () => {
    it('Type a test message then press Enter and check the message if it sent', () => {
        // Type
        cy.get('#chat-message')
            .clear()
            .type('Hey I\'m a test message{enter}');
        // Check the message
        cy.get('.message-list')
            .should('contain', 'Hey I\'m a test message');
    });
});

as you see every test is tied to each other, and that is mean when I tried to test just catting functionality its call every test and the whole tests will be tested.

I don't know if it is the right way or not.

what should I do in this case or can it be an acceptable way



Solution 1:[1]

The easiest solution is most likely to add a prefix to all your test files, such as:

  • 01-chat_app_connect.spec.js
  • 02-chat_connect.spec.js

etc.

Cypress is going to take those files in alphabetical order, which you can "trick" into your wanted behavior by using a number as a prefix.

Solution 2:[2]

Jean Lescure's answer was a lifesaver. We needed to run tests based on priority without having a bunch of duplicated tests or symlinks. The following worked for us in our default cypress config file:

  "integrationFolder":"cypress/integration",
  "testFiles": [
    "high_priority_specs/**/*.js",
    "medium_priority_specs/**/*.js",
    "low_priority_specs/**/*.js"
  ]

To change the level of priority we used 3 configs files that were loaded using the cypress --configFile argument. To run the higher priority tests (smoke tests only) we used the following:

  "integrationFolder":"cypress/integration",
  "testFiles": [
    "high_priority_specs/**/*.js"
  ]

Solution 3:[3]

Cypress does not intentionally let you do this, and for good reasons:

  1. It's generally indicative of poor test design. Tests should not depend on the state of one another. Any test should be able to be run successfully in isolation from the rest of the test suite.
  2. You'll never be able to take advantage of cypress' built in ability to run tests in parallel since you can't guarantee one spec will be ran after another

Here is a relevant discussion about this that gets into more detail: https://github.com/cypress-io/cypress/issues/390

However, if you decide to do this anyway, you can do it by prefixing the name of the specs with a number:

01-some-spec.js
02-alphabetically-first-spec.js
03-some-other-spec.js

Solution 4:[4]

In addition to @Brendan answer, if you have a nested folder structure, this approach will work as well.

01-folder-name
 |
  - 01-some-spec.js

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source
Solution 1 alcfeoh
Solution 2 Peter Drinnan
Solution 3
Solution 4 Vlad R