diff --git a/ng2-components/ng2-activiti-form/src/components/widgets/dropdown/dropdown.widget.spec.ts b/ng2-components/ng2-activiti-form/src/components/widgets/dropdown/dropdown.widget.spec.ts index e160de0adf..97f58b2a03 100644 --- a/ng2-components/ng2-activiti-form/src/components/widgets/dropdown/dropdown.widget.spec.ts +++ b/ng2-components/ng2-activiti-form/src/components/widgets/dropdown/dropdown.widget.spec.ts @@ -111,7 +111,10 @@ describe('DropdownWidget', () => { let element: HTMLElement; let componentHandler; let stubFormService; - let fakeOptionList: FormFieldOption[] = [{ id: 'opt_1', name: 'option_1' }, { + let fakeOptionList: FormFieldOption[] = [{ + id: 'opt_1', + name: 'option_1' + }, { id: 'opt_2', name: 'option_2' }, { id: 'opt_3', name: 'option_3' }]; @@ -130,56 +133,132 @@ describe('DropdownWidget', () => { }); })); - beforeEach(async(() => { - stubFormService = fixture.debugElement.injector.get(FormService); - visibilityService = fixture.debugElement.injector.get(WidgetVisibilityService); - spyOn(visibilityService, 'refreshVisibility').and.stub(); - spyOn(stubFormService, 'getRestFieldValues').and.returnValue(Observable.of(fakeOptionList)); - dropDownWidget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), { - id: 'dropdown-id', - name: 'date-name', - type: 'dropdown', - readOnly: 'false', - restUrl: 'fake-rest-url' - }); - dropDownWidget.field.isVisible = true; - fixture.detectChanges(); - })); + describe('and dropdown is populated via taskId', () => { - afterEach(() => { - fixture.destroy(); - TestBed.resetTestingModule(); + beforeEach(async(() => { + stubFormService = fixture.debugElement.injector.get(FormService); + visibilityService = fixture.debugElement.injector.get(WidgetVisibilityService); + spyOn(visibilityService, 'refreshVisibility').and.stub(); + spyOn(stubFormService, 'getRestFieldValues').and.returnValue(Observable.of(fakeOptionList)); + dropDownWidget.field = new FormFieldModel(new FormModel({ taskId: 'fake-task-id' }), { + id: 'dropdown-id', + name: 'date-name', + type: 'dropdown', + readOnly: 'false', + restUrl: 'fake-rest-url' + }); + dropDownWidget.field.emptyOption = { id: 'empty', name: 'Choose one...' }; + dropDownWidget.field.isVisible = true; + fixture.detectChanges(); + })); + + it('should show visible dropdown widget', async(() => { + expect(element.querySelector('#dropdown-id')).toBeDefined(); + expect(element.querySelector('#dropdown-id')).not.toBeNull(); + expect(element.querySelector('#opt_1')).not.toBeNull(); + expect(element.querySelector('#opt_2')).not.toBeNull(); + expect(element.querySelector('#opt_3')).not.toBeNull(); + })); + + it('should select the default value when an option is chosen as default', async(() => { + dropDownWidget.field.value = 'option_2'; + fixture.detectChanges(); + fixture.whenStable() + .then(() => { + let dropDownElement: HTMLSelectElement = element.querySelector('#dropdown-id'); + expect(dropDownElement).not.toBeNull(); + expect(element.querySelector('#opt_2')).not.toBeNull(); + expect(dropDownElement.value).toBe('option_2'); + expect(dropDownElement.selectedOptions[0].textContent).toBe('option_2'); + }); + })); + + it('should select the empty value when no default is chosen', async(() => { + dropDownWidget.field.value = 'empty'; + fixture.detectChanges(); + fixture.whenStable() + .then(() => { + let dropDownElement: HTMLSelectElement = element.querySelector('#dropdown-id'); + expect(dropDownElement).not.toBeNull(); + expect(dropDownElement.value).toBe('empty'); + expect(dropDownElement.selectedOptions[0].textContent).toBe('Choose one...'); + }); + })); + + it('should be not visibile when isVisible is false', async(() => { + dropDownWidget.field.isVisible = false; + fixture.detectChanges(); + fixture.whenStable() + .then(() => { + let dropDownElement: HTMLSelectElement = element.querySelector('#dropdown-id'); + expect(dropDownElement).toBeNull(); + }); + })); + + it('should became visibile when isVisible is true', async(() => { + dropDownWidget.field.isVisible = false; + fixture.detectChanges(); + expect(element.querySelector('#dropdown-id')).toBeNull(); + dropDownWidget.field.isVisible = true; + fixture.detectChanges(); + fixture.whenStable() + .then(() => { + expect(element.querySelector('#dropdown-id')).not.toBeNull(); + }); + })); }); - it('should show visible dropdown widget', async(() => { - expect(element.querySelector('#dropdown-id')).toBeDefined(); - expect(element.querySelector('#dropdown-id')).not.toBeNull(); - expect(element.querySelector('#opt_1')).not.toBeNull(); - expect(element.querySelector('#opt_2')).not.toBeNull(); - expect(element.querySelector('#opt_3')).not.toBeNull(); - })); + describe('and dropdown is populated via processDefinitionId', () => { - it('should select the default value', async(() => { - dropDownWidget.field.value = 'option_2'; - fixture.detectChanges(); - fixture.whenStable() - .then(() => { - let dropDownElement: HTMLSelectElement = element.querySelector('#dropdown-id'); - expect(dropDownElement).not.toBeNull(); - expect(element.querySelector('#opt_2')).not.toBeNull(); - expect(dropDownElement.value).toBe('option_2'); + beforeEach(async(() => { + stubFormService = fixture.debugElement.injector.get(FormService); + visibilityService = fixture.debugElement.injector.get(WidgetVisibilityService); + spyOn(visibilityService, 'refreshVisibility').and.stub(); + spyOn(stubFormService, 'getRestFieldValuesByProcessId').and.returnValue(Observable.of(fakeOptionList)); + dropDownWidget.field = new FormFieldModel(new FormModel({ processDefinitionId: 'fake-process-id' }), { + id: 'dropdown-id', + name: 'date-name', + type: 'dropdown', + readOnly: 'false', + restUrl: 'fake-rest-url' }); - })); + dropDownWidget.field.emptyOption = { id: 'empty', name: 'Choose one...' }; + dropDownWidget.field.isVisible = true; + fixture.detectChanges(); + })); - it('should be not visibile when isVisible is false', async(() => { - dropDownWidget.field.isVisible = false; - fixture.detectChanges(); - fixture.whenStable() - .then(() => { - let dropDownElement: HTMLSelectElement = element.querySelector('#dropdown-id'); - expect(dropDownElement).toBeNull(); - }); - })); + it('should show visible dropdown widget', async(() => { + expect(element.querySelector('#dropdown-id')).toBeDefined(); + expect(element.querySelector('#dropdown-id')).not.toBeNull(); + expect(element.querySelector('#opt_1')).not.toBeNull(); + expect(element.querySelector('#opt_2')).not.toBeNull(); + expect(element.querySelector('#opt_3')).not.toBeNull(); + })); + it('should select the default value when an option is chosen as default', async(() => { + dropDownWidget.field.value = 'option_2'; + fixture.detectChanges(); + fixture.whenStable() + .then(() => { + let dropDownElement: HTMLSelectElement = element.querySelector('#dropdown-id'); + expect(dropDownElement).not.toBeNull(); + expect(element.querySelector('#opt_2')).not.toBeNull(); + expect(dropDownElement.value).toBe('option_2'); + expect(dropDownElement.selectedOptions[0].textContent).toBe('option_2'); + }); + })); + + it('should select the empty value when no default is chosen', async(() => { + dropDownWidget.field.value = 'empty'; + fixture.detectChanges(); + fixture.whenStable() + .then(() => { + let dropDownElement: HTMLSelectElement = element.querySelector('#dropdown-id'); + expect(dropDownElement).not.toBeNull(); + expect(dropDownElement.value).toBe('empty'); + expect(dropDownElement.selectedOptions[0].textContent).toBe('Choose one...'); + }); + })); + }); }); });