Better type checks.

src/Squidex/app/features/content/shared/assets-editor.component.ts

@@ -48,20 +48,24 @@ export class AssetsEditorComponent implements ControlValueAccessor {
     ) {
     }
 
-    public writeValue(value: string[]) {
-        if (Types.isArrayOfString(value) && !Types.isEquals(value, this.oldAssets.map(x => x.id).values)) {
-            const assetIds: string[] = value;
-
-            this.assetsService.getAssets(this.appsState.appName, 0, 0, undefined, value)
-                .subscribe(dtos => {
-                    this.oldAssets = ImmutableArray.of(assetIds.map(id => dtos.items.find(x => x.id === id)).filter(a => !!a).map(a => a!));
-
-                    if (this.oldAssets.length !== assetIds.length) {
-                        this.updateValue();
-                    }
-                }, () => {
-                    this.oldAssets = ImmutableArray.empty<AssetDto>();
-                });
+    public writeValue(obj: any) {
+        if (Types.isArrayOfString(obj)) {
+            if (!Types.isEquals(obj, this.oldAssets.map(x => x.id).values)) {
+                const assetIds: string[] = obj;
+
+                this.assetsService.getAssets(this.appsState.appName, 0, 0, undefined, obj)
+                    .subscribe(dtos => {
+                        this.oldAssets = ImmutableArray.of(assetIds.map(id => dtos.items.find(x => x.id === id)).filter(a => !!a).map(a => a!));
+
+                        if (this.oldAssets.length !== assetIds.length) {
+                            this.updateValue();
+                        }
+                    }, () => {
+                        this.oldAssets = ImmutableArray.empty();
+                    });
+            }
+        } else {
+            this.oldAssets = ImmutableArray.empty();
         }
     }
 

src/Squidex/app/features/content/shared/references-editor.component.ts

@@ -77,20 +77,24 @@ export class ReferencesEditorComponent implements ControlValueAccessor, OnInit {
             });
     }
 
