mirror of https://github.com/nocodb/nocodb
flisowna
2 years ago
166 changed files with 593 additions and 464 deletions
@ -1,79 +0,0 @@
|
||||
# Playwright E2E tests |
||||
|
||||
## Setup |
||||
|
||||
Make sure to install the dependencies(in the playwright folder): |
||||
|
||||
```bash |
||||
npm install |
||||
npx playwright install chromium --with-deps |
||||
``` |
||||
|
||||
## Run Test Server |
||||
|
||||
Start the backend test server (in `packages/nocodb` folder): |
||||
|
||||
```bash |
||||
npm run watch:run:playwright:quick |
||||
``` |
||||
|
||||
Start the frontend test server (in `packages/nc-gui` folder): |
||||
|
||||
```bash |
||||
NUXT_PAGE_TRANSITION_DISABLE=true npm run dev |
||||
``` |
||||
|
||||
## Running Tests |
||||
|
||||
### Running all tests |
||||
|
||||
For selecting db type, rename `.env.example` to `.env` and set `E2E_DEV_DB_TYPE` to `sqlite`(default), `mysql` or `pg`. |
||||
|
||||
```bash |
||||
npm run test |
||||
``` |
||||
|
||||
### Running individual tests |
||||
|
||||
Add `.only` to the test you want to run: |
||||
|
||||
```js |
||||
test.only('should login', async ({ page }) => { |
||||
// ... |
||||
}) |
||||
``` |
||||
|
||||
```bash |
||||
npm run test |
||||
``` |
||||
|
||||
## Developing tests |
||||
|
||||
### WebStorm |
||||
|
||||
In Webstorm, you can use the `test-debug` run action to run the tests. |
||||
|
||||
Add `.only` to the test you want to run. This will open the test in a chromium session and you can also add break points. |
||||
|
||||
i.e `test.only('should login', async ({ page }) => {` |
||||
|
||||
### VSCode |
||||
|
||||
In VSCode, use this [https://marketplace.visualstudio.com/items?itemName=msjsdiag.debugger-for-chromium](extension). |
||||
|
||||
It will have run button beside each test in the file. |
||||
|
||||
### Page Objects |
||||
|
||||
Page object is a class which has methods to interact with a page/component. Methods should be thin and should not do a whole lot. They should also be reusable. |
||||
|
||||
All the action methods i.e click of a page object is also responsible for waiting till the action is completed. This can be done by waiting on an API call or some ui change. |
||||
|
||||
Do not add any logic to the tests. Instead, create a page object for the page you are testing. |
||||
All the selection, UI actions and assertions should be in the page object. |
||||
|
||||
Page objects should be in `packages/nc-gui/tests/playwright/pages` folder. |
||||
|
||||
### Verify if tests are not flaky |
||||
|
||||
Add `.only` to the added test and run `npm run test:repeat`. This will run the test multiple times and should show if the test is flaky. |
||||
@ -0,0 +1,100 @@
|
||||
# Playwright E2E tests |
||||
|
||||
## Setup |
||||
|
||||
Make sure to install the dependencies(in the playwright folder, which is `./tests/playwright`): |
||||
|
||||
```bash |
||||
npm install |
||||
npx playwright install chromium --with-deps |
||||
``` |
||||
|
||||
## Run Test Server |
||||
|
||||
Start the backend test server (in `packages/nocodb` folder): |
||||
|
||||
```bash |
||||
npm run watch:run:playwright |
||||
``` |
||||
|
||||
Start the frontend test server (in `packages/nc-gui` folder): |
||||
|
||||
```bash |
||||
NUXT_PAGE_TRANSITION_DISABLE=true npm run dev |
||||
``` |
||||
|
||||
## Running Tests |
||||
|
||||
### Running all tests |
||||
|
||||
For selecting db type, rename `.env.example` to `.env` and set `E2E_DEV_DB_TYPE` to `sqlite`(default), `mysql` or `pg`. |
||||
|
||||
headless mode(without opening browser): |
||||
|
||||
```bash |
||||
npm run test |
||||
``` |
||||
|
||||
with browser: |
||||
|
||||
```bash |
||||
npm run test:debug |
||||
``` |
||||
|
||||
</br> |
||||
</br> |
||||
|
||||
For setting up mysql: |
||||
|
||||
```bash |
||||
docker-compose -f ./tests/playwright/scripts/docker-compose-mysql-playwright.yml up -d |
||||
``` |
||||
|
||||
For setting up postgres: |
||||
|
||||
```bash |
||||
docker-compose -f ./tests/playwright/scripts/docker-compose-playwright-pg.yml |
||||
``` |
||||
|
||||
### Running individual tests |
||||
|
||||
Add `.only` to the test you want to run: |
||||
|
||||
```js |
||||
test.only('should login', async ({ page }) => { |
||||
// ... |
||||
}) |
||||
``` |
||||
|
||||
```bash |
||||
npm run test |
||||
``` |
||||
|
||||
## Developing tests |
||||
|
||||
### WebStorm |
||||
|
||||
In Webstorm, you can use the `test-debug` run action to run the tests. |
||||
|
||||
Add `.only` to the test you want to run. This will open the test in a chromium session and you can also add break points. |
||||
|
||||
### VSCode |
||||
|
||||
In VSCode, use this [extension](https://marketplace.visualstudio.com/items?itemName=ms-playwright.playwright). |
||||
|
||||
It will have run button beside each test in the file. |
||||
|
||||
## Page Objects |
||||
|
||||
- Page object is a class which has methods to interact with a page/component. Methods should be thin and should not do a whole lot. They should also be reusable. |
||||
|
||||
- All the action methods i.e click of a page object is also responsible for waiting till the action is completed. This can be done by waiting on an API call or some ui change. |
||||
|
||||
- Do not add any logic to the tests. Instead, create a page object for the page you are testing. |
||||
All the selection, UI actions and assertions should be in the page object. |
||||
|
||||
Page objects should be in `./tests/playwright/pages` folder. |
||||
|
||||
## Verify if tests are not flaky |
||||
|
||||
Add `.only` to the added tests and run `npm run test:repeat`. This will run the test multiple times and should show if the test is flaky. |
||||
Some files were not shown because too many files have changed in this diff Show More
Loading…
Reference in new issue