From 433d192b70efa3f593e05352974d68b59007e5f3 Mon Sep 17 00:00:00 2001 From: Denys Vuika Date: Mon, 26 Sep 2016 15:20:33 +0100 Subject: [PATCH 1/3] #814 fix MDL issues - additional workarounds for Material Design Lite problems - validation fixes fixes #814 --- .../widgets/core/form-field-validator.ts | 2 +- .../functional-group.widget.spec.ts | 2 +- .../functional-group.widget.ts | 20 ++++++++++++++-- .../multiline-text/multiline-text.widget.ts | 24 +++++++++++++++++-- .../widgets/number/number.widget.ts | 21 ++++++++++++++-- .../widgets/people/people.widget.spec.ts | 2 +- .../widgets/people/people.widget.ts | 20 ++++++++++++++-- .../components/widgets/text/text.widget.ts | 24 +++++++++++++++++-- .../widgets/widget.component.spec.ts | 4 +--- .../components/widgets/widget.component.ts | 14 +++++++---- 10 files changed, 113 insertions(+), 20 deletions(-) diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-validator.ts b/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-validator.ts index 3d9871b7b3..7a483c1294 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-validator.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/core/form-field-validator.ts @@ -65,7 +65,7 @@ export class RequiredFieldValidator implements FormFieldValidator { return field.value && field.value.length > 0; } - if (!field.value) { + if (field.value === null || field.value === undefined || field.value === '') { return false; } } diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/functional-group/functional-group.widget.spec.ts b/ng2-components/ng2-activiti-form/src/components/widgets/functional-group/functional-group.widget.spec.ts index 4a2a976fcf..3f054e9e91 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/functional-group/functional-group.widget.spec.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/functional-group/functional-group.widget.spec.ts @@ -29,7 +29,7 @@ describe('FunctionalGroupWidget', () => { beforeEach(() => { formService = new FormService(null, null); - widget = new FunctionalGroupWidget(formService); + widget = new FunctionalGroupWidget(formService, null); widget.field = new FormFieldModel(new FormModel()); }); diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/functional-group/functional-group.widget.ts b/ng2-components/ng2-activiti-form/src/components/widgets/functional-group/functional-group.widget.ts index 1220de01ef..4f91ac5864 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/functional-group/functional-group.widget.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/functional-group/functional-group.widget.ts @@ -15,7 +15,7 @@ * limitations under the License. */ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, ElementRef } from '@angular/core'; import { WidgetComponent } from './../widget.component'; import { FormService } from '../../../services/form.service'; import { GroupModel } from './../core/group.model'; @@ -36,7 +36,8 @@ export class FunctionalGroupWidget extends WidgetComponent implements OnInit { minTermLength: number = 1; groupId: string; - constructor(private formService: FormService) { + constructor(private formService: FormService, + private elementRef: ElementRef) { super(); } @@ -108,4 +109,19 @@ export class FunctionalGroupWidget extends WidgetComponent implements OnInit { event.preventDefault(); } } + + setupMaterialComponents(handler: any): boolean { + // workaround for MDL issues with dynamic components + if (handler) { + handler.upgradeAllRegistered(); + if (this.elementRef && this.value) { + let container = this.elementRef.nativeElement.querySelector('.mdl-textfield'); + if (container) { + container.MaterialTextfield.change(this.value); + } + } + return true; + } + return false; + } } diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/multiline-text/multiline-text.widget.ts b/ng2-components/ng2-activiti-form/src/components/widgets/multiline-text/multiline-text.widget.ts index d269746c80..efdcbe1842 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/multiline-text/multiline-text.widget.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/multiline-text/multiline-text.widget.ts @@ -15,11 +15,10 @@ * limitations under the License. */ -import { Component } from '@angular/core'; +import { Component, ElementRef } from '@angular/core'; import { WidgetComponent } from './../widget.component'; declare let __moduleName: string; -declare var componentHandler; @Component({ moduleId: __moduleName, @@ -29,4 +28,25 @@ declare var componentHandler; }) export class MultilineTextWidget extends WidgetComponent { + constructor(private elementRef: ElementRef) { + super(); + } + + setupMaterialComponents(handler: any): boolean { + // workaround for MDL issues with dynamic components + if (handler) { + handler.upgradeAllRegistered(); + if (this.elementRef && this.hasValue()) { + let el = this.elementRef.nativeElement; + let container = el.querySelector('.mdl-textfield'); + if (container) { + container.MaterialTextfield.change(this.field.value); + } + } + + return true; + } + return false; + } + } diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/number/number.widget.ts b/ng2-components/ng2-activiti-form/src/components/widgets/number/number.widget.ts index cf4170ae1a..df7ede255c 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/number/number.widget.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/number/number.widget.ts @@ -15,11 +15,10 @@ * limitations under the License. */ -import { Component } from '@angular/core'; +import { Component, ElementRef } from '@angular/core'; import { WidgetComponent } from './../widget.component'; declare let __moduleName: string; -declare var componentHandler; @Component({ moduleId: __moduleName, @@ -29,4 +28,22 @@ declare var componentHandler; }) export class NumberWidget extends WidgetComponent { + constructor(private elementRef: ElementRef) { + super(); + } + + setupMaterialComponents(handler: any): boolean { + // workaround for MDL issues with dynamic components + if (handler) { + handler.upgradeAllRegistered(); + if (this.elementRef && this.hasValue()) { + let container = this.elementRef.nativeElement.querySelector('.mdl-textfield'); + if (container) { + container.MaterialTextfield.change(this.field.value.toString()); + } + } + return true; + } + return false; + } } diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/people/people.widget.spec.ts b/ng2-components/ng2-activiti-form/src/components/widgets/people/people.widget.spec.ts index 54c657edcb..5ca78d6b2a 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/people/people.widget.spec.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/people/people.widget.spec.ts @@ -29,7 +29,7 @@ describe('PeopleWidget', () => { beforeEach(() => { formService = new FormService(null, null); - widget = new PeopleWidget(formService); + widget = new PeopleWidget(formService, null); widget.field = new FormFieldModel(new FormModel()); }); diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/people/people.widget.ts b/ng2-components/ng2-activiti-form/src/components/widgets/people/people.widget.ts index 4a0c4cbe52..b7060c554b 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/people/people.widget.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/people/people.widget.ts @@ -15,7 +15,7 @@ * limitations under the License. */ -import { Component, OnInit } from '@angular/core'; +import { Component, OnInit, ElementRef } from '@angular/core'; import { WidgetComponent } from './../widget.component'; import { FormService } from '../../../services/form.service'; import { GroupModel } from '../core/group.model'; @@ -37,7 +37,8 @@ export class PeopleWidget extends WidgetComponent implements OnInit { users: GroupUserModel[] = []; groupId: string; - constructor(private formService: FormService) { + constructor(private formService: FormService, + private elementRef: ElementRef) { super(); } @@ -121,4 +122,19 @@ export class PeopleWidget extends WidgetComponent implements OnInit { event.preventDefault(); } } + + setupMaterialComponents(handler: any): boolean { + // workaround for MDL issues with dynamic components + if (handler) { + handler.upgradeAllRegistered(); + if (this.elementRef && this.value) { + let container = this.elementRef.nativeElement.querySelector('.mdl-textfield'); + if (container) { + container.MaterialTextfield.change(this.value); + } + } + return true; + } + return false; + } } diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/text/text.widget.ts b/ng2-components/ng2-activiti-form/src/components/widgets/text/text.widget.ts index 44fc7c8494..2f79764a20 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/text/text.widget.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/text/text.widget.ts @@ -15,11 +15,10 @@ * limitations under the License. */ -import { Component } from '@angular/core'; +import { Component, ElementRef } from '@angular/core'; import { WidgetComponent } from './../widget.component'; declare let __moduleName: string; -declare var componentHandler; @Component({ moduleId: __moduleName, @@ -29,4 +28,25 @@ declare var componentHandler; }) export class TextWidget extends WidgetComponent { + constructor(private elementRef: ElementRef) { + super(); + } + + setupMaterialComponents(componentHandler: any): boolean { + // workaround for MDL issues with dynamic components + if (componentHandler) { + componentHandler.upgradeAllRegistered(); + if (this.elementRef && this.hasValue()) { + let el = this.elementRef.nativeElement; + let container = el.querySelector('.mdl-textfield'); + if (container) { + container.MaterialTextfield.change(this.field.value); + } + } + + return true; + } + return false; + } + } diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/widget.component.spec.ts b/ng2-components/ng2-activiti-form/src/components/widgets/widget.component.spec.ts index d926d28417..69ce18b6f1 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/widget.component.spec.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/widget.component.spec.ts @@ -39,9 +39,7 @@ describe('WidgetComponent', () => { it('should setup MDL content only if component handler available', () => { let component = new WidgetComponent(); - expect(component.setupMaterialComponents()).toBeTruthy(); - - window['componentHandler'] = null; + expect(component.setupMaterialComponents(componentHandler)).toBeTruthy(); expect(component.setupMaterialComponents()).toBeFalsy(); }); diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/widget.component.ts b/ng2-components/ng2-activiti-form/src/components/widgets/widget.component.ts index 6bdaa17faa..0d7fbe3abd 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/widget.component.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/widget.component.ts @@ -43,15 +43,21 @@ export class WidgetComponent implements AfterViewInit { return null; } + hasValue(): boolean { + return this.field && + this.field.value !== null && + this.field.value !== undefined; + } + ngAfterViewInit() { - this.setupMaterialComponents(); + this.setupMaterialComponents(componentHandler); this.fieldChanged.emit(this.field); } - setupMaterialComponents(): boolean { + setupMaterialComponents(handler?: any): boolean { // workaround for MDL issues with dynamic components - if (componentHandler) { - componentHandler.upgradeAllRegistered(); + if (handler) { + handler.upgradeAllRegistered(); return true; } return false; From 75fca80c1fae54daa21b7435c2f913d08cbd1024 Mon Sep 17 00:00:00 2001 From: Denys Vuika Date: Mon, 26 Sep 2016 15:33:39 +0100 Subject: [PATCH 2/3] Fix unit tests (for js-api 0.3.3) --- .../src/data/share-datatable-adapter.spec.ts | 8 ++++---- .../src/models/document-library.model.ts | 4 ++-- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.spec.ts b/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.spec.ts index 27b44401a7..ba2669ab84 100644 --- a/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.spec.ts +++ b/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.spec.ts @@ -130,7 +130,7 @@ describe('ShareDataTableAdapter', () => { }); it('should covert cell value to formatted date', () => { - let rawValue = new Date(2015, 6, 15, 21, 43, 11).toString(); // Wed Jul 15 2015 21:43:11 GMT+0100 (BST); + let rawValue = new Date(2015, 6, 15, 21, 43, 11); // Wed Jul 15 2015 21:43:11 GMT+0100 (BST); let dateValue = 'Jul 15, 2015, 9:43:11 PM'; let file = new FileNode(); @@ -150,7 +150,7 @@ describe('ShareDataTableAdapter', () => { }); it('should use default date format as fallback', () => { - let rawValue = new Date(2015, 6, 15, 21, 43, 11).toString(); // Wed Jul 15 2015 21:43:11 GMT+0100 (BST); + let rawValue = new Date(2015, 6, 15, 21, 43, 11); // Wed Jul 15 2015 21:43:11 GMT+0100 (BST); let dateValue = 'Jul 15, 2015, 9:43:11 PM'; let file = new FileNode(); @@ -170,7 +170,7 @@ describe('ShareDataTableAdapter', () => { }); it('should return date value as string', () => { - let rawValue = new Date(2015, 6, 15, 21, 43, 11).toString(); // Wed Jul 15 2015 21:43:11 GMT+0100 (BST); + let rawValue = new Date(2015, 6, 15, 21, 43, 11); // Wed Jul 15 2015 21:43:11 GMT+0100 (BST); let file = new FileNode(); file.entry.createdAt = rawValue; @@ -188,7 +188,7 @@ describe('ShareDataTableAdapter', () => { }); it('should log error when having date conversion issues', () => { - let dateValue = '[wrong-date]'; + let dateValue = null; let file = new FileNode(); file.entry.createdAt = dateValue; diff --git a/ng2-components/ng2-alfresco-documentlist/src/models/document-library.model.ts b/ng2-components/ng2-alfresco-documentlist/src/models/document-library.model.ts index 1ef4ddd54d..8cb6aa449d 100644 --- a/ng2-components/ng2-alfresco-documentlist/src/models/document-library.model.ts +++ b/ng2-components/ng2-alfresco-documentlist/src/models/document-library.model.ts @@ -47,9 +47,9 @@ export class MinimalNodeEntryEntity { nodeType: string; isFolder: boolean; isFile: boolean; - modifiedAt: string; + modifiedAt: Date; modifiedByUser: UserInfo; - createdAt: string; + createdAt: Date; createdByUser: UserInfo; content: ContentInfo; path: PathInfoEntity; From b372c4ecdcb1ca8352475a07489497c1668e8a5d Mon Sep 17 00:00:00 2001 From: Denys Vuika Date: Mon, 26 Sep 2016 15:43:00 +0100 Subject: [PATCH 3/3] Unit test fixes --- .../src/data/share-datatable-adapter.spec.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.spec.ts b/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.spec.ts index ba2669ab84..b35fe0a43b 100644 --- a/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.spec.ts +++ b/ng2-components/ng2-alfresco-documentlist/src/data/share-datatable-adapter.spec.ts @@ -188,7 +188,7 @@ describe('ShareDataTableAdapter', () => { }); it('should log error when having date conversion issues', () => { - let dateValue = null; + let dateValue = {}; let file = new FileNode(); file.entry.createdAt = dateValue;