Merged in DSC-283-align-with-7.1 (pull request #41)

DSC-283 align with 7.1

.github/workflows/build.yml

@@ -16,9 +16,9 @@ jobs:
       DSPACE_REST_PORT: 8080
       DSPACE_REST_NAMESPACE: '/server'
       DSPACE_REST_SSL: false
-      # When Chrome version is specified, we pin to a specific version of Chrome & ChromeDriver
-      # Comment this out to use the latest release of both.
-      CHROME_VERSION: "90.0.4430.212-1"
+      # When Chrome version is specified, we pin to a specific version of Chrome
+      # Comment this out to use the latest release
+      #CHROME_VERSION: "90.0.4430.212-1"
     strategy:
       # Create a matrix of Node versions to test against (in parallel)
       matrix:
@@ -66,12 +66,6 @@ jobs:
           key: ${{ runner.os }}-yarn-${{ hashFiles('**/yarn.lock') }}
           restore-keys: ${{ runner.os }}-yarn-
 
-      - name: Install latest ChromeDriver compatible with installed Chrome
-        # needs to be npm, the --detect_chromedriver_version flag doesn't work with yarn global
-        run: |
-          npm install -g chromedriver --detect_chromedriver_version
-          chromedriver -v
-
       - name: Install Yarn dependencies
         run: yarn install --frozen-lockfile
 
@@ -99,23 +93,40 @@ jobs:
           docker-compose -f ./docker/cli.yml -f ./docker/cli.assetstore.yml run --rm dspace-cli
           docker container ls
 
-      # Wait until the REST API returns a 200 response (or for a max of 30 seconds)
-      # https://github.com/nev7n/wait_for_response
-      - name: Wait for DSpace REST Backend to be ready (for e2e tests)
-        uses: nev7n/wait_for_response@v1
-        with:
-            # We use the 'sites' endpoint to also ensure the database is ready
-            url: 'http://localhost:8080/server/api/core/sites'
-            responseCode: 200
-            timeout: 30000
-
-      - name: Get DSpace REST Backend info/properties
-        run: curl http://localhost:8080/server/api
-
+      # Run integration tests via Cypress.io
+      # https://github.com/cypress-io/github-action
+      # (NOTE: to run these e2e tests locally, just use 'ng e2e')
       - name: Run e2e tests (integration tests)
-        run: |
-          chromedriver --url-base='/wd/hub' --port=4444 &
-          yarn run e2e:ci
+        uses: cypress-io/github-action@v2
+        with:
+          # Run tests in Chrome, headless mode
+          browser: chrome
+          headless: true
+          # Start app before running tests (will be stopped automatically after tests finish)
+          start: yarn run serve:ssr
+          # Wait for backend & frontend to be available
+          # NOTE: We use the 'sites' REST endpoint to also ensure the database is ready
+          wait-on: http://localhost:8080/server/api/core/sites, http://localhost:4000
+          # Wait for 2 mins max for everything to respond
+          wait-on-timeout: 120
+
+      # Cypress always creates a video of all e2e tests (whether they succeeded or failed)
+      # Save those in an Artifact
+      - name: Upload e2e test videos to Artifacts
+        uses: actions/upload-artifact@v2
+        if: always()
+        with:
+          name: e2e-test-videos
+          path: cypress/videos
+
+      # If e2e tests fail, Cypress creates a screenshot of what happened
+      # Save those in an Artifact
+      - name: Upload e2e test failure screenshots to Artifacts
+        uses: actions/upload-artifact@v2
+        if: failure()
+        with:
+          name: e2e-test-screenshots
+          path: cypress/screenshots
 
       # Start up the app with SSR enabled (run in background)
       - name: Start app in SSR (server-side rendering) mode

angular.json

@@ -151,18 +151,19 @@
             "tsConfig": [
               "tsconfig.app.json",
               "tsconfig.spec.json",
-              "e2e/tsconfig.json"
+              "cypress/tsconfig.json"
             ],
             "exclude": [
               "**/node_modules/**"
             ]
           }
         },
         "e2e": {
-          "builder": "@angular-devkit/build-angular:protractor",
+          "builder": "@cypress/schematic:cypress",
           "options": {
-            "protractorConfig": "e2e/protractor.conf.js",
-            "devServerTarget": "dspace-angular:serve"
+            "devServerTarget": "dspace-angular:serve",
+            "watch": true,
+            "headless": false
           },
           "configurations": {
             "production": {
@@ -219,6 +220,24 @@
           "configurations": {
             "production": {}
           }
+        },
+        "cypress-run": {
+          "builder": "@cypress/schematic:cypress",
+          "options": {
+            "devServerTarget": "dspace-angular:serve"
+          },
+          "configurations": {
+            "production": {
+              "devServerTarget": "dspace-angular:serve:production"
+            }
+          }
+        },
+        "cypress-open": {
+          "builder": "@cypress/schematic:cypress",
+          "options": {
+            "watch": true,
+            "headless": false
+          }
         }
       }
     }
