Merged main-cris into task/main-cris/DSC-2320

Author: vins01-4science

.eslintrc.json

@@ -165,6 +165,7 @@
         "@angular-eslint/no-output-native": "warn",
         "@angular-eslint/no-output-on-prefix": "warn",
         "@angular-eslint/no-conflicting-lifecycle": "warn",
+        "@angular-eslint/use-lifecycle-interface": "error",
 
         "@typescript-eslint/no-inferrable-types":[
           "error",
@@ -292,7 +293,8 @@
       ],
       "rules": {
         // Custom DSpace Angular rules
-        "dspace-angular-html/themed-component-usages": "error"
+        "dspace-angular-html/themed-component-usages": "error",
+        "dspace-angular-html/no-disabled-attribute-on-button": "error"
       }
     },
     {

.github/workflows/build.yml

@@ -7,7 +7,8 @@ name: Build
 on: [push, pull_request]
 
 permissions:
-  contents: read  #  to fetch code (actions/checkout)
+  contents: read  # to fetch code (actions/checkout)
+  packages: read  # to fetch private images from GitHub Container Registry (GHCR)
 
 jobs:
   tests:
@@ -35,6 +36,9 @@ jobs:
       NODE_OPTIONS: '--max-old-space-size=4096'
       # Project name to use when running "docker compose" prior to e2e tests
       COMPOSE_PROJECT_NAME: 'ci'
+      # Docker Registry to use for Docker compose scripts below.
+      # We use GitHub's Container Registry to avoid aggressive rate limits at DockerHub.
+      DOCKER_REGISTRY: ghcr.io
     strategy:
       # Create a matrix of Node versions to test against (in parallel)
       matrix:
@@ -114,6 +118,14 @@ jobs:
           path: 'coverage/dspace-angular/lcov.info'
           retention-days: 14
 
+      # Login to our Docker registry, so that we can access private Docker images using "docker compose" below.
+      - name: Login to ${{ env.DOCKER_REGISTRY }}
+        uses: docker/login-action@v3
+        with:
+          registry: ${{ env.DOCKER_REGISTRY }}
+          username: ${{ github.repository_owner }}
+          password: ${{ secrets.GITHUB_TOKEN }}
+
       # Using "docker compose" start backend using CI configuration
       # and load assetstore from a cached copy
       - name: Start DSpace REST Backend via Docker (for e2e tests)

.github/workflows/docker.yml

@@ -16,7 +16,8 @@ on:
   pull_request:
 
 permissions:
-  contents: read  #  to fetch code (actions/checkout)
+  contents: read  # to fetch code (actions/checkout)
+  packages: write # to write images to GitHub Container Registry (GHCR)
 
 jobs:
   #############################################################

Dockerfile

@@ -1,7 +1,7 @@
 # This image will be published as dspace/dspace-angular
 # See https://github.com/DSpace/dspace-angular/tree/main/docker for usage details
 
-FROM node:18-alpine
+FROM docker.io/node:18-alpine
 
 # Ensure Python and other build tools are available
 # These are needed to install some node modules, especially on linux/arm64
@@ -24,5 +24,5 @@ ENV NODE_OPTIONS="--max_old_space_size=4096"
 # Listen / accept connections from all IP addresses.
 # NOTE: At this time it is only possible to run Docker container in Production mode
 # if you have a public URL. See https://github.com/DSpace/dspace-angular/issues/1485
-ENV NODE_ENV development
+ENV NODE_ENV=development
 CMD yarn serve --host 0.0.0.0

Dockerfile.dist

@@ -2,9 +2,9 @@
 # See https://github.com/DSpace/dspace-angular/tree/main/docker for usage details
 
 # Test build:
-# docker build -f Dockerfile.dist -t dspace/dspace-angular:latest-dist .
+# docker build -f Dockerfile.dist -t dspace/dspace-angular:dspace-8_x-dist .
 
-FROM node:18-alpine as build
+FROM docker.io/node:18-alpine AS build
 
 # Ensure Python and other build tools are available
 # These are needed to install some node modules, especially on linux/arm64
@@ -26,6 +26,6 @@ COPY --chown=node:node docker/dspace-ui.json /app/dspace-ui.json
 
 WORKDIR /app
 USER node
-ENV NODE_ENV production
+ENV NODE_ENV=production
 EXPOSE 4000
 CMD pm2-runtime start dspace-ui.json --json

README.md

@@ -13,7 +13,7 @@ You can find additional information on the DSpace 7 Angular UI on the [wiki](htt
 Quick start
 -----------
 
-**Ensure you're running [Node](https://nodejs.org) `v16.x` or `v18.x`, [npm](https://www.npmjs.com/) >= `v5.x` and [yarn](https://yarnpkg.com) == `v1.x`**
+**Ensure you're running [Node](https://nodejs.org) `v18.x` or `v20.x`, [npm](https://www.npmjs.com/) >= `v10.x` and [yarn](https://yarnpkg.com) == `v1.x`**
 
 ```bash
 # clone the repo
@@ -68,7 +68,7 @@ Requirements
 ------------
 
 -	[Node.js](https://nodejs.org) and [yarn](https://yarnpkg.com)
--	Ensure you're running node `v16.x` or `v18.x` and yarn == `v1.x`
+-	Ensure you're running node `v18.x` or `v20.x` and yarn == `v1.x`
 
 If you have [`nvm`](https://github.com/creationix/nvm#install-script) or [`nvm-windows`](https://github.com/coreybutler/nvm-windows) installed, which is highly recommended, you can run `nvm install --lts && nvm use` to install and start using the latest Node LTS.
 

angular.json

@@ -34,7 +34,6 @@
               "ngx-export-as",
               "url-parse",
               "uuid",
-              "webfontloader",
               "xlsx",
               "zone.js"
             ],

config/config.example.yml

@@ -1,7 +1,7 @@
 # NOTE: will log all redux actions and transfers in console
 debug: false
 
-# Angular Universal server settings
+# Angular User Inteface settings
 # NOTE: these settings define where Node.js will start your UI application. Therefore, these
 # "ui" settings usually specify a localhost port/URL which is later proxied to a public URL (using Apache or similar)
 ui:
@@ -17,12 +17,37 @@ ui:
   # Trust X-FORWARDED-* headers from proxies (default = true)
   useProxies: true
 
-universal:
-  # Whether to inline "critical" styles into the server-side rendered HTML.
-  # Determining which styles are critical is a relatively expensive operation;
-  # this option can be disabled to boost server performance at the expense of
-  # loading smoothness. For improved SSR performance, DSpace defaults this to false (disabled).
+# Angular Server Side Rendering (SSR) settings
+ssr:
+  # Whether to tell Angular to inline "critical" styles into the server-side rendered HTML.
+  # Determining which styles are critical is a relatively expensive operation; this option is
+  # disabled (false) by default to boost server performance at the expense of loading smoothness.
   inlineCriticalCss: false
+  # Path prefixes to enable SSR for. By default these are limited to paths of primary DSpace objects.
+  # NOTE: The "/handle/" path ensures Handle redirects work via SSR.  The "/reload/" path ensures
+  # hard refreshes (e.g. after login) trigger SSR while fully reloading the page.
+  paths: [ '/home', '/items/', '/entities/', '/collections/', '/communities/', '/bitstream/', '/bitstreams/', '/handle/', '/reload/' ]
+  # Whether to enable rendering of Search component on SSR.
+  # If set to true the component will be included in the HTML returned from the server side rendering.
+  # If set to false the component will not be included in the HTML returned from the server side rendering.
+  enableSearchComponent: false
+  # Whether to enable rendering of Browse component on SSR.
+  # If set to true the component will be included in the HTML returned from the server side rendering.
+  # If set to false the component will not be included in the HTML returned from the server side rendering.
+  enableBrowseComponent: false
+  # Enable state transfer from the server-side application to the client-side application.
+  # Defaults to true.
+  # Note: When using an external application cache layer, it's recommended not to transfer the state to avoid caching it.
+  # Disabling it ensures that dynamic state information is not inadvertently cached, which can improve security and
+  # ensure that users always use the most up-to-date state.
+  transferState: true
+  # When a different REST base URL is used for the server-side application, the generated state contains references to
+  # REST resources with the internal URL configured. By default, these internal URLs are replaced with public URLs.
+  # Disable this setting to avoid URL replacement during SSR. In this the state is not transferred to avoid security issues.
+  replaceRestUrl: true
+  # Enable request performance profiling data collection and printing the results in the server console.
+  # Defaults to false. Enabling in production is NOT recommended
+  #enablePerformanceProfiler: false
 
 # The REST API server settings
 # NOTE: these settings define which (publicly available) REST API to use. They are usually
@@ -33,6 +58,9 @@ rest:
   port: 443
   # NOTE: Space is capitalized because 'namespace' is a reserved string in TypeScript
   nameSpace: /server
+  # Provide a different REST url to be used during SSR execution. It must contain the whole url including protocol, server port and
+  # server namespace (uncomment to use it).
+  #ssrBaseUrl: http://localhost:8080/server
 
 # Caching settings
 cache:
@@ -467,7 +495,12 @@ search:
     enabled: false
     # List of filters to enable in "Advanced Search" dropdown
     filter: [ 'title', 'author', 'subject', 'entityType' ]
-
+  #
+  # Number used to render n UI elements called loading skeletons that act as placeholders.
+  # These elements indicate that some content will be loaded in their stead.
+  # Since we don't know how many filters will be loaded before we receive a response from the server we use this parameter for the skeletons count.
+  # e.g. If we set 5 then 5 loading skeletons will be visualized before the actual filters are retrieved.
+  defaultFiltersCount: 5
 
 # Notify metrics
 # Configuration for Notify Admin Dashboard for metrics visualization
@@ -521,6 +554,20 @@ notifyMetrics:
     config: 'NOTIFY.outgoing.delivered'
     description: 'admin-notify-dashboard.NOTIFY.outgoing.delivered.description'
 
+# Live Region configuration
+# Live Region as defined by w3c, https://www.w3.org/TR/wai-aria-1.1/#terms:
+# Live regions are perceivable regions of a web page that are typically updated as a
+# result of an external event when user focus may be elsewhere.
+#
+# The DSpace live region is a component present at the bottom of all pages that is invisible by default, but is useful
+# for screen readers. Any message pushed to the live region will be announced by the screen reader. These messages
+# usually contain information about changes on the page that might not be in focus.
+liveRegion:
+  # The duration after which messages disappear from the live region in milliseconds
+  messageTimeOutDurationMs: 30000
+  # The visibility of the live region. Setting this to true is only useful for debugging purposes.
+  isVisible: false
+
 # CRIS Layout
 # Configuration for CRIS Layout
 crisLayout:

cypress.config.ts

@@ -1,6 +1,7 @@
 import { defineConfig } from 'cypress';
 
 export default defineConfig({
+  video: true,
   videosFolder: 'cypress/videos',
   screenshotsFolder: 'cypress/screenshots',
   fixturesFolder: 'cypress/fixtures',
@@ -18,6 +19,7 @@ export default defineConfig({
 
     // Admin account used for administrative tests
     DSPACE_TEST_ADMIN_USER: 'dspacedemo+admin@gmail.com',
+    DSPACE_TEST_ADMIN_USER_UUID: '335647b6-8a52-4ecb-a8c1-7ebabb199bda',
     DSPACE_TEST_ADMIN_PASSWORD: 'dspace',
     // Community/collection/publication used for view/edit tests
     DSPACE_TEST_COMMUNITY: '0958c910-2037-42a9-81c7-dca80e3892b4',
@@ -33,6 +35,8 @@ export default defineConfig({
     // Account used to test basic submission process
     DSPACE_TEST_SUBMIT_USER: 'dspacedemo+submit@gmail.com',
     DSPACE_TEST_SUBMIT_USER_PASSWORD: 'dspace',
+    // Administrator users group
+    DSPACE_ADMINISTRATOR_GROUP: 'e59f5659-bff9-451e-b28f-439e7bd467e4'
   },
   e2e: {
     // Setup our plugins for e2e tests

cypress/e2e/admin-add-new-modals.cy.ts

@@ -0,0 +1,54 @@
+import { testA11y } from 'cypress/support/utils';
+
+describe('Admin Add New Modals', () => {
+  beforeEach(() => {
+    // Must login as an Admin for sidebar to appear
+    cy.visit('/login');
+    cy.loginViaForm(Cypress.env('DSPACE_TEST_ADMIN_USER'), Cypress.env('DSPACE_TEST_ADMIN_PASSWORD'));
+  });
+
+  it('Add new Community modal should pass accessibility tests', () => {
+    // Pin the sidebar open
+    cy.get('#sidebar-collapse-toggle').trigger('mouseover');
+    cy.get('#sidebar-collapse-toggle').click();
+
+    // Click on entry of menu
+    cy.get('#admin-menu-section-new-title').should('be.visible');
+    cy.get('#admin-menu-section-new-title').click();
+
+    cy.get('a[data-test="menu.section.new_community"]').click();
+
+    // Analyze <ds-create-community-parent-selector> for accessibility
+    testA11y('ds-create-community-parent-selector');
+  });
+
+  it('Add new Collection modal should pass accessibility tests', () => {
+    // Pin the sidebar open
+    cy.get('#sidebar-collapse-toggle').trigger('mouseover');
+    cy.get('#sidebar-collapse-toggle').click();
+
+    // Click on entry of menu
+    cy.get('#admin-menu-section-new-title').should('be.visible');
+    cy.get('#admin-menu-section-new-title').click();
+
+    cy.get('a[data-test="menu.section.new_collection"]').click();
+
+    // Analyze <ds-create-collection-parent-selector> for accessibility
+    testA11y('ds-create-collection-parent-selector');
+  });
+
+  it('Add new Item modal should pass accessibility tests', () => {
+    // Pin the sidebar open
+    cy.get('#sidebar-collapse-toggle').trigger('mouseover');
+    cy.get('#sidebar-collapse-toggle').click();
+
+    // Click on entry of menu
+    cy.get('#admin-menu-section-new-title').should('be.visible');
+    cy.get('#admin-menu-section-new-title').click();
+
+    cy.get('a[data-test="menu.section.new_item"]').click();
+
+    // Analyze <ds-create-item-parent-selector> for accessibility
+    testA11y('ds-create-item-parent-selector');
+  });
+});