Understanding the Cypress directory structure
The following is an example of the structure of the cypress
directory:
- config: Stores the files to customize the configuration of Cypress in
various environments.
- constants: Contains the constants that are being used in Cypress tests.
Here, the subdirectory selectors include selectors for all components to be
interacted with. Subdirectory texts contain the messages and constant texts
used in the application.
- fixtures: Fixtures are used to store test data which can then be used
throughout the tests. Usually, the data is stored in JSON format.
- e2e: e2e folder includes all the test files. The test files are written
with a .spec.js extension and the test file name format is testName.spec.js.
- support: This folder contains e2e.js and commands.js files. The
e2e.js file is run before every single spec file. The support folder is a
great place to put reusable behavior such as custom commands and utility functions.
- plugins: This folder includes the index.js file. This file will be
automatically imported every time before the execution of every spec(test)
file. Plugins enable us to tap into, modify, or extend the internal behavior
of Cypress.
Running Cypress tests on a neeto project
After setting up the project, run the application. Move into the cypress-tests
directory in the root of our project directory. Then run yarn install
to
install the required dependencies.
Now, start Cypress from the command line using the following command.
We can see the Cypress window opening up. On the left side of the window, we can
see the spec files created in the e2e folder. Click on any of the listed specs.
This will open up our default browser and start running the tests.