docs: add cypress-gitpod guide (#40925)

This commit is contained in:
Shaun Hamilton
2021-02-10 11:33:38 +00:00
committed by GitHub
parent e195eb1ebe
commit ecde62dda0

View File

@ -6,38 +6,79 @@ To learn how to write Cypress tests, or 'specs', please see Cypress' official [d
> Note: When writing tests for freeCodeCamp, remember to add `/* global cy */` to the top of the file to avoid ESLint issues. > Note: When writing tests for freeCodeCamp, remember to add `/* global cy */` to the top of the file to avoid ESLint issues.
### Where to add a test ## Where to add a test
- Cypress tests are in the `./cypress` directory. - Cypress tests are in the `./cypress` directory.
- Cypress tests for a curriculum module are in the corresponding curriculum directory, i.e. `cypress/integration/learn/responsive-web-design/basic-css/index.js`. - Cypress tests for a curriculum module are in the corresponding curriculum directory, i.e. `cypress/integration/learn/responsive-web-design/basic-css/index.js`.
### How to run tests ## How to run tests
**1. Ensure that MongoDB and client applications are running** > [!NOTE]
> If using GitPod, please see [Cypress-GitPod Setup](/how-to-add-cypress-tests#cypress-gitpod-setup)
- [Start MongoDB and seed the database](/how-to-setup-freecodecamp-locally#step-3-start-mongodb-and-seed-the-database) ### 1. Ensure that MongoDB and client applications are running
- [Start the freeCodeCamp client application and API server](/how-to-setup-freecodecamp-locally#step-4-start-the-freecodecamp-client-application-and-api-server) - [Start MongoDB and seed the database](/how-to-setup-freecodecamp-locally#step-3-start-mongodb-and-seed-the-database)
**2. Run the cypress tests** - [Start the freeCodeCamp client application and API server](/how-to-setup-freecodecamp-locally#step-4-start-the-freecodecamp-client-application-and-api-server)
To run tests against production builds, replace `dev` with `prd` below. ### 2. Run the cypress tests
- To run all tests in the `./cypress` directory: To run tests against production builds, replace `dev` with `prd` below.
- To run all tests in the `./cypress` directory:
```console ```console
npm run cypress:dev:run npm run cypress:dev:run
``` ```
- To run a single test: - To run a single test:
```console ```console
npm run cypress:dev:run -- --spec=cypress/pathToYourSpec/youSpecFileName.js npm run cypress:dev:run -- --spec=cypress/pathToYourSpec/youSpecFileName.js
``` ```
- To create a development build, start the development server, and run all existing cypress end-to-end tests: - To create a development build, start the development server, and run all existing cypress end-to-end tests:
```console ```console
npm run e2e:dev:run npm run e2e:dev:run
``` ```
## Cypress-GitPod Setup
### 1. Ensure you are on the _Feature Preview_ of GitPod _as of 01/02/2021_
- Go to [GitPod Docs - Feature Preview](https://www.gitpod.io/docs/feature-preview/) to see how to enable _Feature Preview_
### 2. Ensure Development Environment is Running
If starting the GitPod environment did not automatically develop the environment:
- Start the database
```console
mongod
```
- Seed the database
```console
npm run seed
```
- Develop the server and client
```console
npm run develop
```
### 3. Install Cypress Build Tools
```console
npm run cypress:install-build-tools
```
- When prompted in the terminal, select your keyboard layout by language/area
Now, [Cypress can be run](/how-to-add-cypress-tests#_2-run-the-cypress-tests)