diff --git a/angular.json b/angular.json
index a4fe6e5..3ecefba 100644
--- a/angular.json
+++ b/angular.json
@@ -66,26 +66,14 @@
"development": {
"optimization": false,
"extractLicenses": false,
- "sourceMap": true,
- "fileReplacements": [
- {
- "replace": "src/environments/environment.ts",
- "with": "src/environments/environment.development.ts"
- }
- ]
+ "sourceMap": true
},
"dev-spa": {
"optimization": false,
"extractLicenses": false,
"sourceMap": true,
"ssr": false,
- "prerender": false,
- "fileReplacements": [
- {
- "replace": "src/environments/environment.ts",
- "with": "src/environments/environment.dev-spa.ts"
- }
- ]
+ "prerender": false
}
},
"defaultConfiguration": "production"
diff --git a/src/app/pages/page/page.component.html b/src/app/pages/page/page.component.html
index d73b4a7..dd956aa 100644
--- a/src/app/pages/page/page.component.html
+++ b/src/app/pages/page/page.component.html
@@ -36,14 +36,14 @@
@if (page.nextIndex !== undefined) {
+ (click)="complete(page.data)" [disabled]="page.nextDisabled()">
Weiter
} @else {
+ routerLink="/" [disabled]="page.nextDisabled()" (click)="complete(page.data)">
Abschließen
diff --git a/src/app/pages/page/page.component.ts b/src/app/pages/page/page.component.ts
index 3f04b07..74efc42 100644
--- a/src/app/pages/page/page.component.ts
+++ b/src/app/pages/page/page.component.ts
@@ -44,7 +44,6 @@ export class PageComponent {
readonly unitIndex = +this.route.snapshot.params['unit'];
private step = 0;
- done = false;
continue!: (args: ContinueEventArgs) => void;
readonly userDataService = inject(UserDataService);
@@ -66,12 +65,11 @@ export class PageComponent {
data,
prevIndex: prev,
nextIndex: next,
+ nextDisabled: () => this.step !== page.content.length
});
}),
- tap(page => {
- this.initBreakpoints(page.content, page.slug);
- document.title = page.title + " | Why App";
- })
+ tap(page => this.continue = this.initBreakpoints(page.content, page.slug)),
+ tap(page => document.title = page.title + " | Why App")
);
private initBreakpoints(content: PageContent[], pageId: string) {
@@ -84,15 +82,14 @@ export class PageComponent {
}, [] as number[]);
next();
- this.continue = (args) => {
+ return (args: ContinueEventArgs) => {
this.userDataService.save(this.unitIndex, {
[pageId]: args.data
});
if (args.completed) {
next();
- this.done = this.step === content.length;
}
- }
+ };
}
show(index: number): 'expanded' | 'collapsed' {
@@ -108,8 +105,4 @@ export class PageComponent {
}
});
}
-
- get disabled() {
- return !this.done;
- }
}
diff --git a/src/app/services/user-data.service.spec.ts b/src/app/services/user-data.service.spec.ts
index 7f69121..ec8f23d 100644
--- a/src/app/services/user-data.service.spec.ts
+++ b/src/app/services/user-data.service.spec.ts
@@ -2,42 +2,22 @@ import { TestBed } from '@angular/core/testing';
import { UserDataService, localKey } from './user-data.service';
-function createMockStorage() {
- let storage: Record = {};
- return {
- setItem(key: string, value: string) {
- storage[key] = value || '';
- },
- getItem(key: string) {
- return key in storage ? storage[key] : null;
- },
- clear() {
- storage = {};
- },
- removeItem(key: string) {
- delete storage[key];
- },
- get length() {
- return Object.keys(storage).length;
- },
- } as unknown as Storage;
-}
-
describe('UserDataService', () => {
let service: UserDataService;
- const initialData = { 0: { name: 'John Doe' } };
+ let localStore: Record = {};
+ const initialData: Record = { name: 'John Doe' };
beforeEach(() => {
TestBed.configureTestingModule({
- providers: [
- UserDataService,
- { provide: 'localStorage', useValue: createMockStorage() }
- ]
+ providers: [UserDataService]
});
+ spyOn(window.localStorage, 'getItem').and.callFake((key) => key in localStore ? localStore[key] : null);
+ spyOn(window.localStorage, 'setItem').and.callFake((key, value) => (localStore[key] = value + ''));
+ spyOn(window.localStorage, 'clear').and.callFake(() => (localStore = {}));
+ window.localStorage.setItem(localKey, JSON.stringify({ 0: initialData }));
+
service = TestBed.inject(UserDataService<{}>);
- localStorage.clear();
- localStorage.setItem(localKey, JSON.stringify(initialData));
});
it('should be created', () => {
@@ -45,33 +25,45 @@ describe('UserDataService', () => {
});
it('should contain initial data', () => {
- expect(service.userData()).toEqual(initialData);
+ expect(service.userData()).toEqual({ 0: initialData });
});
it('should get initial entry', () => {
- expect(service.getEntry(0)).toEqual(initialData[0]);
+ expect(service.getEntry(0)).toEqual(initialData);
+ });
+
+ it('should append new entry', () => {
+ // Arrange
+ const newData = { name: 'Jane Doe' };
+
+ // Act
+ service.save(1, newData);
+
+ // Assert
+ expect(service.getEntry(1)).toEqual(newData);
+ expect(service.getEntry(0)).toEqual(initialData);
});
- it('should add new data without overwriting existing data', () => {
+ it('should append new property', () => {
// Arrange
- const newData = { 1: { name: 'Jane Doe' } };
+ const newData = { color: 'purple' };
// Act
- service.save(1, newData[1]);
+ service.save(0, newData);
// Assert
- expect(service.getEntry(1)).toEqual(newData[1]);
- expect(service.getEntry(0)).toEqual(initialData[0]);
+ expect(service.getEntry(0)['color']).toEqual(newData['color']);
+ expect(service.getEntry(0)['name']).toEqual(initialData['name']);
});
- it('should overwrite data if the same id is used', () => {
+ it('should update existing entry', () => {
// Arrange
- const updatedData = { 1: { name: 'Jane Doe' } };
+ const updatedData = { name: 'Jane Doe' };
// Act
- service.save(1, updatedData[1]);
+ service.save(0, updatedData);
// Assert
- expect(service.getEntry(1)).toEqual(updatedData[1]);
+ expect(service.getEntry(0)).toEqual(updatedData);
});
});
diff --git a/src/app/services/user-data.service.ts b/src/app/services/user-data.service.ts
index e328386..580e2fb 100644
--- a/src/app/services/user-data.service.ts
+++ b/src/app/services/user-data.service.ts
@@ -35,12 +35,14 @@ export class UserDataService {
}
save(id: number | string, data: Record) {
- const obj = {
- ...this.userData(),
- [id]: data
- };
- this.userData.set(obj);
- localStorage.setItem(localKey, JSON.stringify(obj));
+ this.userData.update(obj => ({
+ ...obj,
+ [id]: {
+ ...obj[id],
+ ...data
+ }
+ }));
+ localStorage.setItem(localKey, JSON.stringify(this.userData()));
}
clear() {