Merge remote-tracking branch 'dspace/dspace-8_x' into accessibility-settings-8_x

# Conflicts:
#	src/app/profile-page/profile-page.component.html
#	src/app/profile-page/profile-page.component.ts
#	src/app/shared/notifications/notifications-board/notifications-board.component.spec.ts
#	src/app/shared/notifications/notifications-board/notifications-board.component.ts
#	src/themes/custom/app/profile-page/profile-page.component.ts

Author: AAwouters

.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

@@ -35,7 +35,7 @@ https://wiki.lyrasis.org/display/DSDOC7x/Installing+DSpace
 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
@@ -90,7 +90,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.
 

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,12 @@ 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.
-  inlineCriticalCss: true
+# 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
 
 # The REST API server settings
 # NOTE: these settings define which (publicly available) REST API to use. They are usually

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

@@ -9,9 +9,11 @@ describe('Admin Add New Modals', () => {
 
   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();
@@ -22,9 +24,11 @@ describe('Admin Add New Modals', () => {
 
   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();
@@ -35,9 +39,11 @@ describe('Admin Add New Modals', () => {
 
   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();

cypress/e2e/admin-edit-modals.cy.ts

@@ -9,9 +9,11 @@ describe('Admin Edit Modals', () => {
 
   it('Edit 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-edit-title').should('be.visible');
     cy.get('#admin-menu-section-edit-title').click();
 
     cy.get('a[data-test="menu.section.edit_community"]').click();
@@ -22,9 +24,11 @@ describe('Admin Edit Modals', () => {
 
   it('Edit 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-edit-title').should('be.visible');
     cy.get('#admin-menu-section-edit-title').click();
 
     cy.get('a[data-test="menu.section.edit_collection"]').click();
@@ -35,9 +39,11 @@ describe('Admin Edit Modals', () => {
 
   it('Edit 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-edit-title').should('be.visible');
     cy.get('#admin-menu-section-edit-title').click();
 
     cy.get('a[data-test="menu.section.edit_item"]').click();

cypress/e2e/admin-export-modals.cy.ts

@@ -9,9 +9,11 @@ describe('Admin Export Modals', () => {
 
   it('Export metadata 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-export-title').should('be.visible');
     cy.get('#admin-menu-section-export-title').click();
 
     cy.get('a[data-test="menu.section.export_metadata"]').click();
@@ -22,9 +24,11 @@ describe('Admin Export Modals', () => {
 
   it('Export batch 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-export-title').should('be.visible');
     cy.get('#admin-menu-section-export-title').click();
 
     cy.get('a[data-test="menu.section.export_batch"]').click();

cypress/e2e/item-edit.cy.ts

@@ -9,18 +9,15 @@ beforeEach(() => {
 
   // This page is restricted, so we will be shown the login form. Fill it out & submit.
   cy.loginViaForm(Cypress.env('DSPACE_TEST_ADMIN_USER'), Cypress.env('DSPACE_TEST_ADMIN_PASSWORD'));
-
-  // We need to wait for the correction types allowed for the item to be loaded to be sure that each tab is fully loaded.
-  // This because the edit item page causes often tests to fails due to timeout.
-  cy.intercept('GET', 'server/api/config/correctiontypes/search/findByItem*').as('correctionTypes');
-  cy.wait('@correctionTypes');
 });
 
 describe('Edit Item > Edit Metadata tab', () => {
   it('should pass accessibility tests', () => {
+    cy.get('a[data-test="metadata"]').should('be.visible');
     cy.get('a[data-test="metadata"]').click();
 
-    // Our selected tab should be active
+    // Our selected tab should be both visible & active
+    cy.get('a[data-test="metadata"]').should('be.visible');
     cy.get('a[data-test="metadata"]').should('have.class', 'active');
 
     // <ds-edit-item-page> tag must be loaded
@@ -39,9 +36,11 @@ describe('Edit Item > Edit Metadata tab', () => {
 describe('Edit Item > Status tab', () => {
 
   it('should pass accessibility tests', () => {
+    cy.get('a[data-test="status"]').should('be.visible');
     cy.get('a[data-test="status"]').click();
 
-    // Our selected tab should be active
+    // Our selected tab should be both visible & active
+    cy.get('a[data-test="status"]').should('be.visible');
     cy.get('a[data-test="status"]').should('have.class', 'active');
 
     // <ds-item-status> tag must be loaded
@@ -55,9 +54,11 @@ describe('Edit Item > Status tab', () => {
 describe('Edit Item > Bitstreams tab', () => {
 
   it('should pass accessibility tests', () => {
+    cy.get('a[data-test="bitstreams"]').should('be.visible');
     cy.get('a[data-test="bitstreams"]').click();
 
-    // Our selected tab should be active
+    // Our selected tab should be both visible & active
+    cy.get('a[data-test="bitstreams"]').should('be.visible');
     cy.get('a[data-test="bitstreams"]').should('have.class', 'active');
 
     // <ds-item-bitstreams> tag must be loaded
@@ -82,9 +83,11 @@ describe('Edit Item > Bitstreams tab', () => {
 describe('Edit Item > Curate tab', () => {
 
   it('should pass accessibility tests', () => {
+    cy.get('a[data-test="curate"]').should('be.visible');
     cy.get('a[data-test="curate"]').click();
 
-    // Our selected tab should be active
+    // Our selected tab should be both visible & active
+    cy.get('a[data-test="curate"]').should('be.visible');
     cy.get('a[data-test="curate"]').should('have.class', 'active');
 
     // <ds-item-curate> tag must be loaded
@@ -98,9 +101,11 @@ describe('Edit Item > Curate tab', () => {
 describe('Edit Item > Relationships tab', () => {
 
   it('should pass accessibility tests', () => {
+    cy.get('a[data-test="relationships"]').should('be.visible');
     cy.get('a[data-test="relationships"]').click();
 
-    // Our selected tab should be active
+    // Our selected tab should be both visible & active
+    cy.get('a[data-test="relationships"]').should('be.visible');
     cy.get('a[data-test="relationships"]').should('have.class', 'active');
 
     // <ds-item-relationships> tag must be loaded
@@ -114,9 +119,11 @@ describe('Edit Item > Relationships tab', () => {
 describe('Edit Item > Version History tab', () => {
 
   it('should pass accessibility tests', () => {
+    cy.get('a[data-test="versionhistory"]').should('be.visible');
     cy.get('a[data-test="versionhistory"]').click();
 
-    // Our selected tab should be active
+    // Our selected tab should be both visible & active
+    cy.get('a[data-test="versionhistory"]').should('be.visible');
     cy.get('a[data-test="versionhistory"]').should('have.class', 'active');
 
     // <ds-item-version-history> tag must be loaded
@@ -130,9 +137,11 @@ describe('Edit Item > Version History tab', () => {
 describe('Edit Item > Access Control tab', () => {
 
   it('should pass accessibility tests', () => {
+    cy.get('a[data-test="access-control"]').should('be.visible');
     cy.get('a[data-test="access-control"]').click();
 
-    // Our selected tab should be active
+    // Our selected tab should be both visible & active
+    cy.get('a[data-test="access-control"]').should('be.visible');
     cy.get('a[data-test="access-control"]').should('have.class', 'active');
 
     // <ds-item-access-control> tag must be loaded
@@ -146,9 +155,11 @@ describe('Edit Item > Access Control tab', () => {
 describe('Edit Item > Collection Mapper tab', () => {
 
   it('should pass accessibility tests', () => {
+    cy.get('a[data-test="mapper"]').should('be.visible');
     cy.get('a[data-test="mapper"]').click();
 
-    // Our selected tab should be active
+    // Our selected tab should be both visible & active
+    cy.get('a[data-test="mapper"]').should('be.visible');
     cy.get('a[data-test="mapper"]').should('have.class', 'active');
 
     // <ds-item-collection-mapper> tag must be loaded