触摸和取消触摸垫输入后是否出现垫错误的单元测试

Question

[当我没有触摸输入时，以及在我触摸并取消触摸输入而没有输入任何文本时，如何测试DOM中是否存在mat-error？

我正在使用Jest测试

HTML

<mat-form-field>
  <input matInput formControlName="someInput"/>
  <mat-error id="my_error">* required</mat-error>
</mat-form-field>

Test

it('Should not show error', () => {
  const myEl = fixture.debugElement.query(By.css('#my_error'));

  expect(myEl).toBeUndefined();
});

it('Should show error', () => {
  const myEl = fixture.debugElement.query(By.css('#my_error'));

 // code to touch and untouch the element

  expect(myEl).not.toBeUndefined();
});

Answer 1

也许像：

const input = fixture.debugElement.query(By.css("[formControlName='someInput']"));
const errors = fixture.debugElement.queryAll(By.css("mat-error"));

input.nativeElement.dispatchEvent(new Event("input"));
fixture.detectChanges();

expect(errors.length).toEqual(1);
expect(errors[0].nativeElement.innerHTML.trim()).toMatch("* required");