Перечислите все зарегистрированные элементы управления шаблонной формой внутри класса теста - PullRequest
Новая
       16

Перечислите все зарегистрированные элементы управления шаблонной формой внутри класса теста

0 голосов
/ 30 апреля 2018 
  <form #form="ngForm">
      <mat-form-field>
        <input matInput ngModel placeholder="Starting price" name="startingPrice">
      </mat-form-field>
  </form>

доступ к этой шаблонно-управляемой форме в моем компоненте, как этот 

 @ViewChild('form') myForm: NgForm;

но я не могу перечислить их, потому что шаблон загружается после того, как я вызываю console.log 

  it('should list registered form controls', (() => {
    fixture.detectChanges();
    expect(component).toBeDefined();
    console.log('input', component.myForm.form.controls);
  }));

Как мне ждать в моем тесте, чтобы я мог получить доступ к списку form.controls?

попробовал, но безрезультатно 

 it('should be defined', fakeAsync(() => {
    // This first detectChanges is necessary to properly set up the form
    fixture.detectChanges();

    // Tick needs to be called in order for form controls to be registered properly.
    tick();

    expect(fixture).toBeDefined();
    expect(fixture.componentInstance).toBeDefined();

    let myForm: NgForm = fixture.componentInstance.myForm;
    console.log('myForm.controls.startingPrice', myForm.form.controls['startingPrice']); // still getting undefined

  }));

1 Ответ

0 голосов
/ 02 мая 2018

MatOptionModule не было импортировано в тест. Причинение введенной формы, чтобы быть недействительным. 

 <form (ngSubmit)="onSubmit()" #form="ngForm">
  <mat-form-field>
    <mat-select placeholder="Pick" name="selectSomething" ngModel>
      <mat-option value="E">Express</mat-option>
      <mat-option value="C">Combined</mat-option>
    </mat-select>
  </mat-form-field>

  <mat-form-field>
    <input matInput name="startingPrice">
  </mat-form-field>

</form>



 beforeEach(async(() => {
    TestBed.configureTestingModule({
      imports: [
        MatCardModule,
        MatSelectModule,
        MatInputModule,
        MatButtonModule,
        MatOptionModule, 
        RouterTestingModule,
        MatFormFieldModule,
        FormsModule,
        MatDialogModule,
        BrowserAnimationsModule
      ],
      declarations: [TestComponent]// declare the test component
    })
      .compileComponents();  // compile template and css
  }));
...