如何在angular中使用debounceTime对主题进行单元测试

import { Component, OnInit } from '@angular/core';
import { Subject } from 'rxjs';
import { debounceTime } from 'rxjs/operators';

@Component({
  selector: 'app-search-box',
  template: `
    <input type="text" (keyup)="search($event.target.value)">
  `,
})
export class SearchBoxComponent implements OnInit {
  searchSubject: Subject<string> = new Subject<string>();

  ngOnInit(): void {
    this.searchSubject
      .pipe(debounceTime(300))
      .subscribe((value) => this.performSearch(value));
  }

  search(value: string): void {
    this.searchSubject.next(value);
  }

  performSearch(value: string): void {
    // 执行搜索操作
  }
}

import { ComponentFixture, TestBed } from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { SearchBoxComponent } from './search-box.component';

describe('SearchBoxComponent', () => {
  let component: SearchBoxComponent;
  let fixture: ComponentFixture<SearchBoxComponent>;

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

  beforeEach(() => {
    fixture = TestBed.createComponent(SearchBoxComponent);
    component = fixture.componentInstance;
    fixture.detectChanges();
  });

  it('should debounce search input', () => {
    const searchSpy = spyOn(component, 'performSearch');

    const inputElement = fixture.debugElement.query(By.css('input')).nativeElement;
    inputElement.value = 'test';
    inputElement.dispatchEvent(new Event('keyup'));

    expect(searchSpy).not.toHaveBeenCalled();

    fixture.detectChanges();

    expect(searchSpy).toHaveBeenCalledTimes(1);
    expect(searchSpy).toHaveBeenCalledWith('test');
  });
});