vikunja-frontend/cypress/README.md

49 lines
1.2 KiB
Markdown
Raw Permalink Normal View History

Frontend Testing With Cypress (#313) Wait until the request is finished Wait for the newly created task exists in the dom Wait until the login request is done Wait until the list request is done Make sure no user token is in local storage when trying to register Make sure to always upload test results Disable capturing videos of test runs in CI Add uploading test result screenshots from ci Assert a success notification is shown after creating a new list Change input element locators Fix testing for favorite lists Make sure faked usernames are always random Make sure the tests work Make sure to use node 12 everywhere in ci Add docs Fix setting api url for running tests Use a working node version Ignore cypress screenshots and videos Set cache folders Explicitly ignore cypress files when running unit tests Trigger Drone Only run unit tests with yarn test:unit Add serve dist command to serve built static files Trigger Drone Fix cypress image Change cypress image Unify test & build step back again to prevent double installation of dependencies Add cache location config Move test steps to separate pipeline Run cypress tests in drone Fix all tests Make all factory methods static Use factories everywhere Cleanup Add tests for the editor Add tests for viewing link shares Fix seed Add test to make sure settings elements are hidden if the user does not have the right to edit the current list Co-authored-by: kolaente <k@knt.li> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/313 Co-Authored-By: konrad <konrad@kola-entertainments.de> Co-Committed-By: konrad <konrad@kola-entertainments.de>
2020-12-10 14:52:35 +01:00
# Frontend Testing With Cypress
## Setup
* Enable the [seeder api endpoint](https://vikunja.io/docs/config-options/#testingtoken). You'll then need to add the testingtoken in `cypress.json` or set the `CYPRESS_TEST_SECRET` environment variable.
* Basic configuration happens in the `cypress.json` file
* Overridable with [env](https://docs.cypress.io/guides/guides/environment-variables.html#Option-3-CYPRESS)
* Override base url with `CYPRESS_BASE_URL`
## Fixtures
We're using the [test endpoint](https://vikunja.io/docs/config-options/#testingtoken) of the vikunja api to
seed the database with test data before running the tests.
Frontend Testing With Cypress (#313) Wait until the request is finished Wait for the newly created task exists in the dom Wait until the login request is done Wait until the list request is done Make sure no user token is in local storage when trying to register Make sure to always upload test results Disable capturing videos of test runs in CI Add uploading test result screenshots from ci Assert a success notification is shown after creating a new list Change input element locators Fix testing for favorite lists Make sure faked usernames are always random Make sure the tests work Make sure to use node 12 everywhere in ci Add docs Fix setting api url for running tests Use a working node version Ignore cypress screenshots and videos Set cache folders Explicitly ignore cypress files when running unit tests Trigger Drone Only run unit tests with yarn test:unit Add serve dist command to serve built static files Trigger Drone Fix cypress image Change cypress image Unify test & build step back again to prevent double installation of dependencies Add cache location config Move test steps to separate pipeline Run cypress tests in drone Fix all tests Make all factory methods static Use factories everywhere Cleanup Add tests for the editor Add tests for viewing link shares Fix seed Add test to make sure settings elements are hidden if the user does not have the right to edit the current list Co-authored-by: kolaente <k@knt.li> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/313 Co-Authored-By: konrad <konrad@kola-entertainments.de> Co-Committed-By: konrad <konrad@kola-entertainments.de>
2020-12-10 14:52:35 +01:00
This ensures better reproducability of tests.
## Running The Tests Locally
### Using Docker
The easiest way to run all frontend tests locally is by using the `docker-compose` file in this repository.
It uses the same configuration as the CI.
To use it, run
```shell
Frontend Testing With Cypress (#313) Wait until the request is finished Wait for the newly created task exists in the dom Wait until the login request is done Wait until the list request is done Make sure no user token is in local storage when trying to register Make sure to always upload test results Disable capturing videos of test runs in CI Add uploading test result screenshots from ci Assert a success notification is shown after creating a new list Change input element locators Fix testing for favorite lists Make sure faked usernames are always random Make sure the tests work Make sure to use node 12 everywhere in ci Add docs Fix setting api url for running tests Use a working node version Ignore cypress screenshots and videos Set cache folders Explicitly ignore cypress files when running unit tests Trigger Drone Only run unit tests with yarn test:unit Add serve dist command to serve built static files Trigger Drone Fix cypress image Change cypress image Unify test & build step back again to prevent double installation of dependencies Add cache location config Move test steps to separate pipeline Run cypress tests in drone Fix all tests Make all factory methods static Use factories everywhere Cleanup Add tests for the editor Add tests for viewing link shares Fix seed Add test to make sure settings elements are hidden if the user does not have the right to edit the current list Co-authored-by: kolaente <k@knt.li> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/313 Co-Authored-By: konrad <konrad@kola-entertainments.de> Co-Committed-By: konrad <konrad@kola-entertainments.de>
2020-12-10 14:52:35 +01:00
docker-compose up -d
```
Then, once all containers are started, run
```shell
docker-compose run cypress bash
Frontend Testing With Cypress (#313) Wait until the request is finished Wait for the newly created task exists in the dom Wait until the login request is done Wait until the list request is done Make sure no user token is in local storage when trying to register Make sure to always upload test results Disable capturing videos of test runs in CI Add uploading test result screenshots from ci Assert a success notification is shown after creating a new list Change input element locators Fix testing for favorite lists Make sure faked usernames are always random Make sure the tests work Make sure to use node 12 everywhere in ci Add docs Fix setting api url for running tests Use a working node version Ignore cypress screenshots and videos Set cache folders Explicitly ignore cypress files when running unit tests Trigger Drone Only run unit tests with yarn test:unit Add serve dist command to serve built static files Trigger Drone Fix cypress image Change cypress image Unify test & build step back again to prevent double installation of dependencies Add cache location config Move test steps to separate pipeline Run cypress tests in drone Fix all tests Make all factory methods static Use factories everywhere Cleanup Add tests for the editor Add tests for viewing link shares Fix seed Add test to make sure settings elements are hidden if the user does not have the right to edit the current list Co-authored-by: kolaente <k@knt.li> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/313 Co-Authored-By: konrad <konrad@kola-entertainments.de> Co-Committed-By: konrad <konrad@kola-entertainments.de>
2020-12-10 14:52:35 +01:00
```
to get a shell inside the cypress container.
In that shell you can then execute the tests with
```shell
Frontend Testing With Cypress (#313) Wait until the request is finished Wait for the newly created task exists in the dom Wait until the login request is done Wait until the list request is done Make sure no user token is in local storage when trying to register Make sure to always upload test results Disable capturing videos of test runs in CI Add uploading test result screenshots from ci Assert a success notification is shown after creating a new list Change input element locators Fix testing for favorite lists Make sure faked usernames are always random Make sure the tests work Make sure to use node 12 everywhere in ci Add docs Fix setting api url for running tests Use a working node version Ignore cypress screenshots and videos Set cache folders Explicitly ignore cypress files when running unit tests Trigger Drone Only run unit tests with yarn test:unit Add serve dist command to serve built static files Trigger Drone Fix cypress image Change cypress image Unify test & build step back again to prevent double installation of dependencies Add cache location config Move test steps to separate pipeline Run cypress tests in drone Fix all tests Make all factory methods static Use factories everywhere Cleanup Add tests for the editor Add tests for viewing link shares Fix seed Add test to make sure settings elements are hidden if the user does not have the right to edit the current list Co-authored-by: kolaente <k@knt.li> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/313 Co-Authored-By: konrad <konrad@kola-entertainments.de> Co-Committed-By: konrad <konrad@kola-entertainments.de>
2020-12-10 14:52:35 +01:00
yarn test:frontend
```
### Using The Cypress Dashboard
To open the Cypress Dashboard and run tests from there, run
```shell
Frontend Testing With Cypress (#313) Wait until the request is finished Wait for the newly created task exists in the dom Wait until the login request is done Wait until the list request is done Make sure no user token is in local storage when trying to register Make sure to always upload test results Disable capturing videos of test runs in CI Add uploading test result screenshots from ci Assert a success notification is shown after creating a new list Change input element locators Fix testing for favorite lists Make sure faked usernames are always random Make sure the tests work Make sure to use node 12 everywhere in ci Add docs Fix setting api url for running tests Use a working node version Ignore cypress screenshots and videos Set cache folders Explicitly ignore cypress files when running unit tests Trigger Drone Only run unit tests with yarn test:unit Add serve dist command to serve built static files Trigger Drone Fix cypress image Change cypress image Unify test & build step back again to prevent double installation of dependencies Add cache location config Move test steps to separate pipeline Run cypress tests in drone Fix all tests Make all factory methods static Use factories everywhere Cleanup Add tests for the editor Add tests for viewing link shares Fix seed Add test to make sure settings elements are hidden if the user does not have the right to edit the current list Co-authored-by: kolaente <k@knt.li> Reviewed-on: https://kolaente.dev/vikunja/frontend/pulls/313 Co-Authored-By: konrad <konrad@kola-entertainments.de> Co-Committed-By: konrad <konrad@kola-entertainments.de>
2020-12-10 14:52:35 +01:00
yarn cypress:open
```