vid-webpack-master/src/app/shared/components/formControls/component/multiselect/multiselect.formControl.component.spec.ts

   1 import {ComponentFixture, TestBed} from '@angular/core/testing';
   2 import {CUSTOM_ELEMENTS_SCHEMA} from '@angular/core'
   3 import {CommonModule} from "@angular/common";
   4 import {FormBuilder, FormControl, ReactiveFormsModule, Validators} from "@angular/forms";
   5 import {
   6   ValidatorModel,
   7   ValidatorOptions
   8 } from "../../../../models/formControlModels/formControl.model";
   9 import {FormControlMessageErrorComponent} from "../../errorMessage/formControlMessageError.component";
  10 import {BrowserModule} from "@angular/platform-browser";
  11 import {MultiselectFormControlComponent} from "./multiselect.formControl.component";
  12 import {MultiselectFormControl} from "../../../../models/formControlModels/multiselectFormControl.model";
  13 import { of } from "rxjs";
  14 describe('Dropdown Form Control Component', () => {
  15   let component: MultiselectFormControlComponent;
  16   let fixture: ComponentFixture<MultiselectFormControlComponent>;
  17   let fb: FormBuilder;
  18
  19   beforeAll(done => (async () => {
  20     TestBed.configureTestingModule({
  21       imports: [CommonModule, BrowserModule, ReactiveFormsModule],
  22       providers: [FormBuilder],
  23       declarations: [MultiselectFormControlComponent, FormControlMessageErrorComponent],
  24       schemas: [CUSTOM_ELEMENTS_SCHEMA]
  25     });
  26     await TestBed.compileComponents();
  27
  28     fixture = TestBed.createComponent(MultiselectFormControlComponent);
  29     component = fixture.componentInstance;
  30     fb = TestBed.get(FormBuilder);
  31
  32   })().then(done).catch(done.fail));
  33
  34   test('component should initialize basic parameters', () => {
  35       component.data = new MultiselectFormControl({
  36         displayName: "display Name",
  37         validations: [new ValidatorModel(ValidatorOptions.required, 'is required')],
  38         dataTestId: "data-test-id",
  39         placeHolder: "place holder",
  40         controlName: 'testDropdown',
  41         options: of([
  42           'option1',
  43           'option2',
  44           'option3',
  45           'onBlur'
  46         ])
  47       });
  48
  49       component.data.hasErrors = function () {
  50         return this.formGroup.controls[this.controlName].touched && this.formGroup.controls[this.controlName].errors ? ['error-style'] : [];
  51       };
  52
  53       component.data.onBlur = function () {
  54         component.form.controls['testDropdown'].setValue('onBlur');
  55       };
  56
  57       component.form = fb.group({
  58         'testDropdown': new FormControl({
  59           value: component.data.value,
  60           disabled: false
  61         }, Validators.compose(component.data.validations.map(item => item.validator)))
  62       });
  63
  64       component.form.controls['testDropdown'].setValue('');
  65       expect(component.form.controls['testDropdown'].errors.required).toBeTruthy();
  66       component.form.controls['testDropdown'].setValue('option2');
  67       expect(component.form.controls['testDropdown'].errors).toBeFalsy();
  68       component.data.onBlur();
  69       expect(component.form.controls['testDropdown'].value).toEqual('onBlur');
  70       expect(component.form.controls['testDropdown'].errors).toBeFalsy();
  71     }
  72   )
  73 });
  74