用concatMap() Angular7测试链式http请求

Question

我想简单地测试我的todo.service-方法：

create(listId: number, name: string): Observable<TodoItem[]> {
    const URL = `${this.apiUrlService.getApiUrl('list')}${listId}/Item`;

    return this.http.post(URL, { value: name }).pipe(concatMap(() => this.getAllTodoItemsByListId(listId)));
}

如您所见，这是一个链接的http-调用，并结合了concatMap()；

最后我尝试了几件事，这就是我目前的状况：

it('should create an todoItem', fakeAsync(() => {
    const mockTodoItem = new TodoItem(1, 1, 'Test1');
    let postResponse: TodoItem[];

    todoItemService.create(1, 'NameOfList').subscribe((todoItems: TodoItem[]) => {
        postResponse = todoItems;
    });
    tick();
    httpMock
        .expectOne({
            url: `${apiUrlService.getApiUrl('list')}1/Item`,
            method: 'POST',
        })
        .flush(mockTodoItem);
    tick();
    expect(postResponse).toEqual([mockTodoItem]);

    httpMock.verify();
}));

我的beforeEach()：

beforeEach(() => {
    TestBed.configureTestingModule({
        providers: [TodoItemService, { provide: ApiUrlService, useClass: ApiUrlService }],
        imports: [HttpClientTestingModule],
    });

    todoItemService = TestBed.get(TodoItemService);
    httpMock = TestBed.get(HttpTestingController);
    apiUrlService = TestBed.get(ApiUrlService);
});

我在订阅书里不知道。如果创建调用看起来像：

create(listId: number, name: string): Observable<TodoItem[]> {
    const URL = `${this.apiUrlService.getApiUrl('list')}${listId}/Item`;

    return this.http.post(URL, { value: name }));
}

只需执行POST请求订阅触发器。(但显然不是我想要的)所以我知道，我不得不嘲笑第二次接电话，也许也是？！

.match()操作符在HttpClientTestingModule上并没有真正帮助我。

Answer 1

您需要模拟getAllTodoItemsByListId返回的内容。也许是这样的：

it('should create an todoItem', fakeAsync(() => {
    const mockTodoItem = new TodoItem(1, 1, 'Test1');
    spyOn(todoItemService, 'getAllTodoItemsByListId').and.returnValue(of(mockTodoItem));
    let postResponse: TodoItem[];

    todoItemService.create(1, 'NameOfList').subscribe((todoItems: TodoItem[]) => {
        postResponse = todoItems;
    });
    tick();
    httpMock
        .expectOne({
            url: `${apiUrlService.getApiUrl('list')}1/Item`,
            method: 'POST',
        })
        .flush(mockTodoItem);
    tick();
    expect(postResponse).toEqual([mockTodoItem]);

    httpMock.verify();
}));

如果您还没有此导入，则可能还需要此导入：

import { of } from 'rxjs';