From 1629a99911dde17ddfbd311a6c5db9b42abeb633 Mon Sep 17 00:00:00 2001 From: siva kumar Date: Thu, 28 Sep 2017 23:49:39 +0530 Subject: [PATCH] [ADF-1608] Start Form - Improve the unit test cases. (#2390) * * Covered more test case scenarios for start-form component * [ADF-1608] Start Form - Improve the unit test cases. * Refactored start-form.component.spec.ts * Covered more test case scenarios for start-form component --- .../src/assets/entry-module.mock.ts | 42 + .../src/assets/start-form.component.mock.ts | 1009 +++++++++++++++++ .../components/start-form.component.spec.ts | 327 +++++- 3 files changed, 1376 insertions(+), 2 deletions(-) create mode 100644 ng2-components/ng2-activiti-form/src/assets/entry-module.mock.ts create mode 100644 ng2-components/ng2-activiti-form/src/assets/start-form.component.mock.ts diff --git a/ng2-components/ng2-activiti-form/src/assets/entry-module.mock.ts b/ng2-components/ng2-activiti-form/src/assets/entry-module.mock.ts new file mode 100644 index 0000000000..8366cd8ef2 --- /dev/null +++ b/ng2-components/ng2-activiti-form/src/assets/entry-module.mock.ts @@ -0,0 +1,42 @@ +/*! + * @license + * Copyright 2016 Alfresco Software, Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +import { NgModule } from '@angular/core'; +import { +AmountWidgetComponent, +ContainerWidgetComponent, +DateWidgetComponent, +DropdownWidgetComponent, +NumberWidgetComponent, +RadioButtonsWidgetComponent, +TextWidgetComponent +} from '../components/widgets/index'; + +@NgModule({ + declarations: [], + entryComponents: [ + ContainerWidgetComponent, + TextWidgetComponent, + NumberWidgetComponent, + DateWidgetComponent, + DropdownWidgetComponent, + RadioButtonsWidgetComponent, + AmountWidgetComponent + ] +}) + +export class EntryComponenteMockModule {} diff --git a/ng2-components/ng2-activiti-form/src/assets/start-form.component.mock.ts b/ng2-components/ng2-activiti-form/src/assets/start-form.component.mock.ts new file mode 100644 index 0000000000..f7848e89ae --- /dev/null +++ b/ng2-components/ng2-activiti-form/src/assets/start-form.component.mock.ts @@ -0,0 +1,1009 @@ +/*! + * @license + * Copyright 2016 Alfresco Software, Ltd. + * + * Licensed under the Apache License, Version 2.0 (the "License"); + * you may not use this file except in compliance with the License. + * You may obtain a copy of the License at + * + * http://www.apache.org/licenses/LICENSE-2.0 + * + * Unless required by applicable law or agreed to in writing, software + * distributed under the License is distributed on an "AS IS" BASIS, + * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. + * See the License for the specific language governing permissions and + * limitations under the License. + */ + +export let startFormDateWidgetMock = { + id: 4, + name: 'Claim Review Process', + processDefinitionId: 'ClaimReviewProcess:2: 93', + fields: [ + { + fieldType: 'ContainerRepresentation', + id: 1497953253784, + name: 'Label', + type: 'container', + value: null, + readOnly: false, + fields: { + 1: [{ + fieldType: 'FormFieldRepresentation', + id: 'date', + name: 'date', + type: 'date', + value: null + }]} + }] +}; + +export let startFormNumberWidgetMock = { + id: 4, + name: 'Claim Review Process', + processDefinitionId: 'ClaimReviewProcess:2: 93', + fields: [ + { + fieldType: 'ContainerRepresentation', + id: 1497953253784, + name: 'Label', + type: 'container', + value: null, + readOnly: false, + fields: { + 1: [{ + fieldType: 'FormFieldRepresentation', + id: 'number', + name: 'number widget', + type: 'integer', + value: null + }]} + }] +}; + +export let startFormAmountWidgetMock = { + id: 4, + name: 'Claim Review Process', + processDefinitionId: 'ClaimReviewProcess:2: 93', + fields: [ + { + fieldType: 'ContainerRepresentation', + id: 1497953253784, + name: 'Label', + type: 'container', + value: null, + readOnly: false, + fields: { + 1: [{ + fieldType: 'FormFieldRepresentation', + id: 'amount', + name: 'amount widget', + type: 'amount', + value: null + }]} + }] +}; + +export let startFormRadioButtonWidgetMock = { + id: 4, + name: 'Claim Review Process', + processDefinitionId: 'ClaimReviewProcess:2: 93', + fields: [ + { + fieldType: 'ContainerRepresentation', + id: 1497953253784, + name: 'Label', + type: 'container', + value: null, + readOnly: false, + fields: { + 1: [{ + fieldType: 'RestFieldRepresentation', + id: 'radio-but', + name: 'radio-buttons', + type: 'radio-buttons', + value: null + }]} + }] +}; + +export let startFormTextDefinitionMock = { + id: 4, + name: 'Claim Review Process', + processDefinitionId: 'ClaimReviewProcess:2: 93', + fields: [ + { + fieldType: 'ContainerRepresentation', + id: 1497953253784, + name: 'Label', + type: 'container', + value: null, + readOnly: false, + fields: { + 1: [{ + fieldType: 'FormFieldRepresentation', + id: 'mocktext', + name: 'mockText', + type: 'text', + value: null + }]} + }] +}; + +export let startFormDropdownDefinitionMock = { + id: 4, + name: 'Claim Review Process', + processDefinitionId: 'ClaimReviewProcess:2: 93', + fields: [ + { + fieldType: 'ContainerRepresentation', + id: 1497953253784, + name: 'Label', + type: 'container', + value: null, + readOnly: false, + fields: { + 1: [{ + + fieldType: 'RestFieldRepresentation', + id: 'mockTypeDropDown', + name: 'mock DropDown', + type: 'dropdown', + value: 'Chooseone...', + required: false, + readOnly: false, + overrideId: false, + options: [ + { + id: 'empty', + name: 'Chooseone...' + }, + { + id: 'opt1', + name: 'Option-1' + }, + { + id: 'opt2', + name: 'Option-2' + }, + { + id: 'opt3', + name: 'Option-3' + }, + { + id: 'opt2', + name: 'Option-3' + } + ] + }]} + }] +}; + +export let startMockForm = { + id: 4, + name: 'Claim Review Process', + processDefinitionId: 'ClaimReviewProcess:2: 93', + processDefinitionName: 'ClaimReviewProcess', + processDefinitionKey: 'ClaimReviewProcess', + tabs: [], + fields: [ + { + fieldType: 'ContainerRepresentation', + id: 1497953253784, + name: 'Label', + type: 'container', + value: null, + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + dateDisplayFormat: null, + layout: null, + sizeX: 2, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null, + numberOfColumns: 2, + fields: { + 1: [ + { + fieldType: 'FormFieldRepresentation', + id: 'clientname', + name: 'ClientName', + type: 'text', + value: null, + required: true, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + params: { + existingColspan: 1, + maxColspan: 2 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null + } + ], + 2: [ + { + fieldType: 'FormFieldRepresentation', + id: 'policyno', + name: 'PolicyNo', + type: 'integer', + value: null, + required: true, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: 'EnterPolicyName', + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + params: { + existingColspan: 1, + maxColspan: 1 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null + } + ] + } + }, + { + fieldType: 'ContainerRepresentation', + id: 1497953270269, + name: 'Label', + type: 'container', + value: null, + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + dateDisplayFormat: null, + layout: null, + sizeX: 2, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null, + numberOfColumns: 2, + fields: { + 1: [ + { + fieldType: 'FormFieldRepresentation', + id: 'billamount', + name: 'BillAmount', + type: 'integer', + value: null, + required: true, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: 'EnterBillAmount', + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + params: { + existingColspan: 1, + maxColspan: 2 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null + } + ], + 2: [ + { + fieldType: 'FormFieldRepresentation', + id: 'billdate', + name: 'BillDate', + type: 'date', + value: null, + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: 'billdate', + params: { + existingColspan: 1, + maxColspan: 1 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null + } + ] + } + }, + { + fieldType: 'ContainerRepresentation', + id: 1497953280930, + name: 'Label', + type: 'container', + value: null, + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + dateDisplayFormat: null, + layout: null, + sizeX: 2, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null, + numberOfColumns: 2, + fields: { + 1: [ + { + fieldType: 'RestFieldRepresentation', + id: 'claimtype', + name: 'ClaimType', + type: 'dropdown', + value: 'Chooseone...', + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: true, + options: [ + { + id: 'empty', + name: 'Chooseone...' + }, + { + id: 'cashless', + name: 'Cashless' + }, + { + id: 'reimbursement', + name: 'Reimbursement' + } + ], + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + params: { + existingColspan: 1, + maxColspan: 2 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null, + endpoint: null, + requestHeaders: null + } + ], + 2: [ + { + fieldType: 'FormFieldRepresentation', + id: 'hospitalname', + name: 'HospitalName', + type: 'text', + value: null, + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: 'EnterHospitalName', + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + params: { + existingColspan: 1, + maxColspan: 1 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null + } + ] + } + } + ], + outcomes: [ + { + id: 'approve', + name: 'Approve' + }, + { + id: 'complete', + name: 'Complete' + } + ], + javascriptEvents: [], + className: '', + style: '', + metadata: {}, + variables: [], + customFieldsValueInfo: {}, + gridsterForm: false, + globalDateFormat: 'D - M - YYYY' +}; + +export let startMockFormWithTab = { + id: 4, + taskName: 'Mock Title', + processDefinitionId: 'ClaimReviewProcess:2: 93', + processDefinitionName: 'ClaimReviewProcess', + processDefinitionKey: 'ClaimReviewProcess', + tabs: [ + { + id: 'form1', + name: 'Tab 1' + }, + { + id: 'form2', + name: 'Tab 2' + } + ], + fields: [ + { + fieldType: 'ContainerRepresentation', + id: 1497953253784, + name: 'Label', + type: 'container', + value: null, + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + dateDisplayFormat: null, + layout: null, + sizeX: 2, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null, + numberOfColumns: 2, + fields: { + 1: [ + { + fieldType: 'FormFieldRepresentation', + id: 'clientname', + name: 'ClientName', + type: 'text', + value: null, + required: true, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + params: { + existingColspan: 1, + maxColspan: 2 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null + } + ], + 2: [ + { + fieldType: 'FormFieldRepresentation', + id: 'policyno', + name: 'PolicyNo', + type: 'integer', + value: null, + required: true, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: 'EnterPolicyName', + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + params: { + existingColspan: 1, + maxColspan: 1 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null + } + ] + } + }, + { + fieldType: 'ContainerRepresentation', + id: 1497953270269, + name: 'Label', + type: 'container', + value: null, + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + dateDisplayFormat: null, + layout: null, + sizeX: 2, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null, + numberOfColumns: 2, + fields: { + 1: [ + { + fieldType: 'FormFieldRepresentation', + id: 'billamount', + name: 'BillAmount', + type: 'integer', + value: null, + required: true, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: 'EnterBillAmount', + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + params: { + existingColspan: 1, + maxColspan: 2 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null + } + ], + 2: [ + { + fieldType: 'FormFieldRepresentation', + id: 'billdate', + name: 'BillDate', + type: 'date', + value: null, + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: 'billdate', + params: { + existingColspan: 1, + maxColspan: 1 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null + } + ] + } + }, + { + fieldType: 'ContainerRepresentation', + id: 1497953280930, + name: 'Label', + type: 'container', + value: null, + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + dateDisplayFormat: null, + layout: null, + sizeX: 2, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null, + numberOfColumns: 2, + fields: { + 1: [ + { + fieldType: 'RestFieldRepresentation', + id: 'claimtype', + name: 'ClaimType', + type: 'dropdown', + value: 'Chooseone...', + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: null, + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: true, + options: [ + { + id: 'empty', + name: 'Chooseone...' + }, + { + id: 'cashless', + name: 'Cashless' + }, + { + id: 'reimbursement', + name: 'Reimbursement' + } + ], + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + params: { + existingColspan: 1, + maxColspan: 2 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null, + endpoint: null, + requestHeaders: null + } + ], + 2: [ + { + fieldType: 'FormFieldRepresentation', + id: 'hospitalname', + name: 'HospitalName', + type: 'text', + value: null, + required: false, + readOnly: false, + overrideId: false, + colspan: 1, + placeholder: 'EnterHospitalName', + minLength: 0, + maxLength: 0, + minValue: null, + maxValue: null, + regexPattern: null, + optionType: null, + hasEmptyValue: null, + options: null, + restUrl: null, + restResponsePath: null, + restIdProperty: null, + restLabelProperty: null, + tab: null, + className: null, + params: { + existingColspan: 1, + maxColspan: 1 + }, + dateDisplayFormat: null, + layout: { + row: -1, + column: -1, + colspan: 1 + }, + sizeX: 1, + sizeY: 1, + row: -1, + col: -1, + visibilityCondition: null + } + ] + } + } + ], + outcomes: [ + { + id: 'approve', + name: 'Approve' + }, + { + id: 'complete', + name: 'Complete' + } + ], + javascriptEvents: [], + className: '', + style: '', + metadata: {}, + variables: [], + customFieldsValueInfo: {}, + gridsterForm: false, + globalDateFormat: 'D - M - YYYY' +}; diff --git a/ng2-components/ng2-activiti-form/src/components/start-form.component.spec.ts b/ng2-components/ng2-activiti-form/src/components/start-form.component.spec.ts index 1f41c6dac5..64543d1254 100644 --- a/ng2-components/ng2-activiti-form/src/components/start-form.component.spec.ts +++ b/ng2-components/ng2-activiti-form/src/components/start-form.component.spec.ts @@ -15,12 +15,16 @@ * limitations under the License. */ -import { SimpleChange } from '@angular/core'; +import { CUSTOM_ELEMENTS_SCHEMA, SimpleChange } from '@angular/core'; import { async, ComponentFixture, TestBed } from '@angular/core/testing'; import { AlfrescoTranslationService, CoreModule } from 'ng2-alfresco-core'; import { Observable } from 'rxjs/Rx'; +import { EntryComponenteMockModule } from '../assets/entry-module.mock'; +import { startFormDateWidgetMock, startFormDropdownDefinitionMock, startFormTextDefinitionMock, startMockForm, startMockFormWithTab } from '../assets/start-form.component.mock'; +import { startFormAmountWidgetMock, startFormNumberWidgetMock, startFormRadioButtonWidgetMock } from '../assets/start-form.component.mock'; import { TranslationMock } from './../assets/translation.service.mock'; import { EcmModelService } from './../services/ecm-model.service'; +import { FormRenderingService } from './../services/form-rendering.service'; import { FormService } from './../services/form.service'; import { WidgetVisibilityService } from './../services/widget-visibility.service'; import { FormFieldComponent } from './form-field/form-field.component'; @@ -29,11 +33,13 @@ import { StartFormComponent } from './start-form.component'; import { ContentWidgetComponent } from './widgets/content/content.widget'; import { MASK_DIRECTIVE } from './widgets/index'; import { WIDGET_DIRECTIVES } from './widgets/index'; +import { FormModel, FormOutcomeModel } from './widgets/index'; describe('ActivitiStartForm', () => { let formService: FormService; let component: StartFormComponent; + let element: HTMLElement; let fixture: ComponentFixture; let getStartFormSpy: jasmine.Spy; @@ -44,6 +50,7 @@ describe('ActivitiStartForm', () => { TestBed.configureTestingModule({ imports: [ MaterialModule, + EntryComponenteMockModule, CoreModule ], declarations: [ @@ -57,8 +64,10 @@ describe('ActivitiStartForm', () => { { provide: AlfrescoTranslationService, useClass: TranslationMock }, EcmModelService, FormService, + FormRenderingService, WidgetVisibilityService - ] + ], + schemas: [CUSTOM_ELEMENTS_SCHEMA] }).compileComponents(); })); @@ -67,6 +76,7 @@ describe('ActivitiStartForm', () => { fixture = TestBed.createComponent(StartFormComponent); component = fixture.componentInstance; formService = fixture.debugElement.injector.get(FormService); + element = fixture.nativeElement; getStartFormSpy = spyOn(formService, 'getStartFormDefinition').and.returnValue(Observable.of({ processDefinitionName: 'my:process' @@ -130,4 +140,317 @@ describe('ActivitiStartForm', () => { expect(component.outcomesContainer).toBeTruthy(); }); + it('should fetch start form detasils by processDefinitionId ', () => { + getStartFormSpy.and.returnValue(Observable.of(startMockForm)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.detectChanges(); + expect(component.outcomesContainer).toBeTruthy(); + expect(getStartFormSpy).toHaveBeenCalled(); + }); + + describe('Disply widgets', () => { + + it('should be able to display a textWidget from a process definition', () => { + getStartFormSpy.and.returnValue(Observable.of(startFormTextDefinitionMock)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.detectChanges(); + fixture.whenStable().then(() => { + fixture.detectChanges(); + const formFields = component.form.getFormFields(); + const labelField = formFields.find(field => field.id === 'mocktext'); + const textWidget = fixture.debugElement.nativeElement.querySelector('text-widget'); + const textWidgetLabel = fixture.debugElement.nativeElement.querySelector('.adf-label'); + expect(labelField.type).toBe('text'); + expect(textWidget).toBeDefined(); + expect(textWidgetLabel.innerText).toBe('mockText'); + }); + }); + + it('should be able to display a radioButtonWidget from a process definition', () => { + getStartFormSpy.and.returnValue(Observable.of(startFormRadioButtonWidgetMock)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.detectChanges(); + fixture.whenStable().then(() => { + fixture.detectChanges(); + const formFields = component.form.getFormFields(); + const labelField = formFields.find(field => field.id === 'radio-but'); + const radioButtonWidget = fixture.debugElement.nativeElement.querySelector('radio-buttons-widget'); + const radioButtonWidgetLabel = fixture.debugElement.nativeElement.querySelector('.adf-input'); + expect(labelField.type).toBe('radio-buttons'); + expect(radioButtonWidget).toBeDefined(); + expect(radioButtonWidgetLabel.innerText).toBe('radio-buttons'); + }); + }); + + it('should be able to display a amountWidget from a process definition', () => { + getStartFormSpy.and.returnValue(Observable.of(startFormAmountWidgetMock)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.detectChanges(); + fixture.whenStable().then(() => { + fixture.detectChanges(); + const formFields = component.form.getFormFields(); + const labelField = formFields.find(field => field.id === 'amount'); + const amountWidget = fixture.debugElement.nativeElement.querySelector('amount-widget'); + const amountWidgetLabel = fixture.debugElement.nativeElement.querySelector('.adf-input'); + expect(labelField.type).toBe('amount'); + expect(amountWidget).toBeDefined(); + expect(amountWidgetLabel.innerText).toBe('amount'); + }); + }); + + it('should be able to display a numberWidget from a process definition', () => { + getStartFormSpy.and.returnValue(Observable.of(startFormNumberWidgetMock)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.detectChanges(); + fixture.whenStable().then(() => { + fixture.detectChanges(); + const formFields = component.form.getFormFields(); + const labelField = formFields.find(field => field.id === 'number'); + const numberWidget = fixture.debugElement.nativeElement.querySelector('number-widget'); + const numberWidgetLabel = fixture.debugElement.nativeElement.querySelector('.adf-input'); + expect(labelField.type).toBe('text'); + expect(numberWidget).toBeDefined(); + expect(numberWidgetLabel.innerText).toBe('number'); + }); + }); + + it('should be able to display a dropDown Widget from a process definition', () => { + getStartFormSpy.and.returnValue(Observable.of(startFormDropdownDefinitionMock)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.detectChanges(); + fixture.whenStable().then(() => { + fixture.detectChanges(); + const formFields = component.form.getFormFields(); + const labelField = formFields.find(field => field.id === 'mockTypeDropDown'); + const dropDownWidget = fixture.debugElement.nativeElement.querySelector('dropdown-widget'); + const selectElement = fixture.debugElement.nativeElement.querySelector('.adf-dropdown-widget>md-select .mat-select-trigger'); + selectElement.click(); + expect(selectElement).toBeDefined(); + expect(dropDownWidget).toBeDefined(); + expect(selectElement.innerText).toBe('Choose one...'); + expect(labelField.type).toBe('dropdown'); + expect(labelField.options[0].name).toBe('Chooseone...'); + expect(labelField.options[1].name).toBe('Option-1'); + expect(labelField.options[2].name).toBe('Option-2'); + }); + }); + + it('should be able to display a date Widget from a process definition', () => { + getStartFormSpy.and.returnValue(Observable.of(startFormDateWidgetMock)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.detectChanges(); + fixture.whenStable().then(() => { + fixture.detectChanges(); + const formFields = component.form.getFormFields(); + const labelField = formFields.find(field => field.id === 'date'); + const dateWidget = fixture.debugElement.nativeElement.querySelector('dropdown-widget'); + const dateLabelElement = fixture.debugElement.nativeElement.querySelector('#data-widget .mat-input-infix> .adf-label'); + expect(dateWidget).toBeDefined(); + expect(labelField.type).toBe('date'); + expect(dateLabelElement.innerText).toBe('date (D-M-YYYY)'); + }); + }); + + it('should fetch and define form fields with proper type', () => { + getStartFormSpy.and.returnValue(Observable.of(startMockForm)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + const formFields = component.form.getFormFields(); + + const labelField = formFields.find(field => field.id === 'billdate'); + expect(labelField.type).toBe('date'); + + const formFields1 = component.form.getFormFields(); + const labelField1 = formFields1.find(field => field.id === 'claimtype'); + expect(labelField1.type).toBe('dropdown'); + }); + + it('should show dropdown options', () => { + getStartFormSpy.and.returnValue(Observable.of(startMockForm)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.detectChanges(); + fixture.whenStable().then(() => { + const formFields = component.form.getFormFields(); + const labelField = formFields.find(field => field.id === 'claimtype'); + expect(labelField.type).toBe('dropdown'); + expect(labelField.options[0].name).toBe('Chooseone...'); + expect(labelField.options[1].name).toBe('Cashless'); + expect(labelField.options[2].name).toBe('Reimbursement'); + }); + }); + + it('should disply start form with fields ', async(() => { + getStartFormSpy.and.returnValue(Observable.of(startMockForm)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.whenStable().then(() => { + fixture.detectChanges(); + const formFieldsWidget = fixture.debugElement.nativeElement.querySelector('form-field'); + const inputElement = fixture.debugElement.nativeElement.querySelector('.adf-input'); + const inputLabelElement = fixture.debugElement.nativeElement.querySelector('.mat-input-infix > .adf-label'); + const dateElement = fixture.debugElement.nativeElement.querySelector('#billdate'); + const dateLabelElement = fixture.debugElement.nativeElement.querySelector('#data-widget .mat-input-infix> .adf-label'); + const selectElement = fixture.debugElement.nativeElement.querySelector('#claimtype'); + const selectLabelElement = fixture.debugElement.nativeElement.querySelector('.adf-dropdown-widget > .adf-label'); + expect(formFieldsWidget).toBeDefined(); + expect(inputElement).toBeDefined(); + expect(dateElement).toBeDefined(); + expect(selectElement).toBeDefined(); + expect(inputLabelElement.innerText).toBe('ClientName*'); + expect(dateLabelElement.innerText).toBe('BillDate (D-M-YYYY)'); + expect(selectLabelElement.innerText).toBe('ClaimType'); + }); + })); + + it('should refresh start form on click of refresh button ', async(() => { + getStartFormSpy.and.returnValue(Observable.of(startMockForm)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.showRefreshButton = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.detectChanges(); + fixture.whenStable().then(() => { + const refreshElement = fixture.debugElement.nativeElement.querySelector('.mat-card-actions>button'); + refreshElement.click(); + fixture.detectChanges(); + const selectElement = fixture.debugElement.nativeElement.querySelector('#claimtype'); + const selectLabelElement = fixture.debugElement.nativeElement.querySelector('.adf-dropdown-widget > .adf-label'); + expect(refreshElement).toBeDefined(); + expect(selectElement).toBeDefined(); + expect(selectLabelElement.innerText).toBe('ClaimType'); + }); + })); + + it('should difine custom-tabs ', async(() => { + getStartFormSpy.and.returnValue(Observable.of(startMockFormWithTab)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.showRefreshButton = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.whenStable().then(() => { + fixture.detectChanges(); + const formTabs = component.form.tabs; + const tabField1 = formTabs.find(tab => tab.id === 'form1'); + const tabField2 = formTabs.find(tab => tab.id === 'form2'); + const tabsWidgetElement = fixture.debugElement.nativeElement.querySelector('tabs-widget'); + expect(tabField1.name).toBe('Tab 1'); + expect(tabField2.name).toBe('Tab 2'); + expect(tabsWidgetElement).toBeDefined(); + }); + })); + + it('should difine title and [custom-action-buttons]', async(() => { + getStartFormSpy.and.returnValue(Observable.of(startMockFormWithTab)); + component.processDefinitionId = exampleId1; + component.showOutcomeButtons = true; + component.showRefreshButton = true; + component.ngOnChanges({ processDefinitionId: new SimpleChange(exampleId1, exampleId2, true) }); + fixture.whenStable().then(() => { + fixture.detectChanges(); + const titleIcon = fixture.debugElement.nativeElement.querySelector('md-card-title>md-icon'); + const titleElement = fixture.debugElement.nativeElement.querySelector('md-card-title>h2'); + const actionButtons = fixture.debugElement.nativeElement.querySelectorAll('.mat-button'); + expect(titleIcon).toBeDefined(); + expect(titleElement).toBeDefined(); + expect(actionButtons.length).toBe(4); + expect(actionButtons[0].innerText).toBe('Save'); + expect(actionButtons[0].disabled).toBeFalsy(); + expect(actionButtons[1].innerText).toBe('Approve'); + expect(actionButtons[1].disabled).toBeTruthy(); + expect(actionButtons[2].innerText).toBe('Complete'); + expect(actionButtons[2].disabled).toBeTruthy(); + }); + })); + }); + + describe('OutCome Actions', () => { + + it('should not enable outcome button when model missing', () => { + expect(component.isOutcomeButtonVisible(null, false)).toBeFalsy(); + }); + + it('should enable custom outcome buttons', () => { + const formModel = new FormModel(); + component.form = formModel; + const outcome = new FormOutcomeModel(formModel, { id: 'action1', name: 'Action 1' }); + expect(component.isOutcomeButtonVisible(outcome, component.form.readOnly)).toBeTruthy(); + }); + + it('should allow controlling [complete] button visibility', () => { + const formModel = new FormModel(); + component.form = formModel; + const outcome = new FormOutcomeModel(formModel, { id: '$save', name: FormOutcomeModel.SAVE_ACTION }); + + component.showSaveButton = true; + expect(component.isOutcomeButtonVisible(outcome, component.form.readOnly)).toBeTruthy(); + + component.showSaveButton = false; + expect(component.isOutcomeButtonVisible(outcome, component.form.readOnly)).toBeFalsy(); + }); + + it('should show only [complete] button with readOnly form ', () => { + const formModel = new FormModel(); + formModel.readOnly = true; + component.form = formModel; + const outcome = new FormOutcomeModel(formModel, { id: '$complete', name: FormOutcomeModel.COMPLETE_ACTION }); + + component.showCompleteButton = true; + expect(component.isOutcomeButtonVisible(outcome, component.form.readOnly)).toBeTruthy(); + }); + + it('should not show [save] button with readOnly form ', () => { + const formModel = new FormModel(); + formModel.readOnly = true; + component.form = formModel; + const outcome = new FormOutcomeModel(formModel, { id: '$save', name: FormOutcomeModel.SAVE_ACTION }); + + component.showSaveButton = true; + expect(component.isOutcomeButtonVisible(outcome, component.form.readOnly)).toBeFalsy(); + }); + + it('should show [custom-outcome] button with readOnly form and selected custom-outcome', () => { + const formModel = new FormModel({ selectedOutcome: 'custom-outcome' }); + formModel.readOnly = true; + component.form = formModel; + const outcome = new FormOutcomeModel(formModel, { id: '$customoutome', name: 'custom-outcome' }); + + component.showCompleteButton = true; + component.showSaveButton = true; + expect(component.isOutcomeButtonVisible(outcome, component.form.readOnly)).toBeTruthy(); + + const outcome1 = new FormOutcomeModel(formModel, { id: '$customoutome2', name: 'custom-outcome2' }); + expect(component.isOutcomeButtonVisible(outcome1, component.form.readOnly)).toBeFalsy(); + }); + + it('should allow controlling [save] button visibility', () => { + const formModel = new FormModel(); + formModel.readOnly = false; + component.form = formModel; + const outcome = new FormOutcomeModel(formModel, { id: '$save', name: FormOutcomeModel.COMPLETE_ACTION }); + + component.showCompleteButton = true; + expect(component.isOutcomeButtonVisible(outcome, component.form.readOnly)).toBeTruthy(); + + component.showCompleteButton = false; + expect(component.isOutcomeButtonVisible(outcome, component.form.readOnly)).toBeFalsy(); + }); + }); });