@@ -227,4 +246,4 @@
   "cli": {
     "analytics": false
   }
-}
+}

cypress.json

@@ -0,0 +1,9 @@
+{
+  "integrationFolder": "cypress/integration",
+  "supportFile": "cypress/support/index.ts",
+  "videosFolder": "cypress/videos",
+  "screenshotsFolder": "cypress/screenshots",
+  "pluginsFile": "cypress/plugins/index.ts",
+  "fixturesFolder": "cypress/fixtures",
+  "baseUrl": "http://localhost:4000"
+}

cypress/fixtures/example.json

@@ -0,0 +1,5 @@
+{
+  "name": "Using fixtures to represent data",
+  "email": "[email protected]",
+  "body": "Fixtures are a great way to mock data for responses to routes"
+}

cypress/integration/breadcrumbs.spec.ts

@@ -0,0 +1,22 @@
+import { TEST_ENTITY_PUBLICATION } from 'cypress/support';
+import { testA11y } from 'cypress/support/utils';
+import { Options } from 'cypress-axe';
+
+xdescribe('Breadcrumbs', () => {
+    it('should pass accessibility tests', () => {
+        // Visit an Item, as those have more breadcrumbs
+        cy.visit('/entities/publication/' + TEST_ENTITY_PUBLICATION);
+
+        // Wait for breadcrumbs to be visible
+        cy.get('ds-breadcrumbs').should('be.visible');
+
+        // Analyze <ds-breadcrumbs> for accessibility
+        testA11y('ds-breadcrumbs',
+          {
+            rules: {
+              'heading-order': { enabled: false }
+            }
+          } as Options
+        );
+    });
+});

cypress/integration/browse-by-author.spec.ts

@@ -0,0 +1,13 @@
+import { testA11y } from 'cypress/support/utils';
+
+describe('Browse By Author', () => {
+    it('should pass accessibility tests', () => {
+        cy.visit('/browse/author');
+
+        // Wait for <ds-browse-by-metadata-page> to be visible
+        cy.get('ds-browse-by-metadata-page').should('be.visible');
+
+        // Analyze <ds-browse-by-metadata-page> for accessibility
+        testA11y('ds-browse-by-metadata-page');
+    });
+});

cypress/integration/browse-by-dateissued.spec.ts

@@ -0,0 +1,13 @@
+import { testA11y } from 'cypress/support/utils';
+
+describe('Browse By Date Issued', () => {
+    it('should pass accessibility tests', () => {
+        cy.visit('/browse/dateissued');
+
+        // Wait for <ds-browse-by-date-page> to be visible
+        cy.get('ds-browse-by-date-page').should('be.visible');
+
+        // Analyze <ds-browse-by-date-page> for accessibility
+        testA11y('ds-browse-by-date-page');
+    });
+});

cypress/integration/browse-by-subject.spec.ts

@@ -0,0 +1,13 @@
+import { testA11y } from 'cypress/support/utils';
+
+describe('Browse By Subject', () => {
+    it('should pass accessibility tests', () => {
+        cy.visit('/browse/subject');
+
+        // Wait for <ds-browse-by-metadata-page> to be visible
+        cy.get('ds-browse-by-metadata-page').should('be.visible');
+
+        // Analyze <ds-browse-by-metadata-page> for accessibility
+        testA11y('ds-browse-by-metadata-page');
+    });
+});

cypress/integration/browse-by-title.spec.ts

@@ -0,0 +1,13 @@
+import { testA11y } from 'cypress/support/utils';
+
+describe('Browse By Title', () => {
+    it('should pass accessibility tests', () => {
+        cy.visit('/browse/title');
+
+        // Wait for <ds-browse-by-title-page> to be visible
+        cy.get('ds-browse-by-title-page').should('be.visible');
+
+        // Analyze <ds-browse-by-title-page> for accessibility
+        testA11y('ds-browse-by-title-page');
+    });
+});

cypress/integration/collection-page.spec.ts

@@ -0,0 +1,15 @@
+import { TEST_COLLECTION } from 'cypress/support';
+import { testA11y } from 'cypress/support/utils';
+
+describe('Collection Page', () => {
+
+    it('should pass accessibility tests', () => {
+        cy.visit('/collections/' + TEST_COLLECTION);
+
+        // <ds-collection-page> tag must be loaded
+        cy.get('ds-collection-page').should('exist');
+
+        // Analyze <ds-collection-page> for accessibility issues
+        testA11y('ds-collection-page');
+    });
+});

cypress/integration/collection-statistics.spec.ts

