关于多个 mat-select 和 mat-option 的测试用例-解网

问：

it('should update control2 options when control1 is changed to "b"', (() => {
const control1Select = fixture.nativeElement.querySelector(
  'mat-select[formControlName="control1"]'
);
const control2Select = fixture.nativeElement.querySelector(
  'mat-select[formControlName="control2"]'
);

// Select "b" for control1
control1Select.value = 'b';
control1Select.dispatchEvent(new Event('change'));

fixture.detectChanges(); 

const control2Options = control2Select.querySelectorAll('mat-option');
expect(control2Options.length).toBe(3); // Expect 3 options when control1 is "b"
}));

我尝试了很多解决方案，但没有成功。当用户从 Control1 中选择一个选项时，Control2 的选项将使用文件中.ts函数来决定。需要为此功能编写测试用例。

我还添加了 fakeAsync 和 tick。

我也试过：

control1Select.value = 'b';
control1Select.dispatchEvent(new Event('change'));

我也试过：

fixture.whenStable().then(() => {
const control2Options = control2Select.querySelectorAll('mat-option');
expect(control2Options.length).toBe(3); // Expect 3 options when control1 is "b"
done();
});

错误：预期 0 为 3。

角度测试茉业力-茉莉花

it('should update control2 options when control1 is changed to "b"', () => {
  // Select "b" for control1, use setValue
  component.form.get("control1").setValue("b");

  fixture.detectChanges(); 

  const control2Select = fixture.nativeElement.querySelector(
    'mat-select[formControlName="control2"]'
  );
  const control2Options = control2Select.querySelectorAll('mat-option');
  expect(control2Options.length).toBe(3); // Expect 3 options when control1 is "b"
});

关于多个 mat-select 和 mat-option 的测试用例

Test case about multiple mat-select and mat-option

评论

评论