FIX: Corrected data binding due to ng9 changes to view caching model

davidibl · Mar 31, 2020 · dde37b6 · dde37b6
1 parent 1d95e56
commit dde37b6
Show file tree

Hide file tree

Showing 7 changed files with 53 additions and 35 deletions.
diff --git a/src/app/components/dmnManager/dmnManager.html b/src/app/components/dmnManager/dmnManager.html
@@ -42,4 +42,4 @@
         <xn-iframe-tab></xn-iframe-tab>
     </xn-tab>
 </xn-tabs>
-<xn-dmn-simulator *ngIf="isDecicionTableMode$ | async" [isVisisble]="showSimulator$ | async"></xn-dmn-simulator>
+<xn-dmn-simulator *ngIf="isDecicionTableMode$ | async" [isVisible]="showSimulator$ | async"></xn-dmn-simulator>
diff --git a/src/app/components/json/jsonValueEditor.ts b/src/app/components/json/jsonValueEditor.ts
@@ -59,6 +59,7 @@ export class JsonValueEditorComponent implements OnChanges {
             this.objectSetToNull = false;
         }
         this._value = value;
+        this._changeDetector.detectChanges();
     }
 
     public get value() {

diff --git a/src/app/components/simulator/dmnSimulator.html b/src/app/components/simulator/dmnSimulator.html
@@ -1,4 +1,4 @@
-<xn-flyin *ngIf="isVisisble" [(visible)]="simulatorVisisble" [wideFlyin]="false">
+<xn-flyin *ngIf="isVisible" [(visible)]="simulatorVisible" [wideFlyin]="false">
     <div class="wrapper">
         <div class="mt-2" *ngIf="!(urlConfigured$ | async)">
             <a class="dark-gray" (click)="openSettings()">Kein Service URL konfiguriert (Einstellungen)</a>
@@ -17,7 +17,7 @@
                             [requestModel]="dataModel$ | async"
                             class="ml-05"
                             (valueChange)="onNewValueObjectCreated($event)"
-                            [value]="valueObject"></xn-json-editor>
+                            [value]="valueObject$ | async"></xn-json-editor>
             <ng-container *ngIf="simulationResult$ | async as simulationResult">
                 <div class="mt-2" *ngIf="simulationResult">
                     <h4>Ergebnis</h4>
@@ -36,10 +36,10 @@ <h4>Ergebnis</h4>
 </xn-flyin>
 <xn-levitated-button class="simulator-button pointer"
                      [default]="true"
-                     *ngIf="isVisisble"
-                     [disabled]="simulatorVisisble && !(urlConfigured$ | async)"
+                     *ngIf="isVisible"
+                     [disabled]="simulatorVisible && !(urlConfigured$ | async)"
                      [showSpinner]="currentlyTesting"
-                     [forceKeepOpen]="simulatorVisisble"
+                     [forceKeepOpen]="simulatorVisible"
                      (click)="openSimulator()">
     <i class="white fa fa-flask"></i>
     <div class="button-content white"><i class="white fa fa-flask mr-05"></i>Simulation</div>

diff --git a/src/app/components/simulator/dmnSimulator.ts b/src/app/components/simulator/dmnSimulator.ts
@@ -20,10 +20,13 @@ import { TabIds } from '../../model/tabIds';
 })
 export class DmnSimulatorComponent implements OnInit {
 
+    private readonly SESSION_NAME = 'tempObject';
+
+    private _simulatorVisible = false;
     public editorTypes = EditorType;
 
     public dataModel$: Observable<ObjectDefinition>;
-    public valueObject: Object;
+    public valueObject$ = this._sessionDataService.getValue(this.SESSION_NAME, {});
 
     public currentlyTesting = false;
 
@@ -33,17 +36,31 @@ export class DmnSimulatorComponent implements OnInit {
         .getBaseUrlSimulator().pipe(map(url => !!url));
 
     @Input()
-    public isVisisble = false;
-    public simulatorVisisble = false;
+    public isVisible = false;
+
+    public set simulatorVisible(simulatorVisible: boolean) {
+        this._simulatorVisible = simulatorVisible;
+        if (simulatorVisible) {
+            this.valueObject$
+                .pipe(take(1), map(value => Object.assign({}, value)))
+                .subscribe(value => this._sessionDataService.setValue(this.SESSION_NAME, value));
+        }
+    }
+
+    public get simulatorVisible() {
+        return this._simulatorVisible;
+    }
 
     public simulationResult$: Observable<DecisionSimulationResult>;
     public responseModel$: Observable<ObjectDefinition>;
 
-    public constructor(private _dataModelService: DataModelService,
-                       private _sessionDataService: SessionDataService,
-                       private _testDecisionService: TestDecisionService,
-                       private _eventService: EventService,
-                       private _appConfigurationService: AppConfigurationService) {}
+    public constructor(
+        private _dataModelService: DataModelService,
+        private _sessionDataService: SessionDataService,
+        private _testDecisionService: TestDecisionService,
+        private _eventService: EventService,
+        private _appConfigurationService: AppConfigurationService,
+    ) {}
 
     public ngOnInit() {
         this.dataModel$ = this._dataModelService.getDataModel();
@@ -58,44 +75,43 @@ export class DmnSimulatorComponent implements OnInit {
     public simulate() {
 
         this.currentlyTesting = true;
-        this._testDecisionService.simulateDecision(this.valueObject);
+        this.valueObject$
+            .pipe(take(1))
+            .subscribe(value => this._testDecisionService.simulateDecision(value));
     }
 
     public reset() {
         this._testDecisionService.resetTest();
-        this.valueObject = {};
+        this._sessionDataService.setValue('tempObject', null);
     }
 
     public setShowHitsOnly(showHitsOnly: boolean) {
         this._testDecisionService.setShowHitsOnly(showHitsOnly);
     }
 
     public openSimulator() {
-        if (this.simulatorVisisble) {
+        if (this.simulatorVisible) {
             this.simulate();
             return;
         }
-        this._sessionDataService
-            .getValue('tempObject', {})
-            .pipe(
-                take(1)
-            )
-            .subscribe(value => this.valueObject = (value) ? value : {});
-        this.simulatorVisisble = true;
+        this.simulatorVisible = true;
     }
 
     public onNewValueObjectCreated(value: Object) {
-        this.valueObject = value;
-        this._sessionDataService.setValue('tempObject', this.valueObject);
+        this._sessionDataService.setValue(this.SESSION_NAME, value);
     }
 
     public takeAsTest(expectedResultData: Object[]) {
-        const newTestData = {
-            testdata: JSON.parse(JSON.stringify(this.valueObject)),
-            expectedResult: expectedResultData
-        };
-        const ev = new BaseEvent('newTest', newTestData);
-        this._eventService.publishEvent(ev);
+        this.valueObject$
+            .pipe(take(1))
+            .subscribe(value => {
+                const newTestData = {
+                    testdata: JSON.parse(JSON.stringify(value)),
+                    expectedResult: expectedResultData
+                };
+                const ev = new BaseEvent(EventType.NEW_TEST, newTestData);
+                this._eventService.publishEvent(ev);
+            });
     }
 
     public openSettings() {

diff --git a/src/app/model/event/eventType.ts b/src/app/model/event/eventType.ts
@@ -21,4 +21,5 @@ export class EventType {
     static XML_LOADED = 'xmlLoaded';
     static JUMP_TO_HINT = 'jumpToHint';
     static CLEAR_HINT = 'clearHint';
+    static NEW_TEST: 'newTest';
 }
diff --git a/src/app/services/sessionDataService.ts b/src/app/services/sessionDataService.ts
@@ -1,7 +1,7 @@
 import { Injectable } from '@angular/core';
 import { ReplaySubject, BehaviorSubject, Subject, merge } from 'rxjs';
 import { EventService } from './eventService';
-import { map, take, switchMap } from 'rxjs/operators';
+import { map, take, switchMap, shareReplay } from 'rxjs/operators';
 import { NewViewEvent } from '../model/event/newViewEvent';
 import { EventType } from '../model/event/eventType';
 import { RenameArtefactEvent } from '../model/event/renameArtefactEvent';
@@ -19,7 +19,7 @@ export class SessionDataService {
         this._eventService
             .getEvent<RenameArtefactEvent>((ev) => ev.type === EventType.RENAME_ARTEFACT)
             .pipe(map(event => event.data.newArtefactId))
-    );
+    ).pipe(shareReplay(1));
 
     public constructor(
         private _eventService: EventService,

diff --git a/src/app/services/testSuiteService.ts b/src/app/services/testSuiteService.ts
@@ -19,7 +19,7 @@ export class TestSuiteService {
 
     public constructor(private _eventService: EventService) {
         this._eventService
-            .getEvent((ev) => ev.type === 'newTest')
+            .getEvent((ev) => ev.type === EventType.NEW_TEST)
             .subscribe(event => {
                 this.addTestCase(event.data.testdata, event.data.expectedResult);
             });