cypress switch to version 12 and add live e2e github action (ansible#214

) * cypress switch to version 12 and add live e2e github action Signed-off-by: James Talton <[email protected]> * github action name Signed-off-by: James Talton <[email protected]> * e2e fixes Signed-off-by: James Talton <[email protected]> * fix Signed-off-by: James Talton <[email protected]> * unit test tweak Signed-off-by: James Talton <[email protected]> * fix e2e tests Signed-off-by: James Talton <[email protected]> * fix tests Signed-off-by: James Talton <[email protected]> * fix e2e live action Signed-off-by: James Talton <[email protected]> * fixed Signed-off-by: James Talton <[email protected]> * fix e2e live Signed-off-by: James Talton <[email protected]> * fix e2e tests Signed-off-by: James Talton <[email protected]> * cleanup e2e and support e2e cleanup Signed-off-by: James Talton <[email protected]> * rename variables Signed-off-by: James Talton <[email protected]> * streamline tests Signed-off-by: James Talton <[email protected]> * strreamline login Signed-off-by: James Talton <[email protected]> * add support for cleaning up e2e orgs older than 2 hours Signed-off-by: James Talton <[email protected]> * disable project e2e tests that cannot be run against a live server Signed-off-by: James Talton <[email protected]> * cleanup code checks Signed-off-by: James Talton <[email protected]> * minor tweaks Signed-off-by: James Talton <[email protected]> * update projects e2e tests to handle delete Signed-off-by: James Talton <[email protected]> * Add Docker Build and Archive step Signed-off-by: James Talton <[email protected]> * Add comments to make clear what is going on in cleanup code Signed-off-by: James Talton <[email protected]> * docker tweak Signed-off-by: James Talton <[email protected]> * fix Signed-off-by: James Talton <[email protected]> * test using docker image Signed-off-by: James Talton <[email protected]> * make cypress deleteRequest have optional param Signed-off-by: James Talton <[email protected]> * Add code coverage to actions Signed-off-by: James Talton <[email protected]> * merge Signed-off-by: James Talton <[email protected]> * fix docker image job Signed-off-by: James Talton <[email protected]> * fix docker build job Signed-off-by: James Talton <[email protected]> * fix docker image build Signed-off-by: James Talton <[email protected]> * fix Signed-off-by: James Talton <[email protected]> * fix e2e testing Signed-off-by: James Talton <[email protected]> * text coverage action Signed-off-by: James Talton <[email protected]> * cleanup cypress package scripts Signed-off-by: James Talton <[email protected]> * fix job Signed-off-by: James Talton <[email protected]> * adjust code coverage minimum Signed-off-by: James Talton <[email protected]> --------- Signed-off-by: James Talton <[email protected]>
RedOrNot · Feb 13, 2023 · cbcd5b2 · cbcd5b2
1 parent 4581b0b
commit cbcd5b2
Show file tree

Hide file tree

Showing 12 changed files with 7,751 additions and 2,977 deletions.
diff --git a/.github/workflows/pull-request.yml b/.github/workflows/pull-request.yml
@@ -8,6 +8,19 @@ concurrency:
   cancel-in-progress: true
 
 jobs:
+  docker-image:
+    name: Docker Build and Archive
+    runs-on: ubuntu-latest
+    steps:
+      - uses: actions/checkout@v3
+      - run: |
+          DOCKER_BUILDKIT=1 docker build --cache-from quay.io/ansible/ansible-ui:dependencies --tag ansible-ui .
+      - run: docker save ansible-ui > ansible-ui.tar
+      - uses: actions/upload-artifact@v3
+        with:
+          name: ansible-ui.tar
+          path: ansible-ui.tar
+
   packages:
     name: Packages
     runs-on: ubuntu-latest
@@ -33,7 +46,9 @@ jobs:
   cypress-e2e:
     name: Cypress E2E
     runs-on: ubuntu-latest
-    needs: packages
+    needs:
+      - packages
+      - docker-image
     steps:
       - uses: actions/checkout@v3
       - uses: actions/setup-node@v3
@@ -49,7 +64,20 @@ jobs:
             ./node_modules
             /home/runner/.cache/Cypress
           key: modules-${{ hashFiles('package-lock-copy.json') }}
-      - run: npm run cypress
+      - uses: actions/download-artifact@v3
+        with:
+          name: ansible-ui.tar
+      - run: docker load --input ansible-ui.tar
+      - run: docker run -d -e PORT=3002 -p 3002:3002 ansible-ui
+      - run: npm run cypress:run:e2e
+        env:
+          E2E_SERVER: ${{ secrets.E2E_SERVER }}
+          E2E_USERNAME: ${{ secrets.E2E_USERNAME }}
+          E2E_PASSWORD: ${{ secrets.E2E_PASSWORD }}
+      - uses: actions/upload-artifact@v3
+        with:
+          name: e2e.info
+          path: coverage/lcov.info
 
   cypress-unit:
     name: Cypress Unit Tests
@@ -70,52 +98,36 @@ jobs:
             ./node_modules
             /home/runner/.cache/Cypress
           key: modules-${{ hashFiles('package-lock-copy.json') }}
-      - run: npm run test:unit
-
-  eslint:
-    name: ESLint
-    runs-on: ubuntu-latest
-    needs: packages
-    steps:
-      - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
-        with:
-          node-version: '18'
-      - name: PreCache
-        run: cat package-lock.json | jq '.version = "0.0.0"' | jq '.packages."".version = "0.0.0"' > package-lock-copy.json
-      - name: Cache dependencies
-        id: cache
-        uses: actions/cache@v3
+      - run: npm run cypress:run:unit
+      - uses: actions/upload-artifact@v3
         with:
