fix: dashboard unit tests updated

.vscode/settings.json

@@ -45,4 +45,14 @@
         {"name": "common", "rootPath": "./projects/common", "runMode": "on-demand", "jestCommandLine": "node --experimental-vm-modules --no-warnings ../../node_modules/jest/bin/jest.js"},
         {"name": "aas-server", "rootPath": "./projects/aas-server", "runMode": "on-demand", "jestCommandLine": "node --experimental-vm-modules --no-warnings ../../node_modules/jest/bin/jest.js"}
     ],
+    "jasmineExplorer.config": "./jasmine.json",
+    "jasmineExplorer.debuggerConfig": "",
+    "jasmineExplorer.nodeArgv": [
+        "--experimental-vm-modules", 
+        "--no-warnings",
+        "-r",
+        "ts-node/register",
+    ],
+    "jasmineExplorer.nodePath": null,
+    "jasmineExplorer.jasminePath": null,
 }

jasmine.json

@@ -0,0 +1,7 @@
+{
+    "spec_dir": "./projects",
+    "spec_files": [
+        "aas-lib/src/**/*[sS]pec.ts",
+        "aas-portal/src/**/*[sS]pec.ts"
+    ]
+}

projects/aas-portal/src/app/dashboard/dashboard.component.ts

@@ -212,7 +212,7 @@ export class DashboardComponent implements OnInit, OnDestroy, AfterViewInit, Aft
             this.auth.deleteCookie('.DashboardName');
         }
 
-        this.dashboard.save();
+        this.dashboard.save().subscribe();
 
         this.toolbar.clear();
         this.closeWebSocket();

projects/aas-portal/src/app/dashboard/dashboard.service.ts

@@ -20,7 +20,7 @@ import {
 } from 'common';
 import { cloneDeep } from 'lodash-es';
 import { ERRORS } from '../types/errors';
-import { map, Observable } from 'rxjs';
+import { map, mergeMap, Observable, of } from 'rxjs';
 import { Store } from '@ngrx/store';
 import { encodeBase64Url, AuthService } from 'aas-lib';
 import * as DashboardSelectors from './dashboard.selectors';
@@ -245,12 +245,16 @@ export class DashboardService {
         this.modified = true;
     }
 
