Skip to content

Commit

Permalink
test(dsp-app): add cypress e2e test framework (#1161)
Browse files Browse the repository at this point in the history
Co-authored-by: Rebeccasigloch <136320187+RebeccaSigloch2@users.noreply.github.com>
  • Loading branch information
mdelez and RebeccaSigloch2 committed Nov 28, 2023
1 parent ed43e09 commit fbb77ff
Show file tree
Hide file tree
Showing 28 changed files with 3,698 additions and 2,895 deletions.
29 changes: 28 additions & 1 deletion .github/workflows/main.yml
Expand Up @@ -44,7 +44,34 @@ jobs:
- run: npx nx run dsp-app:test:ci
env:
TZ: Europe/Zurich
# - run: npx nx run dsp-app-e2e:e2e-ci

dsp-app-e2e-tests:
name: DSP-APP E2E
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v3
with:
fetch-depth: 0 # gets additionally all tags which we need
- uses: actions/setup-node@v3
with:
node-version: 18
- run: npm install
- name: Checkout DSP-API repo
uses: actions/checkout@v3
with:
repository: dasch-swiss/dsp-api
ref: main
path: dsp-api
- name: start API
run: |
cd dsp-api
make init-db-test
docker compose -f docker-compose.yml up -d sipi ingest api
./webapi/scripts/wait-for-api.sh
- name: run e2e tests
run: |
cd ../dsp-das
npm run e2e-ci
dateadapter-tests:
name: DateAdapter
Expand Down
4 changes: 4 additions & 0 deletions .gitignore
Expand Up @@ -55,3 +55,7 @@ Thumbs.db

.angular
/libs/jdnconvertiblecalendar/coverage/

#E2E
/.nx
apps/dsp-app-e2e/cypress/screenshots
20 changes: 16 additions & 4 deletions README.md
Expand Up @@ -39,28 +39,40 @@ The monorepo is implemented using [NX](https://nx.dev).

The most common commands are defined in `package.json`.

> **_NOTE:_** You can install `nx` globally with `npm install -g nx`. If not, then all `nx` commands bellow need to be prefixed with `npx`.
> **_NOTE:_** You can install `nx` globally with `npm install -g nx`. If not, then all `nx` commands below need to be prefixed with `npx`.
| nx | npm |
|---------------------------------------------------------------|-------------------------------------|
| `nx run dsp-app:test` | `npm run test-local` |
| `nx run dsp-app:test --watch=false --browsers=ChromeHeadless` | `npm run test-ci` |
| `nx run dsp-app:test:ci` | `npm run test-ci` |
| `nx run-many --all --target=test --configuration=ci` | `npm run test-ci-all` |
| `nx run dsp-app:serve` | `npm run start-dev` |
| `nx run dsp-app:serve:test-server` | `npm run start-with-test-server` |
| `nx run dsp-app:serve:dev-server` | `npm run start-with-dev-server` |
| `nx run dsp-app:serve:ls-test-server` | `npm run start-with-ls-test-server` |
| `nx run dsp-app:serve:staging-server` | `npm run start-with-staging-server` |
| `nx run dsp-app:serve:0845-test-server` | `npm run start-with-0845-server` |
| `nx run dsp-app:lint` | `npm run lint-ci` |
| `nx run dsp-app:lint --fix` | `npm run lint-local` |
| `nx run dsp-app-e2e:e2e` | `npm run e2e` |
| `nx run dsp-app-e2e:e2e-ci --webdriver-update=false` | `npm run e2e-ci` |
| `nx run dsp-app-e2e:e2e:development` | `npm run e2e-ci-dev` |
| `nx run dsp-app-e2e:e2e:production` | `npm run e2e-ci` |
| `nx run dsp-app:build` | `build` |
| `nx run dsp-app:build:production` | `build-prod` |

| npx | npm |
|---------------------------------------------------------------|-------------------------------------|
| `cd apps/dsp-app-e2e && npx cypress open` | `npm run e2e-local` |

### IDE plugins
- https://plugins.jetbrains.com/plugin/15101-nx-console-idea
- https://marketplace.visualstudio.com/items?itemName=nrwl.angular-console

### E2E Tests
- There are three spm scripts to run the E2E tests.
- `npm run e2e-ci-dev` will run the E2E tests in the console in a development environment.
- `npm run e2e-ci` will run the E2E tests in the console in a production environment. This is the command that is run on GitHub CI.
- `npm run e2e-local` will open the Cypress UI which will enable you to easy run individual tests and see every step as it runs.


## Further Documentation

Expand Down
12 changes: 12 additions & 0 deletions apps/dsp-app-e2e/cypress.config.ts
@@ -0,0 +1,12 @@
import { defineConfig } from "cypress";

export default defineConfig({
e2e: {
specPattern: 'cypress/**/**/**/*.cy.ts',
excludeSpecPattern: ['*.spec.js', '*.spec.ts'],
baseUrl: "http://localhost:4200",
env: {
apiUrl: "http://0.0.0.0:3333",
}
},
});
@@ -0,0 +1,16 @@
describe('create new project', () => {
it('should create a new project', () => {
cy.visit('/');
cy.get('.create-project-button button').click();
cy.get("#mat-input-0").type("0123");
cy.get("#mat-input-1").type("test");
cy.get("#mat-input-2").type("Test Project");
cy.get("#mat-input-3").type("this is a test project");
cy.get("#mat-mdc-chip-list-input-0").type("project");
cy.get("#mat-mdc-chip-list-input-0").type("{enter}");
cy.get("#mat-mdc-chip-list-input-0").type("test");
cy.get("#mat-mdc-chip-list-input-0").type("{enter}");
cy.get("div.app-content span.mdc-button__label > span").click();
cy.get('.project-longname').should('contain', 'Test Project');
});
});
5 changes: 5 additions & 0 deletions apps/dsp-app-e2e/cypress/fixtures/example.json
@@ -0,0 +1,5 @@
{
"name": "Using fixtures to represent data",
"email": "hello@cypress.io",
"body": "Fixtures are a great way to mock data for responses to routes"
}
13 changes: 13 additions & 0 deletions apps/dsp-app-e2e/cypress/fixtures/user_profiles.json
@@ -0,0 +1,13 @@
{
"admin_username": "daschAdmin",
"admin_password": "DaSCHianer1",
"change_admin_password": "DaSCHianer2",
"projectMember_username": "daschMember",
"projectMember_password": "AMembersPassword1",
"change_projectMember_password": "AMembersPassword2",
"systemAdmin_username": "daschSystemAdmin",
"systemAdmin_password": "IamAllowedTODoEverything1",
"systemAdmin_username_root": "root",
"systemAdmin_password_root": "test",
"change_systemAdmin_password": "IamAllowedTODoEverything2"
}
13 changes: 13 additions & 0 deletions apps/dsp-app-e2e/cypress/global.d.ts
@@ -0,0 +1,13 @@
declare namespace Cypress {

// I can't import User from user-profiles without the linter breaking and idk why
interface User {
username: string;
password: string;
}

interface Chainable<Subject> {
// logs user in via the API
login(user: User): void;
}
}
18 changes: 18 additions & 0 deletions apps/dsp-app-e2e/cypress/models/user-profiles.ts
@@ -0,0 +1,18 @@
export interface User {
username: string;
password: string;
}

export interface UserProfiles {
admin_username: string;
admin_password: string;
change_admin_password: string;
projectMember_username: string;
projectMember_password: string;
change_projectMember_password: string;
systemAdmin_username: string;
systemAdmin_password: string;
systemAdmin_username_root: string;
systemAdmin_password_root: string;
change_systemAdmin_password: string;
}
38 changes: 38 additions & 0 deletions apps/dsp-app-e2e/cypress/support/commands/login.ts
@@ -0,0 +1,38 @@
import { User } from "../../models/user-profiles";

Cypress.Commands.add('login', (user: User) => {
cy.session(user, () => {

cy.request({
method: 'POST',
url: `${Cypress.env("apiUrl")}/v2/authentication`,
body: {
username: user.username,
password: user.password
}
}).then((response) => {
const session = {
id: 123456789,
user: {
name: "root",
jwt: response.body.token,
lang: "de",
sysAdmin: true,
projectAdmin: []
}

};

localStorage.setItem('session', JSON.stringify(session));
localStorage.setItem('cookieBanner', 'false');
cy.visit('/');
cy.get('rn-banner').shadow().find('.rn-close-btn').click();
});
},
{
validate: () => {
const session = localStorage.getItem('session');
expect(session).to.exist;
}
});
});
34 changes: 34 additions & 0 deletions apps/dsp-app-e2e/cypress/support/e2e.ts
@@ -0,0 +1,34 @@
import './commands/login';
import { UserProfiles } from '../models/user-profiles';

// do things here before each test if needed
// All active session data (cookies, localStorage and sessionStorage) across all domains are cleared.
beforeEach(() => {
let users: UserProfiles;
cy.readFile('cypress/fixtures/user_profiles.json').then(
(json: UserProfiles) => {
// read JSON data file
users = json;

if (Cypress.spec.relative.startsWith('cypress/e2e/System_Admin')) {
cy.login({
username: users.systemAdmin_username_root,
password: users.systemAdmin_password_root,
});
}

if (
Cypress.spec.relative.startsWith('cypress/e2e/Project_Member')
) {
cy.login({
username: users.projectMember_username,
password: users.projectMember_password
});
}
}
);
});

// do things here after each test if needed
// afterEach(() => {
// });
57 changes: 14 additions & 43 deletions apps/dsp-app-e2e/project.json
Expand Up @@ -3,56 +3,27 @@
"$schema": "../../node_modules/nx/schemas/project-schema.json",
"sourceRoot": "apps/dsp-app-e2e/src",
"projectType": "application",
"prefix": "dsp-app-e2e",
"targets": {
"e2e": {
"executor": "@angular-devkit/build-angular:protractor",
"executor": "@nrwl/cypress:cypress",
"options": {
"protractorConfig": "apps/dsp-app-e2e/protractor.conf.js",
"devServerTarget": "dsp-app:serve"
"cypressConfig": "apps/dsp-app-e2e/cypress.config.ts"
},
"configurations": {
"production": {
"devServerTarget": "dsp-app:serve:production"
},
"test-server": {
"devServerTarget": "dsp-app:serve:test-server"
},
"ls-test-server": {
"devServerTarget": "dsp-app:serve:ls-test-server"
},
"0845-test-server": {
"devServerTarget": "dsp-app:serve:0845-test-server"
},
"staging-server": {
"devServerTarget": "dsp-app:serve:staging-server"
}
}
},
"e2e-ci": {
"executor": "@angular-devkit/build-angular:protractor",
"options": {
"protractorConfig": "apps/dsp-app-e2e/protractor-ci.conf.js",
"devServerTarget": "dsp-app:serve"
},
"configurations": {
"production": {
"devServerTarget": "dsp-app:serve:production"
},
"test-server": {
"devServerTarget": "dsp-app:serve:test-server"
},
"ls-test-server": {
"devServerTarget": "dsp-app:serve:ls-test-server"
},
"0845-test-server": {
"devServerTarget": "dsp-app:serve:0845-test-server"
},
"staging-server": {
"devServerTarget": "dsp-app:serve:staging-server"
"devServerTarget": "dsp-app:serve:production",
"env": {
"API_URL": "http://0.0.0.0:3333/api"
}
},
"development": {
"devServerTarget": "dsp-app:serve:development",
"env": {
"API_URL": "http://0.0.0.0:3333/api"
}
}
}
}
},
"implicitDependencies": ["dsp-app"],
"tags": []
}
}
10 changes: 0 additions & 10 deletions apps/dsp-app-e2e/protractor-ci.conf.js

This file was deleted.

31 changes: 0 additions & 31 deletions apps/dsp-app-e2e/protractor.conf.js

This file was deleted.

0 comments on commit fbb77ff

Please sign in to comment.