测试在订阅中设置的属性的值

Question

我正在使用 Jasmine 测试一个 Angular 应用程序，我试图弄清楚如何测试在组件内的 Observable 上的 subscribe 调用中设置的属性的值。我在这里整理了一个示例组件来说明这一点。

@Component({
    selector: 'app-list',
    templateUrl: './list.component.html',
    styleUrls: ['./list.component.css']
})
export class ListComponent {
    public Result[] Items;


    constructor(private myService: MyService) {

this.formControl.valueChanges.pipe( switchMap(value => myService.getResults(value)) ).subscribe(results => this.Items = results); } }

在此示例中，对于我的测试，我将从内部调用 getResults()，并进行测试以确保填充了 Items。由于这不能保证立即发生，但subscribe 逻辑完全在组件内，我应该如何等待以确保在检查Items 的值时不会得到undefined？

编辑：这是迄今为止我如何测试它的示例。请注意，我已经更新了上面代码中的注释如何表明 observable 是由于 FormControl 值更改而被订阅的，而不仅仅是按钮单击，因此下面的 detectChanges。

it(‘should pull results’, () => {
    const componentFixture = TestBed.createComponent(ListComponent);
    const component = componentFixture.componentInstance;
    const myService = TestBed.inject(MyService);
    spyOn(myService, ‘getResults’).and.returnValue(of([myTestItems]));
    component.formControl.setValue(‘abcdefg’);
    componentFixture.detectChanges();
    expect(component.Items).toEqual([myTestItems]);
}

Answer 1

你必须在你的测试中实现request方法，以获得结果和状态，重点是使用status来确保你的api工作正常，你也可以使用timeout来获得响应。

const request = require('request');
const endpoint = 'http://localhost:3000/city';

//get
it('should return 200 response code', function (done) {
    request.get(endpoint, function (error, response) {
        expect(response.statusCode).toEqual(200);
        done();
    });
});
//post
it('should fail on POST', function (done) {
    request.post(endpoint, {json: true, body: {}}, function (error, response) {
        expect(response.statusCode).toEqual(404);
        done();
    });
});

Answer 2

这取决于你如何嘲笑myService.getResults()。如果它返回一个of(<IResult[]>)（它应该是这样的IMO），订阅将同步运行，因此它会立即运行。

it('should set items on click', () => {
  // click on the element and make sure pullResults() gets called.
  // here we will call it directly
  // Make sure you are mocking myService.getResults() to return an observable in the form 
  // of `of([...])`
  component.pullResults();
  // go ahead and make the assertion right away
  expect(component.Items).toEqual(myTestItems);
});