@@ -0,0 +1,32 @@
+import { TEST_COLLECTION } from 'cypress/support';
+import { testA11y } from 'cypress/support/utils';
+
+xdescribe('Collection Statistics Page', () => {
+    const COLLECTIONSTATISTICSPAGE = '/statistics/collections/' + TEST_COLLECTION;
+
+    it('should load if you click on "Statistics" from a Collection page', () => {
+        cy.visit('/collections/' + TEST_COLLECTION);
+        cy.get('ds-navbar ds-link-menu-item a[title="Statistics"]').click();
+        cy.location('pathname').should('eq', COLLECTIONSTATISTICSPAGE);
+    });
+
+    it('should contain a "Total visits" section', () => {
+        cy.visit(COLLECTIONSTATISTICSPAGE);
+        cy.get('.' + TEST_COLLECTION + '_TotalVisits').should('exist');
+    });
+
+    it('should contain a "Total visits per month" section', () => {
+        cy.visit(COLLECTIONSTATISTICSPAGE);
+        cy.get('.' + TEST_COLLECTION + '_TotalVisitsPerMonth').should('exist');
+    });
+
+    it('should pass accessibility tests', () => {
+        cy.visit(COLLECTIONSTATISTICSPAGE);
+
+        // <ds-collection-statistics-page> tag must be loaded
+        cy.get('ds-collection-statistics-page').should('exist');
+
+        // Analyze <ds-collection-statistics-page> for accessibility issues
+        testA11y('ds-collection-statistics-page');
+    });
+});

cypress/integration/community-list.spec.ts

@@ -0,0 +1,26 @@
+import { Options } from 'cypress-axe';
+import { testA11y } from 'cypress/support/utils';
+
+describe('Community List Page', () => {
+
+    it('should pass accessibility tests', () => {
+        cy.visit('/community-list');
+
+        // <ds-community-list-page> tag must be loaded
+        cy.get('ds-community-list-page').should('exist');
+
+        // Open first Community (to show Collections)...that way we scan sub-elements as well
+        cy.get('ds-community-list :nth-child(1) > .btn-group > .btn').click();
+
+        // Analyze <ds-community-list-page> for accessibility issues
+        // Disable heading-order checks until it is fixed
+        testA11y('ds-community-list-page',
+            {
+                rules: {
+                    'heading-order': { enabled: false },
+                    'button-name': { enabled: false },
+                }
+            } as Options
+        );
+    });
+});

cypress/integration/community-page.spec.ts

@@ -0,0 +1,22 @@
+import { TEST_COMMUNITY } from 'cypress/support';
+import { testA11y } from 'cypress/support/utils';
+import { Options } from 'cypress-axe';
+
+describe('Community Page', () => {
+
+    it('should pass accessibility tests', () => {
+        cy.visit('/communities/' + TEST_COMMUNITY);
+
+        // <ds-community-page> tag must be loaded
+        cy.get('ds-community-page').should('exist');
+
+        // Analyze <ds-community-page> for accessibility issues
+        testA11y('ds-community-page',
+          {
+            rules: {
+              'heading-order': { enabled: false }
+            }
+          } as Options
+        );
+    });
+});

cypress/integration/community-statistics.spec.ts

@@ -0,0 +1,32 @@
+import { TEST_COMMUNITY } from 'cypress/support';
+import { testA11y } from 'cypress/support/utils';
+
+xdescribe('Community Statistics Page', () => {
+    const COMMUNITYSTATISTICSPAGE = '/statistics/communities/' + TEST_COMMUNITY;
+
+    it('should load if you click on "Statistics" from a Community page', () => {
+        cy.visit('/communities/' + TEST_COMMUNITY);
+        cy.get('ds-navbar ds-link-menu-item a[title="Statistics"]').click();
+        cy.location('pathname').should('eq', COMMUNITYSTATISTICSPAGE);
+    });
+
+    it('should contain a "Total visits" section', () => {
+        cy.visit(COMMUNITYSTATISTICSPAGE);
+        cy.get('.' + TEST_COMMUNITY + '_TotalVisits').should('exist');
+    });
+
+    it('should contain a "Total visits per month" section', () => {
+        cy.visit(COMMUNITYSTATISTICSPAGE);
+        cy.get('.' + TEST_COMMUNITY + '_TotalVisitsPerMonth').should('exist');
+    });
+
+    it('should pass accessibility tests', () => {
+        cy.visit(COMMUNITYSTATISTICSPAGE);
+
+        // <ds-community-statistics-page> tag must be loaded
+        cy.get('ds-community-statistics-page').should('exist');
+
+        // Analyze <ds-community-statistics-page> for accessibility issues
+        testA11y('ds-community-statistics-page');
+    });
+});

cypress/integration/footer.spec.ts

@@ -0,0 +1,20 @@
+import { testA11y } from 'cypress/support/utils';
+import { Options } from 'cypress-axe';
+
+describe('Footer', () => {
+    it('should pass accessibility tests', () => {
+        cy.visit('/');
+
+        // Footer must first be visible
+        cy.get('ds-footer').should('be.visible');
+
+        // Analyze <ds-footer> for accessibility
+        testA11y('ds-footer',
+          {
+            rules: {
+              'heading-order': { enabled: false }
+            }
+          } as Options
+        );
+    });
+});