-    public writeValue(value: string[]) {
-        if (Types.isArrayOfString(value) && !Types.isEquals(value, this.contentItems.map(x => x.id).values)) {
-            const contentIds: string[] = value;
-
-            this.contentsService.getContents(this.appsState.appName, this.schemaId, 10000, 0, undefined, contentIds)
-                .subscribe(dtos => {
-                    this.contentItems = ImmutableArray.of(contentIds.map(id => dtos.items.find(c => c.id === id)).filter(r => !!r).map(r => r!));
-
-                    if (this.contentItems.length !== contentIds.length) {
-                        this.updateValue();
-                    }
-                }, () => {
-                    this.contentItems = ImmutableArray.empty<ContentDto>();
-                });
+    public writeValue(obj: any) {
+        if (Types.isArrayOfString(obj)) {
+            if (!Types.isEquals(obj, this.contentItems.map(x => x.id).values)) {
+                const contentIds: string[] = obj;
+
+                this.contentsService.getContents(this.appsState.appName, this.schemaId, 10000, 0, undefined, contentIds)
+                    .subscribe(dtos => {
+                        this.contentItems = ImmutableArray.of(contentIds.map(id => dtos.items.find(c => c.id === id)).filter(r => !!r).map(r => r!));
+
+                        if (this.contentItems.length !== contentIds.length) {
+                            this.updateValue();
+                        }
+                    }, () => {
+                        this.contentItems = ImmutableArray.empty();
+                    });
+            }
+        } else {
+            this.contentItems = ImmutableArray.empty();
         }
     }
 

src/Squidex/app/framework/angular/forms/autocomplete.component.ts

@@ -104,14 +104,14 @@ export class AutocompleteComponent implements ControlValueAccessor, OnDestroy, O
         return true;
     }
 
-    public writeValue(value: any) {
-        if (!value) {
+    public writeValue(obj: any) {
+        if (!obj) {
             this.resetForm();
         } else {
-            const item = this.items.find(i => i === value);
+            const item = this.items.find(i => i === obj);
 
             if (item) {
-                this.queryInput.setValue(value.title || '');
+                this.queryInput.setValue(obj.title || '');
             }
         }
 

src/Squidex/app/framework/angular/forms/date-time-editor.component.ts

@@ -89,18 +89,18 @@ export class DateTimeEditorComponent implements ControlValueAccessor, OnDestroy,
             });
     }
 
-    public writeValue(value: string) {
-        if (!Types.isString(value) || value.length === 0) {
-            this.timeValue = null;
-            this.dateValue = null;
-        } else {
-            const parsed = moment.parseZone(value);
+    public writeValue(obj: any) {
+        if (Types.isString(obj) && obj.length > 0) {
+            const parsed = moment.parseZone(obj);
 
             this.dateValue = moment(parsed);
 
             if (this.showTime) {
                 this.timeValue = moment(parsed);
             }
+        } else {
+            this.timeValue = null;
+            this.dateValue = null;
         }
 
         this.updateControls();

src/Squidex/app/framework/angular/forms/dropdown.component.ts

@@ -59,8 +59,8 @@ export class DropdownComponent implements AfterContentInit, ControlValueAccessor
         }
     }
 
-    public writeValue(value: any) {
-        this.selectIndex(this.items && value ? this.items.indexOf(value) : 0);
+    public writeValue(obj: any) {
+        this.selectIndex(this.items && obj ? this.items.indexOf(obj) : 0);
     }
 
     public setDisabledState(isDisabled: boolean): void {

src/Squidex/app/framework/angular/forms/iframe-editor.component.ts

@@ -27,7 +27,6 @@ export class IFrameEditorComponent implements ControlValueAccessor, AfterViewIni
     private callChange = (v: any) => { /* NOOP */ };
     private callTouched = () => { /* NOOP */ };
     private value: any;
-    private valueJson: string;
     private isDisabled = false;
     private isInitialized = false;
     private plugin: HTMLIFrameElement;
@@ -72,10 +71,7 @@ export class IFrameEditorComponent implements ControlValueAccessor, AfterViewIni
                     } else if (type === 'valueChanged') {
                         const { value } = event.data;
 
-                        const valueJson = JSON.stringify(value);
-
-                        if (this.valueJson !== valueJson) {
-                            this.valueJson = valueJson;
+                        if (!Types.jsJsonEquals(this.value, value)) {
                             this.value = value;
 
                             this.callChange(value);
@@ -91,9 +87,8 @@ export class IFrameEditorComponent implements ControlValueAccessor, AfterViewIni
         return this.sanitizer.bypassSecurityTrustResourceUrl(this.url);
     }
 
-    public writeValue(value: any) {
-        this.value = value;
-        this.valueJson = JSON.stringify(value);
+    public writeValue(obj: any) {
+        this.value = obj;
 
         if (this.isInitialized && this.plugin.contentWindow && Types.isFunction(this.plugin.contentWindow.postMessage)) {
             this.plugin.contentWindow.postMessage({ type: 'valueChanged', value: this.value }, '*');

src/Squidex/app/framework/angular/forms/indeterminate-value.directive.ts

@@ -38,13 +38,13 @@ export class IndeterminateValueDirective implements ControlValueAccessor {
         this.callTouched();
     }
 
-    public writeValue(value: boolean | number | undefined) {
-        if (!Types.isBoolean(value)) {
+    public writeValue(obj: any) {
+        if (!Types.isBoolean(obj)) {
             this.renderer.setProperty(this.element.nativeElement, 'indeterminate', true);
             this.renderer.setProperty(this.element.nativeElement, 'checked', false);
         } else {
             this.renderer.setProperty(this.element.nativeElement, 'indeterminate', false);
-            this.renderer.setProperty(this.element.nativeElement, 'checked', value);
+            this.renderer.setProperty(this.element.nativeElement, 'checked', obj);
         }
     }
 

src/Squidex/app/framework/angular/forms/jscript-editor.component.ts

@@ -9,7 +9,7 @@ import { AfterViewInit, Component, ElementRef, forwardRef, ViewChild } from '@an
 import { ControlValueAccessor,  NG_VALUE_ACCESSOR } from '@angular/forms';
 import { Subject } from 'rxjs';
 
-import { ResourceLoaderService, Types } from '@app/framework/internal';
+import { ResourceLoaderService } from '@app/framework/internal';
 
 declare var ace: any;
 
@@ -39,8 +39,8 @@ export class JscriptEditorComponent implements ControlValueAccessor, AfterViewIn
     ) {
     }
 
-    public writeValue(value: string) {
-        this.value = Types.isString(value) ? value : '';
+    public writeValue(obj: any) {
+        this.value = obj + '';
 
         if (this.aceEditor) {
             this.setValue(this.value);

src/Squidex/app/framework/angular/forms/json-editor.component.ts

@@ -40,17 +40,17 @@ export class JsonEditorComponent implements ControlValueAccessor, AfterViewInit
     ) {
     }
 
-    public writeValue(value: any) {
-        this.value = value;
+    public writeValue(obj: any) {
+        this.value = obj;
 
         try {
-            this.valueString = JSON.stringify(value);
+            this.valueString = JSON.stringify(obj);
         } catch (e) {
             this.valueString = '';
         }
 
         if (this.aceEditor) {
-            this.setValue(value);
+            this.setValue(obj);
         }
     }
 

src/Squidex/app/framework/angular/forms/slider.component.ts

@@ -49,8 +49,8 @@ export class SliderComponent implements ControlValueAccessor {
 
     constructor(private readonly renderer: Renderer2) { }
 
-    public writeValue(value: number) {
-        this.lastValue = this.value = Types.isNumber(value) ? value : 0;
+    public writeValue(obj: any) {
+        this.lastValue = this.value = Types.isNumber(obj) ? obj : 0;
 
         this.updateThumbPosition();
     }

src/Squidex/app/framework/angular/forms/stars.component.ts

@@ -51,13 +51,8 @@ export class StarsComponent implements ControlValueAccessor {
 
     public value: number | null = 1;
 
-    public writeValue(value: number | null | undefined) {
-        if (Types.isNumber(value)) {
-            this.value = this.stars = value || 0;
-        } else {
-            this.value = null;
-            this.stars = 0;
-        }
+    public writeValue(obj: any) {
+        this.value = this.stars = Types.isNumber(obj) ? obj : 0;
     }
 
     public setDisabledState(isDisabled: boolean): void {

src/Squidex/app/framework/angular/forms/tag-editor.component.ts

@@ -88,11 +88,11 @@ export class TagEditorComponent implements ControlValueAccessor {
 
     public addInput = new FormControl();
 
-    public writeValue(value: any[]) {
+    public writeValue(obj: any) {
         this.resetForm();
 
-        if (this.converter && Types.isArrayOf(value, v => this.converter.isValidValue(v))) {
-            this.items = value;
+        if (this.converter && Types.isArrayOf(obj, v => this.converter.isValidValue(v))) {
+            this.items = obj;
         } else {
             this.items = [];
         }

src/Squidex/app/framework/angular/forms/toggle.component.ts

@@ -24,11 +24,11 @@ export class ToggleComponent implements ControlValueAccessor {
     private callChange = (v: any) => { /* NOOP */ };
     private callTouched = () => { /* NOOP */ };
 
-    public isChecked: boolean | null | undefined = null;
+    public isChecked: boolean | null = null;
     public isDisabled = false;
 
-    public writeValue(value: boolean | null | undefined) {
-        this.isChecked = Types.isBoolean(value) ? value : null;
+    public writeValue(obj: any) {
+        this.isChecked = Types.isBoolean(obj) ? obj : null;
     }
 
     public setDisabledState(isDisabled: boolean): void {

src/Squidex/app/framework/angular/forms/transform-input.directive.ts

@@ -70,8 +70,8 @@ export class TransformInputDirective implements ControlValueAccessor {
         this.callTouched();
     }
 
-    public writeValue(value: string) {
-        const normalizedValue = this.transformValue(value);
+    public writeValue(obj: any) {
+        const normalizedValue = this.transformValue(obj + '');
 
         this.renderer.setProperty(this.element.nativeElement, 'value', normalizedValue);
     }

src/Squidex/app/framework/utils/types.spec.ts

@@ -8,6 +8,13 @@
 import { Types } from './types';
 
 describe('Types', () => {
+    it('should calculate hash string', () => {
+        expect(Types.hash(null)).toBe('null');
+        expect(Types.hash(undefined)).toBe(undefined);
+
+        expect(Types.hash(new RegExp('.*'))).toEqual('{}');
+    });
+
     it('should make string check', () => {
         expect(Types.isString('')).toBeTruthy();
         expect(Types.isString('string')).toBeTruthy();
@@ -95,6 +102,12 @@ describe('Types', () => {
 
         expect(Types.is(1, MyClass)).toBeFalsy();
     });
+
+    it('should make json equals check', () => {
+        expect(Types.jsJsonEquals({ a: 1, b: 2 }, { a: 1, b: 2 })).toBeTruthy();
+
+        expect(Types.jsJsonEquals({ a: 1, b: 2 }, { b: 2, a: 1 })).toBeFalsy();
+    });
 });
 
 class MyClass {

src/Squidex/app/framework/utils/types.ts

@@ -6,6 +6,14 @@
  */
 
 export module Types {
+    export function hash(value: any): string {
+        try {
+            return JSON.stringify(value);
+        } catch (e) {
+            return '';
+        }
+    }
+
     export function isString(value: any): value is string {
         return typeof value === 'string' || value instanceof String;
     }
@@ -72,6 +80,10 @@ export module Types {
         return true;
     }
 
+    export function jsJsonEquals<T>(lhs: T, rhs: T) {
+        return hash(lhs) === hash(rhs);
+    }
+
     export function isEquals<T>(lhs: T[], rhs: T[]) {
         if (!lhs && !rhs) {
             return true;

src/Squidex/app/shared/components/geolocation-editor.component.ts

@@ -76,9 +76,9 @@ export class GeolocationEditorComponent implements ControlValueAccessor, AfterVi
     ) {
     }
 
-    public writeValue(value: Geolocation) {
-        if (Types.isObject(value) && Types.isNumber(value.latitude) && Types.isNumber(value.longitude)) {
-            this.value = value;
+    public writeValue(obj: any) {
+        if (Types.isObject(obj) && Types.isNumber(obj.latitude) && Types.isNumber(obj.longitude)) {
+            this.value = obj;
         } else {
             this.value = null;
         }

src/Squidex/app/shared/components/markdown-editor.component.ts

@@ -11,8 +11,7 @@ import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
 import {
     AssetDto,
     ModalView,
-    ResourceLoaderService,
-    Types
+    ResourceLoaderService
 } from '@app/shared/internal';
 
 declare var SimpleMDE: any;
@@ -54,8 +53,8 @@ export class MarkdownEditorComponent implements ControlValueAccessor, AfterViewI
         this.resourceLoader.loadStyle('https://cdn.jsdelivr.net/simplemde/latest/simplemde.min.css');
     }
 
-    public writeValue(value: string) {
-        this.value = Types.isString(value) ? value : '';
+    public writeValue(obj: any) {
+        this.value = obj + '';
 
         if (this.simplemde) {
             this.simplemde.value(this.value);

src/Squidex/app/shared/components/rich-editor.component.ts

@@ -11,8 +11,7 @@ import { ControlValueAccessor, NG_VALUE_ACCESSOR } from '@angular/forms';
 import {
     AssetDto,
     ModalView,
-    ResourceLoaderService,
-    Types
+    ResourceLoaderService
 } from '@app/shared/internal';
 
 declare var tinymce: any;
@@ -112,8 +111,8 @@ export class RichEditorComponent implements ControlValueAccessor, AfterViewInit,
         };
     }
 
-    public writeValue(value: string) {
-        this.value = Types.isString(value) ? value : '';
+    public writeValue(obj: any) {
+        this.value = obj + '';
 
         if (this.tinyEditor) {
             this.tinyEditor.setContent(this.value);