Skip to content

Commit

Permalink
Setup Cypress UI testing (#234)
Browse files Browse the repository at this point in the history
Signed-off-by: Griffin-Sullivan <[email protected]>
  • Loading branch information
Griffin-Sullivan authored Aug 5, 2024
1 parent 499b9d4 commit e9fbf26
Show file tree
Hide file tree
Showing 19 changed files with 12,264 additions and 6,557 deletions.
4 changes: 4 additions & 0 deletions .github/workflows/ui-frontend-build.yml
Original file line number Diff line number Diff line change
Expand Up @@ -23,6 +23,10 @@ jobs:
working-directory: clients/ui/frontend
run: npm install

- name: Run tests
working-directory: clients/ui/frontend
run: npm run test:cypress-ci

- name: Clean
working-directory: clients/ui/frontend
run: npm run build:clean
Expand Down
2 changes: 2 additions & 0 deletions clients/ui/frontend/.env.cypress.mock
Original file line number Diff line number Diff line change
@@ -0,0 +1,2 @@
# Test against prod build hosted by lightweight http server
BASE_URL=http://localhost:9001
2 changes: 1 addition & 1 deletion clients/ui/frontend/CONTRIBUTING.md
Original file line number Diff line number Diff line change
Expand Up @@ -30,7 +30,7 @@ Once you have both services ready, you can open the dashboard locally at: `http:

## Debugging and Testing

[TBD]
See [frontend testing guidelines](docs/testing.md) for more information.

## Environment variables

Expand Down
4 changes: 2 additions & 2 deletions clients/ui/frontend/docs/dev-setup.md
Original file line number Diff line number Diff line change
Expand Up @@ -44,10 +44,10 @@ For in-depth local run guidance review the [contribution guidelines](../CONTRIBU

### Testing

Run the tests.
Run the mock tests.

```bash
npm run test
npm run test:cypress-ci
```

For in-depth testing guidance review the [testing guidelines](./testing.md)
35 changes: 34 additions & 1 deletion clients/ui/frontend/docs/testing.md
Original file line number Diff line number Diff line change
@@ -1,3 +1,36 @@
# Model Registry UI Testing

[TBD]
## Cypress Tests

Cypress is used to run tests against the frontend while mocking all network requests.

Single command to run all Cypress tests or a specific test (build frontend, start HTTP server, run Cypress):

```bash
npm run test:cypress-ci

npm run test:cypress-ci -- --spec "**/testfile.cy.ts"
```

Cypress tests require a frontend server to be running.

To best match production, build the frontend and use a lightweight HTTP server to host the files. This method will require manual rebuilds when changes are made to the dashboard frontend code.

```bash
npm run cypress:server:build
npm run cypress:server
```

To run all Cypress tests or a specific test headless

```bash
npm run cypress:run:mock

npm run cypress:run:mock -- --spec "**/testfile.cy.ts"
```

To open the Cypress GUI run

```bash
npm run cypress:open:mock
```
Loading

0 comments on commit e9fbf26

Please sign in to comment.