-    public save(): void {
-        if (this.modified) {
-            this.write()
-                .pipe(map(() => (this.modified = false)))
-                .subscribe();
+    public save(): Observable<void> {
+        if (!this.modified) {
+            return of(void 0);
         }
+
+        return this.write().pipe(
+            map(() => {
+                this.modified = false;
+            }),
+        );
     }
 
     private addLineCharts(

projects/aas-portal/src/test/aas/aas-api.service.spec.ts

@@ -11,6 +11,7 @@ import { TestBed } from '@angular/core/testing';
 
 import { createDocument } from '../assets/test-document';
 import { AASApiService } from '../../app/aas/aas-api.service';
+import { noop } from 'lodash-es';
 
 describe('AASApiService', function () {
     let service: AASApiService;
@@ -62,10 +63,10 @@ describe('AASApiService', function () {
     });
 
     describe('getTemplates', () => {
-        it('ToDo', () => {});
+        it('ToDo', () => noop());
     });
 
     describe('putDocument', () => {
-        it('ToDo', () => {});
+        it('ToDo', () => noop());
     });
 });

projects/aas-portal/src/test/dashboard/dashboard.component.spec.ts

@@ -43,6 +43,7 @@ describe('DashboardComponent', () => {
 
         auth.checkCookie.and.returnValue(of(true));
         auth.getCookie.and.returnValue(of(JSON.stringify(pages)));
+        auth.setCookie.and.returnValue(of(void 0));
 
         TestBed.configureTestingModule({
             declarations: [DashboardComponent],
@@ -92,25 +93,25 @@ describe('DashboardComponent', () => {
         expect(component).toBeTruthy();
     });
 
-    it('shows the Test page', function () {
+    it('shows the Test page', () => {
         expect(component.page.name).toEqual('Test');
     });
 
-    it('displays two rows', function () {
+    it('displays two rows', () => {
         expect(component.rows.length).toEqual(2);
     });
 
-    describe('single selection', function () {
-        it('supports single mode selection', function () {
+    describe('single selection', () => {
+        it('supports single mode selection', () => {
             expect(component.selectionMode).toEqual(SelectionMode.Single);
         });
 
-        it('indicates no item selected', function () {
+        it('indicates no item selected', () => {
             expect(component.selectedItem).toBeNull();
             expect(component.selectedItems.length).toEqual(0);
         });
 
-        it('allows to toggle the selection of a chart', function () {
+        it('allows to toggle the selection of a chart', () => {
             component.toggleSelection(component.rows[0].columns[0]);
             expect(component.selectedItem).toEqual(component.rows[0].columns[0].item);
             expect(component.selectedItems.length).toEqual(1);
@@ -119,7 +120,7 @@ describe('DashboardComponent', () => {
             expect(component.selectedItems.length).toEqual(0);
         });
 
-        it('ensures that only one item is selected', function () {
+        it('ensures that only one item is selected', () => {
             component.toggleSelection(component.rows[0].columns[0]);
             expect(component.selectedItem).toEqual(component.rows[0].columns[0].item);
             expect(component.selectedItems.length).toEqual(1);
@@ -129,22 +130,22 @@ describe('DashboardComponent', () => {
         });
     });
 
-    describe('view mode', function () {
-        it('has a view mode (initial)', function () {
+    describe('view mode', () => {
+        it('has a view mode (initial)', () => {
             expect(component.editMode).toBeFalse();
         });
     });
 
-    describe('edit mode', function () {
-        beforeEach(function () {
+    describe('edit mode', () => {
+        beforeEach(() => {
             component.editMode = true;
         });
 
-        it('has an edit mode', function () {
+        it('has an edit mode', () => {
             expect(component.editMode).toBeTrue();
         });
 
-        it('can move item[0, 1] to the left', function (done: DoneFn) {
+        it('can move item[0, 1] to the left', (done: DoneFn) => {
             const id = component.rows[0].columns[1].id;
             component.toggleSelection(component.rows[0].columns[1]);
             expect(component.canMoveLeft()).toBeTrue();
@@ -176,7 +177,7 @@ describe('DashboardComponent', () => {
                 });
         });
 
-        it('can move item[0, 0] to the right including undo/redo', function (done: DoneFn) {
+        it('can move item[0, 0] to the right including undo/redo', (done: DoneFn) => {
             const id = component.rows[0].columns[0].id;
             component.toggleSelection(component.rows[0].columns[0]);
             expect(component.canMoveRight()).toBeTrue();
@@ -208,7 +209,7 @@ describe('DashboardComponent', () => {
                 });
         });
 
-        it('can move item[0, 0] up creating a new row including undo/redo', function (done: DoneFn) {
+        it('can move item[0, 0] up creating a new row including undo/redo', (done: DoneFn) => {
             const id = component.rows[0].columns[0].id;
             component.toggleSelection(component.rows[0].columns[0]);
             expect(component.canMoveUp()).toBeTrue();
@@ -243,7 +244,7 @@ describe('DashboardComponent', () => {
                 });
         });
 
-        it('can move item[0, 0] down to [1, 1] including undo/redo', function (done: DoneFn) {
+        it('can move item[0, 0] down to [1, 1] including undo/redo', (done: DoneFn) => {
             const id = component.rows[0].columns[0].id;
             component.toggleSelection(component.rows[0].columns[0]);
             expect(component.canMoveDown()).toBeTrue();
@@ -275,11 +276,11 @@ describe('DashboardComponent', () => {
                 });
         });
 
-        it('gets the color of a chart', function () {
+        it('gets the color of a chart', () => {
             expect(component.getColor(component.rows[0].columns[0])).toEqual('#123456');
         });
 
-        it('sets the color of a chart including undo/redo', function (done: DoneFn) {
+        it('sets the color of a chart including undo/redo', (done: DoneFn) => {
             component.changeColor(component.rows[0].columns[0], '#AA55AA');
             store
                 .select(state => state.dashboard.rows)
@@ -308,11 +309,11 @@ describe('DashboardComponent', () => {
                 });
         });
 
-        it('gets the source labels of a chart', function () {
+        it('gets the source labels of a chart', () => {
             expect(component.getSources(component.rows[0].columns[0])).toEqual(['RotationSpeed']);
         });
 
-        it('can delete the Test page', function (done: DoneFn) {
+        it('can delete the Test page', (done: DoneFn) => {
             const name = component.page.name;
             component.delete();
             service.pages.pipe(first()).subscribe(pages => {
@@ -321,7 +322,7 @@ describe('DashboardComponent', () => {
             });
         });
 
-        it('can change the min value', function (done: DoneFn) {
+        it('can change the min value', (done: DoneFn) => {
             component.changeMin(component.rows[0].columns[0], '0');
             store
                 .select(state => state.dashboard.rows)
@@ -350,7 +351,7 @@ describe('DashboardComponent', () => {
                 });
         });
 
-        it('can change the max value', function (done: DoneFn) {
+        it('can change the max value', (done: DoneFn) => {
             component.changeMax(component.rows[0].columns[0], '5500');
             store
                 .select(state => state.dashboard.rows)

projects/aas-portal/src/test/dashboard/dashboard.service.spec.ts

@@ -19,14 +19,15 @@ import { pages } from './test-pages';
 import { DashboardChart, DashboardChartType, DashboardItem, DashboardPage } from '../../app/dashboard/dashboard.state';
 import { AuthService } from 'aas-lib';
 
-describe('DashboardService', function () {
+describe('DashboardService', () => {
     let service: DashboardService;
     let auth: jasmine.SpyObj<AuthService>;
 
     beforeEach(() => {
         auth = jasmine.createSpyObj<AuthService>(['checkCookie', 'getCookie', 'setCookie']);
         auth.checkCookie.and.returnValue(of(true));
         auth.getCookie.and.returnValue(of(JSON.stringify(pages)));
+        auth.setCookie.and.returnValue(of(void 0));
 
         TestBed.configureTestingModule({
             providers: [
@@ -52,11 +53,11 @@ describe('DashboardService', function () {
         service = TestBed.inject(DashboardService);
     });
 
-    it('should be created', function () {
+    it('should be created', () => {
         expect(service).toBeTruthy();
     });
 
-    it('provides always a default page', function () {
+    it('provides always a default page', () => {
         expect(service.defaultPage?.name).toBeDefined();
     });
 
@@ -67,23 +68,23 @@ describe('DashboardService', function () {
         });
     });
 
-    it('allows finding a specific dashboard page', function () {
+    it('allows finding a specific dashboard page', () => {
         expect(service.find('Test')).toEqual(pages[1]);
     });
 
-    it('returns undefined for an unknown dashboard page', function () {
+    it('returns undefined for an unknown dashboard page', () => {
         expect(service.find('unknown')).toBeUndefined();
     });
 
-    it('returns the Test dashboard as a grid with 2 rows and 2/1 column', function () {
+    it('returns the Test dashboard as a grid with 2 rows and 2/1 column', () => {
         const page = service.find('Test')!;
         const grid = service.getGrid(page);
         expect(grid.length).toEqual(2);
         expect(grid[0].length).toEqual(2);
         expect(grid[1].length).toEqual(1);
     });
 
-    it('returns the Test dashboard as rows', function () {
+    it('returns the Test dashboard as rows', () => {
         const page = service.find('Test')!;
         const rows = service.getRows(page);
         expect(rows.length).toEqual(2);
@@ -98,7 +99,7 @@ describe('DashboardService', function () {
         });
     });
 
-    describe('setPageName', function () {
+    describe('setPageName', () => {
         it('allows setting "Test" as new active dashboard', function (done: DoneFn) {
             service.setPageName('Test');
             service.name.pipe(first()).subscribe(value => {
@@ -107,12 +108,12 @@ describe('DashboardService', function () {
             });
         });
 
-        it('throws an error if a dashboard with the specified does not exist', function () {
+        it('throws an error if a dashboard with the specified does not exist', () => {
             expect(() => service.setPageName('unknown')).toThrowError();
         });
     });
 
-    describe('add', function () {
+    describe('add', () => {
         it('allows adding RotationSpeed and Torque to the default page as separate line charts', function (done: DoneFn) {
             service.add(service.defaultPage.name, sampleDocument, [rotationSpeed, torque], DashboardChartType.Line);
             service.pages.pipe(first()).subscribe(items => {
@@ -145,54 +146,57 @@ describe('DashboardService', function () {
             });
         });
 
-        it('throws an error when adding a property to an unknown page', function () {
+        it('throws an error when adding a property to an unknown page', () => {
             expect(() =>
                 service.add('unknown', sampleDocument, [rotationSpeed, torque], DashboardChartType.BarVertical),
             ).toThrowError();
         });
     });
 
-    describe('save', function () {
-        it('allows saving the current dashboard state', function () {
+    describe('save', () => {
+        it('allows saving the current dashboard state', (done: DoneFn) => {
             service.add(
                 service.defaultPage.name,
                 sampleDocument,
                 [rotationSpeed, torque],
                 DashboardChartType.BarVertical,
             );
-            service.save();
-            expect(auth.setCookie).toHaveBeenCalled();
+
+            service.save().subscribe(() => {
+                expect(auth.setCookie).toHaveBeenCalled();
+                done();
+            });
         });
     });
 
-    describe('canMove...', function () {
+    describe('canMove...', () => {
         let page: DashboardPage;
         let grid: DashboardItem[][];
 
-        beforeEach(function () {
+        beforeEach(() => {
             page = service.find('Test')!;
             grid = service.getGrid(page);
         });
 
-        it('indicates whether a chart can be moved to the left', function () {
+        it('indicates whether a chart can be moved to the left', () => {
             expect(service.canMoveLeft(page, grid[0][0])).toBeFalse();
             expect(service.canMoveLeft(page, grid[0][1])).toBeTrue();
             expect(service.canMoveLeft(page, grid[1][0])).toBeFalse();
         });
 
-        it('indicates whether a chart can be moved to the right', function () {
+        it('indicates whether a chart can be moved to the right', () => {
             expect(service.canMoveRight(page, grid[0][0])).toBeTrue();
             expect(service.canMoveRight(page, grid[0][1])).toBeFalse();
             expect(service.canMoveRight(page, grid[1][0])).toBeFalse();
         });
 
-        it('indicates whether a chart can be moved up', function () {
+        it('indicates whether a chart can be moved up', () => {
             expect(service.canMoveUp(page, grid[0][0])).toBeTrue();
             expect(service.canMoveUp(page, grid[0][1])).toBeTrue();
             expect(service.canMoveUp(page, grid[1][0])).toBeTrue();
         });
 
-        it('indicates whether a chart can be moved down', function () {
+        it('indicates whether a chart can be moved down', () => {
             expect(service.canMoveDown(page, grid[0][0])).toBeTrue();
             expect(service.canMoveDown(page, grid[0][1])).toBeTrue();
             expect(service.canMoveDown(page, grid[1][0])).toBeFalse();