Angular 7组件测试-如何验证输入元素值

import { ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { DebugElement } from '@angular/core';
import { YourComponent } from './your-component.component';

describe('YourComponent', () => {
  let component: YourComponent;
  let fixture: ComponentFixture<YourComponent>;
  let debugElement: DebugElement;

  beforeEach(async () => {
    await TestBed.configureTestingModule({
      declarations: [YourComponent],
      imports: [FormsModule]
    }).compileComponents();
  });

  beforeEach(() => {
    fixture = TestBed.createComponent(YourComponent);
    component = fixture.componentInstance;
    debugElement = fixture.debugElement;

    // 执行变更检测
    fixture.detectChanges();
  });
  
  // ...其他测试用例
});

it('should update input element value', () => {
  // 获取输入元素
  const inputElement = debugElement.query(By.css('#your-input-id')).nativeElement;

  // 模拟用户输入
  inputElement.value = 'Test Value';
  inputElement.dispatchEvent(new Event('input'));

  // 执行变更检测
  fixture.detectChanges();

  // 断言期望的输入元素值
  expect(component.yourInputValue).toBe('Test Value');
});