-          path: |
-            ./node_modules
-            /home/runner/.cache/Cypress
-          key: modules-${{ hashFiles('package-lock-copy.json') }}
-      - run: npm run eslint
+          name: unit.info
+          path: coverage/lcov.info
 
-  prettier:
-    name: Prettier
+  coverage:
+    name: Coverage Report
     runs-on: ubuntu-latest
-    needs: packages
+    needs:
+      - cypress-e2e
+      - cypress-unit
     steps:
       - uses: actions/checkout@v3
-      - uses: actions/setup-node@v3
+      - uses: actions/download-artifact@v3
         with:
-          node-version: '18'
-      - name: PreCache
-        run: cat package-lock.json | jq '.version = "0.0.0"' | jq '.packages."".version = "0.0.0"' > package-lock-copy.json
-      - name: Cache dependencies
-        id: cache
-        uses: actions/cache@v3
+          name: e2e.info
+      - uses: actions/download-artifact@v3
         with:
-          path: |
-            ./node_modules
-            /home/runner/.cache/Cypress
-          key: modules-${{ hashFiles('package-lock-copy.json') }}
-      - run: npm run prettier
+          name: unit.info
+      - name: Report code coverage
+        uses: zgosalvez/github-actions-report-lcov@v2
+        with:
+          coverage-files: '*.info'
+          minimum-coverage: 50
+          artifact-name: code-coverage-report
+          github-token: ${{ secrets.GITHUB_TOKEN }}
 
-  tsc:
-    name: TSC
+  eslint:
+    name: ESLint - Prettier - TSC
     runs-on: ubuntu-latest
     needs: packages
     steps:
@@ -133,4 +145,4 @@ jobs:
             ./node_modules
             /home/runner/.cache/Cypress
           key: modules-${{ hashFiles('package-lock-copy.json') }}
-      - run: npm run tsc
+      - run: npm run checks
diff --git a/cypress.config.ts b/cypress.config.ts
@@ -8,6 +8,7 @@ export default defineConfig({
   defaultCommandTimeout: 30000,
 
   e2e: {
+    testIsolation: false,
     setupNodeEvents(on, config) {
       // implement node event listeners here
       // eslint-disable-next-line @typescript-eslint/no-unsafe-call, @typescript-eslint/no-var-requires

diff --git a/cypress/CYPRESS.md b/cypress/CYPRESS.md
@@ -13,15 +13,15 @@ Cypress is being used for both unit and E2E tests.
 - Run the unit tests headlessly.
 
   ```
-  npm run test:unit
+  npm run cypress:run:unit
   ```
 
   OR
 
 - Run the unit tests by opening Cypress and launching the browser. (For visual rendering of the components being tested)
 
   ```
-  npm run test:unit:open
+  npm run cypress:open:unit
   ```
 
 ---
@@ -54,7 +54,7 @@ Cypress is being used for both unit and E2E tests.
 | `npm run cypress`           | Runs the frontend and Cypress headless in parallel using the mock API. |
 | `npm run cypress:frontend`  | Runs the frontend without opening the UI in the browser.               |
 | `npm run cypress:run`       | Run Cypress headless against the mock API.                             |
-| `npm run cypress:run:live`  | Run Cypress headless against a live API.                               |
+| `npm run cypress:run:e2e`   | Run Cypress headless against a live API.                               |
 | `npm run cypress:open`      | Run Cypress UI against the mock API.                                   |
 | `npm run cypress:open:live` | Run Cypress UI against a live API.                                     |
 | `npm run coverage`          | After tests have finished, view test coverage.                         |

diff --git a/cypress/e2e/controller/organizations.cy.ts b/cypress/e2e/controller/organizations.cy.ts
@@ -0,0 +1,38 @@
+/* eslint-disable @typescript-eslint/no-non-null-assertion */
+/// <reference types="cypress" />
+
+import { randomString } from '../../../framework/utils/random-string';
+import { Organization } from '../../../frontend/controller/interfaces/Organization';
+import { ItemsResponse } from '../../../frontend/Data';
+
+describe('organizations', () => {
+  let organization: Organization;
+
+  after(() => {
+    // Sometimes if tests are stopped in the middle, we get left over organizations
+    // Cleanup E2E organizations older than 2 hours
+    cy.requestGet<ItemsResponse<Organization>>(
+      `/api/v2/organizations/?limit=100&created__lt=${new Date(
+        Date.now() - 2 * 60 * 60 * 1000
+      ).toISOString()}&name__startswith=E2E`
+    ).then((itemsResponse) => {
+      for (const organization of itemsResponse.results) {
+        cy.requestDelete(`/api/v2/organizations/${organization.id}/`, true);
+      }
+    });
+  });
+
+  beforeEach(() => {
+    cy.requestPost<Organization>('/api/v2/organizations/', {
+      name: 'E2E Organization ' + randomString(4),
+    }).then((testOrganization) => (organization = testOrganization));
+  });
+
+  afterEach(() => {
+    cy.requestDelete(`/api/v2/organizations/${organization.id}/`, true);
+  });
+
+  it('organization page', () => {
+    cy.navigateTo(/^Organizations$/, false);
+  });
+});