From f64ef77d4130ff5fc609887eb08a3cc3b7cdc91c Mon Sep 17 00:00:00 2001 From: Vito Albano Date: Wed, 16 Nov 2016 20:08:28 +0000 Subject: [PATCH] Add test for dropdown widget --- .../radio-buttons.widget.spec.ts | 163 +++++++++++------- .../radio-buttons/radio-buttons.widget.ts | 16 +- 2 files changed, 110 insertions(+), 69 deletions(-) diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/radio-buttons/radio-buttons.widget.spec.ts b/ng2-components/ng2-activiti-form/src/components/widgets/radio-buttons/radio-buttons.widget.spec.ts index 2431b2af33..1141405b71 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/radio-buttons/radio-buttons.widget.spec.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/radio-buttons/radio-buttons.widget.spec.ts @@ -23,16 +23,22 @@ import { FormFieldModel } from './../core/form-field.model'; import { CoreModule } from 'ng2-alfresco-core'; import { ComponentFixture, TestBed, async } from '@angular/core/testing'; import { EcmModelService } from '../../../services/ecm-model.service'; +import { WidgetVisibilityService } from '../../../services/widget-visibility.service'; +import { FormFieldTypes } from '../core/form-field-types'; +import { FormFieldOption } from './../core/form-field-option'; +import { ContainerModel } from '../core/container.model'; describe('RadioButtonsWidget', () => { let formService: FormService; let widget: RadioButtonsWidget; + let visibilityService: WidgetVisibilityService; beforeEach(() => { formService = new FormService(null, null); - widget = new RadioButtonsWidget(formService); - widget.field = new FormFieldModel(new FormModel(), {restUrl: ''}); + visibilityService = new WidgetVisibilityService(null, null, null); + widget = new RadioButtonsWidget(formService, visibilityService); + widget.field = new FormFieldModel(new FormModel(), { restUrl: '' }); }); it('should request field values from service', () => { @@ -57,18 +63,40 @@ describe('RadioButtonsWidget', () => { }); it('should update form on values fetched', () => { - let form = widget.field; - spyOn(form, 'updateForm').and.stub(); + const taskId = ''; + const fieldId = ''; + + let form = new FormModel({ + taskId: taskId + }); + + widget.field = new FormFieldModel(form, { + id: fieldId, + restUrl: '' + }); + let field = widget.field; + spyOn(field, 'updateForm').and.stub(); spyOn(formService, 'getRestFieldValues').and.returnValue(Observable.create(observer => { observer.next(null); observer.complete(); })); widget.ngOnInit(); - expect(form.updateForm).toHaveBeenCalled(); + expect(field.updateForm).toHaveBeenCalled(); }); it('should require field with rest URL to fetch data', () => { + const taskId = ''; + const fieldId = ''; + + let form = new FormModel({ + taskId: taskId + }); + + widget.field = new FormFieldModel(form, { + id: fieldId, + restUrl: '' + }); spyOn(formService, 'getRestFieldValues').and.returnValue(Observable.create(observer => { observer.next(null); observer.complete(); @@ -102,19 +130,17 @@ describe('RadioButtonsWidget', () => { expect(widget.field.value).toEqual('fake-opt'); }); - it('should emit field change event when option is clicked', (done) => { - widget.fieldChanged.subscribe((field) => { - expect(field.value).toEqual('fake-opt'); - done(); - }); - widget.onOptionClick('fake-opt'); - }); - describe('when template is ready', () => { let radioButtonWidget: RadioButtonsWidget; let fixture: ComponentFixture; let element: HTMLElement; let componentHandler; + let stubFormService: FormService; + let stubVisibilityService: WidgetVisibilityService; + let restOption: FormFieldOption[] = [{ id: 'opt-1', name: 'opt-name-1' }, { + id: 'opt-2', + name: 'opt-name-2' + }]; beforeEach(async(() => { componentHandler = jasmine.createSpyObj('componentHandler', ['upgradeAllRegistered', 'upgradeElement']); @@ -122,7 +148,7 @@ describe('RadioButtonsWidget', () => { TestBed.configureTestingModule({ imports: [CoreModule], declarations: [RadioButtonsWidget], - providers: [FormService, EcmModelService] + providers: [FormService, EcmModelService, WidgetVisibilityService] }).compileComponents().then(() => { fixture = TestBed.createComponent(RadioButtonsWidget); radioButtonWidget = fixture.componentInstance; @@ -130,47 +156,38 @@ describe('RadioButtonsWidget', () => { }); })); - beforeEach(() => { - radioButtonWidget.field = new FormFieldModel(new FormModel(), { - id: 'radio-id', - name: 'radio-name', - type: 'radio-buttons' - }); - radioButtonWidget.field.options = [{id: 'opt-1', name: 'opt-name-1'}, {id: 'opt-2', name: 'opt-name-2'}]; - radioButtonWidget.field.isVisible = true; - fixture.detectChanges(); - }); - afterEach(() => { fixture.destroy(); TestBed.resetTestingModule(); }); - it('should show visible radio buttons', async(() => { - fixture.detectChanges(); - fixture.whenStable() - .then(() => { - expect(element.querySelector('#radio-id')).toBeDefined(); - expect(element.querySelector('#opt-1')).toBeDefined(); - expect(element.querySelector('#radio-id-opt-1')).toBeDefined(); - expect(element.querySelector('#opt-2')).toBeDefined(); - expect(element.querySelector('#radio-id-opt-2')).toBeDefined(); - }); - })); + describe('and radioButton is populated via taskId', () => { - it('should not show invisible radio buttons', async(() => { - radioButtonWidget.field.isVisible = false; - fixture.detectChanges(); - fixture.whenStable() - .then(() => { - expect(element.querySelector('#radio-id')).toBeNull(); - expect(element.querySelector('#opt-1')).toBeNull(); - expect(element.querySelector('#opt-2')).toBeNull(); + beforeEach(async(() => { + stubFormService = fixture.debugElement.injector.get(FormService); + stubVisibilityService = fixture.debugElement.injector.get(WidgetVisibilityService); + spyOn(stubFormService, 'getRestFieldValues').and.returnValue(Observable.of(restOption)); + radioButtonWidget.field = new FormFieldModel(new FormModel({ taskId: 'task-id' }), { + id: 'radio-id', + name: 'radio-name', + type: FormFieldTypes.RADIO_BUTTONS, + restUrl: 'rest-url' }); - })); + radioButtonWidget.field.isVisible = true; + let fakeContainer = new ContainerModel(radioButtonWidget.field); + radioButtonWidget.field.form.fields.push(fakeContainer); + fixture.detectChanges(); + })); - it('should hide radio button when it becomes not visible', async(() => { - radioButtonWidget.fieldChanged.subscribe((res) => { + it('should show visible radio buttons', async(() => { + expect(element.querySelector('#radio-id')).toBeDefined(); + expect(element.querySelector('#opt-1')).not.toBeNull(); + expect(element.querySelector('#radio-id-opt-1')).not.toBeNull(); + expect(element.querySelector('#opt-2')).not.toBeNull(); + expect(element.querySelector('#radio-id-opt-2')).not.toBeNull(); + })); + + it('should not show invisible radio buttons', async(() => { radioButtonWidget.field.isVisible = false; fixture.detectChanges(); fixture.whenStable() @@ -179,27 +196,45 @@ describe('RadioButtonsWidget', () => { expect(element.querySelector('#opt-1')).toBeNull(); expect(element.querySelector('#opt-2')).toBeNull(); }); - }); - radioButtonWidget.checkVisibility(null); - })); + })); - it('should show radio button when it becomes visible', async(() => { - radioButtonWidget.field.isVisible = false; - fixture.detectChanges(); - radioButtonWidget.fieldChanged.subscribe((res) => { - radioButtonWidget.field.isVisible = true; + it('should evaluate visibility on option click', async(() => { + spyOn(stubVisibilityService, 'evaluateVisibility').and.returnValue(false); + let option: HTMLElement = element.querySelector('#opt-1'); + expect(element.querySelector('#radio-id')).not.toBeNull(); + expect(option).not.toBeNull(); + option.click(); fixture.detectChanges(); fixture.whenStable() .then(() => { - expect(element.querySelector('#radio-id')).toBeDefined(); - expect(element.querySelector('#opt-1')).toBeDefined(); - expect(element.querySelector('#radio-id-opt-1')).toBeDefined(); - expect(element.querySelector('#opt-2')).toBeDefined(); - expect(element.querySelector('#radio-id-opt-2')).toBeDefined(); + expect(element.querySelector('#radio-id')).toBeNull(); + expect(element.querySelector('#opt-1')).toBeNull(); }); - }); - radioButtonWidget.checkVisibility(null); - })); - }); + })); + }); + describe('and radioButton is populated via processDefinitionId', () => { + + beforeEach(async(() => { + radioButtonWidget.field = new FormFieldModel(new FormModel({ processDefinitionId: 'proc-id' }), { + id: 'radio-id', + name: 'radio-name', + type: FormFieldTypes.RADIO_BUTTONS, + restUrl: 'rest-url' + }); + stubFormService = fixture.debugElement.injector.get(FormService); + spyOn(stubFormService, 'getRestFieldValuesByProcessId').and.returnValue(Observable.of(restOption)); + radioButtonWidget.field.isVisible = true; + fixture.detectChanges(); + })); + + it('should show visible radio buttons', async(() => { + expect(element.querySelector('#radio-id')).toBeDefined(); + expect(element.querySelector('#opt-1')).not.toBeNull(); + expect(element.querySelector('#radio-id-opt-1')).not.toBeNull(); + expect(element.querySelector('#opt-2')).not.toBeNull(); + expect(element.querySelector('#radio-id-opt-2')).not.toBeNull(); + })); + }); + }); }); diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/radio-buttons/radio-buttons.widget.ts b/ng2-components/ng2-activiti-form/src/components/widgets/radio-buttons/radio-buttons.widget.ts index a3286c2066..1018bbb925 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/radio-buttons/radio-buttons.widget.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/radio-buttons/radio-buttons.widget.ts @@ -19,6 +19,7 @@ import { Component, OnInit } from '@angular/core'; import { WidgetComponent } from './../widget.component'; import { FormService } from '../../../services/form.service'; import { FormFieldOption } from './../core/form-field-option'; +import { WidgetVisibilityService } from '../../../services/widget-visibility.service'; @Component({ moduleId: module.id, @@ -28,16 +29,17 @@ import { FormFieldOption } from './../core/form-field-option'; }) export class RadioButtonsWidget extends WidgetComponent implements OnInit { - constructor(private formService: FormService) { + constructor(private formService: FormService, + private visibilityService: WidgetVisibilityService) { super(); } ngOnInit() { if (this.field && this.field.restUrl) { - if (this.field.form.processDefinitionId) { - this.getOptionsByProcessDefinitionId(); - } else { + if (this.field.form.taskId) { this.getOptionsByTaskId(); + } else { + this.getOptionsByProcessDefinitionId(); } } } @@ -74,7 +76,11 @@ export class RadioButtonsWidget extends WidgetComponent implements OnInit { onOptionClick(optionSelected: any) { this.field.value = optionSelected; - this.checkVisibility(this.field); + this.checkVisibility(); + } + + checkVisibility() { + this.visibilityService.refreshVisibility(this.field.form); } handleError(error: any) {