Migration DMP Tool MUG version 4 (#14)

* Storage: Fix internal storage title layout

* Global: Change date picker to always use utc

* github: release on v* tag push

* 214 global add new damap logo (tuwien-csd#216)

* adapt new logo

* add favicon - dark blue

* Add cancel button for export field

* Datastep: Preselect default license for source code

* Global: Remove two unneeded ui-elements

* tests: add schema to test cases (tuwien-csd#212)

* tests: add schema to test cases

* tests: add spec reporter and set fixed test order

* modules: remove TranslateModule from export

* Fix SVG loading issue by setting base href in index file

* ManualProject: Change language on date input

* Personstep: Rename service search field label

* Datastep: Hide date input field when dataset is closed

* Add new identifier types

* Shared: Make autocomplete panel responsive to resize of textarea-wrapper

* Update Angular Version from v17 to v18 (tuwien-csd#229)

* modify gitignore for nx

* update angular version - v18

* replace async -> waitForAsync

* keep default material ui version

* update Dockerfile

* access: add ng-content to person card to show child content (tuwien-csd#244)

* refactor logo position and format files needed (tuwien-csd#246)

* Display dataset size label (tuwien-csd#247)

* git: update docker tag for release workflow

* Global: Upgrade color theme system to mat3

* Global: Upgrade typography theme system to mat3

* resolve focus indicator issues for buttons and nav items

* github: always add latest tag for docker image

* release: v4.0.0

* e2e: fix tests

* adjust changes, color palette to align with tool color choice

---------

Co-authored-by: ValentinFutterer <[email protected]>
Co-authored-by: David Eckhard <[email protected]>
Co-authored-by: David <[email protected]>

.github/workflows/release.yml

@@ -2,6 +2,9 @@ name: release
 
 env:
   REGISTRY: ghcr.io
+  is-master-branch: ${{ github.ref == 'refs/heads/master' }}
+  is-next-branch: ${{ github.ref == 'refs/heads/next' }}
+  is-version-tag: ${{ startsWith(github.ref, 'refs/tags/v') }}
 
 on:
   push:
@@ -31,6 +34,9 @@ jobs:
         uses: docker/metadata-action@v5
         with:
           images: ${{ env.REGISTRY }}/${{ github.repository }}
+          # git tag: v1.2.3, output: 1.2.3
+          tags: |
+            type=semver,pattern={{version}},enable=${{ env.is-version-tag == 'true'}}
 
       - name: Build and push Docker image
         uses: docker/build-push-action@v5

.gitignore

@@ -61,4 +61,4 @@ src/themes/*
 .angular
 
 
-.nx/cache
+.nx/

Dockerfile

@@ -2,7 +2,7 @@
 
 # Create a first stage container to build the application, this container image will be dropped once
 # the runner is built
-FROM trion/ng-cli:17.1.2 AS deps
+FROM trion/ng-cli:18.0.3 AS deps
 
 # This Dockerfile uses labels from the label-schema namespace from http://label-schema.org/rc1/
 LABEL maintainer="[email protected]" \
@@ -23,7 +23,7 @@ COPY . /app
 ENV PATH="$PATH:/app/node_modules/@angular/cli/bin/"
 
 # install and build the application on the builder container
-RUN npm install --ignore-scripts -g "nx@18.0.4"
+RUN npm install --ignore-scripts -g "nx@19.3.0"
 RUN npm ci --ignore-scripts
 RUN npx nx build damap-frontend
 

apps/damap-frontend-e2e/cypress.config.ts

@@ -4,6 +4,7 @@ import { nxE2EPreset } from '@nrwl/cypress/plugins/cypress-preset';
 export default defineConfig({
   e2e: {
     ...nxE2EPreset(__dirname),
+    baseUrl: 'http://localhost:4200',
     specPattern: [
       '**/app.cy.ts',
       '**/dmp.cy.ts',

apps/damap-frontend-e2e/src/e2e/access.cy.ts

@@ -10,7 +10,7 @@ describe('access', () => {
   it('should add dmp editor', () => {
     cy.intercept('POST', '/api/access').as('createAccess');
     cy.get('app-dmp-table tr').first().get('td').last().click();
-    cy.get('mat-mdc-menu-content button')
+    cy.get('div.mat-mdc-menu-content button')
       .get('mat-icon')
       .contains('admin_panel_settings')
       .click();
@@ -21,7 +21,7 @@ describe('access', () => {
   it('should delete dmp editor', () => {
     cy.intercept('DELETE', '/api/access/*').as('deleteAccess');
     cy.get('app-dmp-table tr').first().get('td').last().click();
-    cy.get('mat-mdc-menu-content button')
+    cy.get('div.mat-mdc-menu-content button')
       .get('mat-icon')
       .contains('admin_panel_settings')
       .click();

apps/damap-frontend-e2e/src/e2e/delete-dmp.cy.ts

@@ -12,11 +12,13 @@ describe('delete dmp', () => {
   it('should delete dmp', () => {
     cy.intercept('DELETE', '/api/dmps/*').as('deleteDmp');
     cy.get('app-dmp-table tr').first().get('td').last().click();
-    cy.get('mat-mdc-menu-content button')
+    cy.get('div.mat-mdc-menu-content button')
       .get('mat-icon')
       .contains('delete')
       .click();
-    cy.get('damap-delete-warning-dialog > div > button').last().click();
+    cy.get('damap-delete-warning-dialog > mat-dialog-actions > button')
+      .last()
+      .click();
     cy.wait('@deleteDmp');
   });
 });

apps/damap-frontend-e2e/src/e2e/dmp.cy.ts

@@ -10,6 +10,8 @@ describe('dmp', () => {
   after(() => cy.logout());
 
   it('should create and autosave dmp', () => {
+    cy.intercept('PUT', '/api/dmps/*').as('updateDmp');
+    cy.intercept('POST', '/api/fits/examine').as('examineFile');
     // Create new dmp
     cy.get('div.button-row-left > button').last().click();
     // eslint-disable-next-line cypress/no-unnecessary-waiting
@@ -21,7 +23,7 @@ describe('dmp', () => {
     ).as('steps');
 
     // Create new project
-    cy.get('app-dmp-project mat-tab-group div.mat-tab-labels > div')
+    cy.get('app-dmp-project mat-tab-group div.mat-mdc-tab-labels > div')
       .last()
       .click();
     cy.get('app-dmp-project app-manual-project-input app-input-wrapper input')
@@ -43,18 +45,19 @@ describe('dmp', () => {
 
     // Add contributor via search
     cy.get('@steps').contains('People').click();
-    cy.get('app-person-search input').first().type('Test');
+    cy.get('app-person-search input').first().type('Test', { force: true });
     cy.get('.search-result mat-option').first().click();
 
     // Add new data
     cy.get('@steps').contains('Specify').click();
+    cy.wait('@updateDmp'); // Wait for DMP being saved. Otherwise, radio button might become unselected again.
     cy.get('app-created-data app-data-mc mat-radio-group').scrollIntoView();
-    cy.get('app-created-data app-data-mc mat-radio-group mat-radio-button')
+    cy.get('app-created-data app-data-mc mat-radio-group [type=radio]')
       .last()
       .click();
 
     // Use file upload
-    cy.get('app-created-data mat-tab-group div.mat-tab-labels > div')
+    cy.get('app-created-data mat-tab-group div.mat-mdc-tab-labels > div')
       .last()
       .click();
     cy.get('app-created-data app-file-upload .dropzone').scrollIntoView();
@@ -67,6 +70,7 @@ describe('dmp', () => {
       },
       { action: 'drag-drop' },
     );
+    cy.wait('@examineFile');
     cy.get('app-created-data app-dataset-table table tbody tr')
       .last()
       .contains('file.txt');
@@ -80,7 +84,7 @@ describe('dmp', () => {
     // Search for repository
     cy.get('@steps').contains('repositories').click();
     cy.get('app-dmp-repo h2').scrollIntoView();
-    cy.get('app-dmp-repo mat-tab-group div.mat-tab-labels > div')
+    cy.get('app-dmp-repo mat-tab-group div.mat-mdc-tab-labels > div')
       .last()
       .click();
     cy.get('app-dmp-repo app-repo-filter').first().click();
@@ -90,7 +94,7 @@ describe('dmp', () => {
     cy.get('mat-tree mat-tree-node > mat-checkbox')
       .contains('Education')
       .click();
-    cy.get('filter-dialog > div > button').last().click();
+    cy.get('filter-dialog > mat-dialog-actions > button').last().click();
     cy.get('app-dmp-repo app-tag').should('exist');
 
     // Go back to plans

apps/damap-frontend/karma.conf.js

@@ -10,6 +10,7 @@ module.exports = function (config) {
       require('karma-chrome-launcher'),
       require('karma-jasmine-html-reporter'),
       require('karma-junit-reporter'),
+      require('karma-spec-reporter'),
       require('karma-coverage'),
       require('@angular-devkit/build-angular/plugins/karma'),
     ],
@@ -19,6 +20,7 @@ module.exports = function (config) {
         // the possible options are listed at https://jasmine.github.io/api/edge/Configuration.html
         // for example, you can disable the random execution with `random: false`
         // or set a specific seed with `seed: 4321`
+        random: false,
       },
       clearContext: false, // leave Jasmine Spec Runner output visible in browser
     },
@@ -30,7 +32,7 @@ module.exports = function (config) {
       subdir: '.',
       reporters: [{ type: 'html' }, { type: 'text-summary' }, { type: 'lcov' }],
     },
-    reporters: ['progress', 'kjhtml', 'junit'],
+    reporters: ['progress', 'kjhtml', 'junit', 'spec'],
     port: 9876,
     colors: true,
     logLevel: config.LOG_INFO,

apps/damap-frontend/src/app/app.component.spec.ts

@@ -1,12 +1,15 @@
+import { TestBed, waitForAsync } from '@angular/core/testing';
+
 import { AppComponent } from './app.component';
-import { TestBed } from '@angular/core/testing';
+import { CUSTOM_ELEMENTS_SCHEMA } from '@angular/core';
 
 describe('AppComponent', () => {
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
       declarations: [AppComponent],
+      schemas: [CUSTOM_ELEMENTS_SCHEMA],
     }).compileComponents();
-  });
+  }));
 
   it('should create the app', () => {
     const fixture = TestBed.createComponent(AppComponent);

apps/damap-frontend/src/app/components/consent/consent.component.html

@@ -24,7 +24,7 @@ <h2 translate>heading</h2>
 <mat-dialog-actions align="end">
   <button
     mat-raised-button
-    color="primary"
+    class="button-color-primary"
     [mat-dialog-close]="true"
     cdkFocusInitial>
     {{ "accept" | translate }}

apps/damap-frontend/src/app/components/consent/consent.component.spec.ts

@@ -1,17 +1,20 @@
-import { ComponentFixture, TestBed } from '@angular/core/testing';
-import { TranslateTestingModule } from '@damap/core';
+import { ComponentFixture, TestBed, waitForAsync } from '@angular/core/testing';
+
 import { ConsentComponent } from './consent.component';
+import { NO_ERRORS_SCHEMA } from '@angular/core';
+import { TranslateTestingModule } from '@damap/core';
 
 describe('ConsentComponent', () => {
   let component: ConsentComponent;
   let fixture: ComponentFixture<ConsentComponent>;
 
-  beforeEach(async () => {
-    await TestBed.configureTestingModule({
+  beforeEach(waitForAsync(() => {
+    TestBed.configureTestingModule({
       imports: [TranslateTestingModule],
       declarations: [ConsentComponent],
+      schemas: [NO_ERRORS_SCHEMA],
     }).compileComponents();
-  });
+  }));
 
   beforeEach(() => {
     fixture = TestBed.createComponent(ConsentComponent);