Angular тестирует вызовы HTTP Post

У меня есть угловой компонент, который будет размещать некоторые данные по URL-адресу в нашем приложении, а затем ничего не делает, так как данные не возвращаются из этого сообщения. У меня возникли проблемы с тестированием этого, поскольку обычно HTTP-запросы проверяются путем подписки на наблюдаемые, которые они возвращают. В данном случае это не нужно раскрывать.

вот мой код компонента:

shareData(): void {
    this.isFinishing = true;
    this.myService.sendSharedData$()
        .pipe(first())
        .subscribe(() => {
            //Data s now shared, send the request to finish up everything
            this.submitFinishRequest();
        }, (e: Error) => this.handleError(e)));
}

private submitFinishRequest(): void {
    //submit data to the MVC controller to validate everything,

    const data = new FormData();
    data.append('ApiToken', this.authService.apiToken);
    data.append('OrderId', this.authService.orderId);

    this.http.post<void>('/finish', data)
        .pipe(first())
        .subscribe((d) => {
            // The controller should now redirect the app to the logged-out MVC view, so there's nothing more we need to do here
            this.isFinishing = false;
        }, (e: Error) => this.handleError(e));
}

И вот мой тестовый код

let component: FinishComponent;
let fixture: ComponentFixture<FinishComponent>;
let myService: MyService;
let httpMock: HttpTestingController;

beforeEach(async(() => {
    TestBed.configureTestingModule({
        imports: [ HttpClientTestingModule ],
        declarations: [ FinishComponent ],
        providers: [ MySerVice ],
    }).compileComponents();
}));

beforeEach(() => {
    fixture = TestBed.createComponent(FinishComponent);
    component = fixture.componentInstance;
    myService = TestBed.get(MyService);
    httpMock = TestBed.get(HttpTestingController);
    sendSharedData$Spy = spyOn(myService, 'sendSharedData$');

    //Add some accounts and shared items to the service for all of these tests 
    accountsService.dataToShare = ['foo', 'bar'];
});

afterEach(() => {
    httpMock.verify();
});

it('should make an HTTP POST to the `/finish` MVC Controller after successfully sharing data', () => {
    sendSharedData$Spy.and.callThrough(); //call through using data provided in `beforeEach`

    fixture.detectChanges(); //triggers ngOnInit()
    component.shareData();
    fixture.detectChanges();

    const req = httpMock.expectOne('/finish');

    expect(req.request.method).toEqual('POST');
    expect(req.request.body).toEqual({
        apiKey: 'api-key-98765',
        orderId: 'order-id-12345'
    });

    //server can send back any data (except for an error) and we would respond the same way, so just send whatever here
    req.flush('');
});

Что я на самом деле получаю в своем тесте:

Error: Expected one matching request for criteria "Match URL: /finish", found none.

Я думаю, это происходит из-за того, что я не подписываюсь на http.post() внутри своего теста, но если я это сделаю, разве это не отменяет полностью причину, по которой я тестирую этот метод? мне не нужно подписываться на вещи, если мои методы уже делают это, верно?

Кроме того, когда я запускаю это с другими тестами, другой несвязанный тест обычно не работает с

Error: Expected no open requests, found 1: POST /finish

Что указывает мне на то, что запрос выполняется, но в неправильное время, или я как-то не жду его должным образом.


Изменить - теперь это исправлено

Проблема возникла из-за .and.callThrough(). Я заменил это на .and.returnValue(of([... some data here ...]));, теперь все работает как положено. Извините за беспокойство и спасибо за помощь и идеи!


person CBarr    schedule 29.04.2019    source источник
comment
В самом методе я делаю подписку на метод submitFinishRequest. Я просто не подписываюсь на тест, так как это, кажется, противоречит цели   -  person CBarr    schedule 29.04.2019
comment
Да, извините, я неправильно прочитал код. Почему вы тестируете компонент и сервис одновременно, вместо того, чтобы тестировать только сервис и просто издеваться над ним в компоненте?   -  person JB Nizet    schedule 29.04.2019
comment
Что делает sendShareData? Если он отправляет HTTP-запрос, вы никогда не сообщаете тестовому контроллеру, что возвращать и когда сбрасывать ответ для этого первого запроса, поэтому обратный вызов подписки никогда не вызывается, поэтому второй запрос завершения никогда не отправляется.   -  person JB Nizet    schedule 29.04.2019
comment
Пользователь может отправить нам данные, а затем, как только мы убедимся, что получили их, мы отправили еще один запрос на URL-адрес /finish для правильного выхода из системы. Итак, этот метод работает, и он правильно подписывается, и он также правильно вызывает этот частный метод. просто он не вызывает метод http.post вовремя. Я пытался добавить fakeAsync и tick(), но это не работает.   -  person CBarr    schedule 29.04.2019
comment
Тьфу.. Я исправил это. проблема возникла из-за .and.callThrough(). Я заменил это на .and.returnValue(of([... some data here ...]));, теперь все работает как положено.   -  person CBarr    schedule 29.04.2019


Ответы (1)


Попробуйте в тесте вызвать метод с помощью вашего сервиса: myService["sendSharedData"] ().subscribe(); Вы используете этот подход, когда хотите вызвать частные методы. Вам больше не нужен шпион, и он должен работать. Я надеюсь :) .

person Robert Tab    schedule 29.04.2019
comment
Спасибо, но на самом деле это действительно правильно вызывает мой частный метод в настоящее время. Он просто не вызывает метод/подписку http.post() внутри этого частного метода. Я пытался ждать его с помощью fakeAsync и tick(100), но это, похоже, не помогает. - person CBarr; 29.04.2019
comment
Мне просто любопытно, если вы воспользуетесь моим подходом и поместите в req,flush() данные, которые вы вернули в своем шпионе, не сработает? - person Robert Tab; 30.04.2019
comment
У меня есть 2 разных запроса данных. Один отправляет некоторые данные (через службу), и когда эта наблюдаемая успешна, я вызываю второй запрос, просто через простой http.post здесь (не в службе). У меня возникли проблемы с проверкой второго вызова. Первый завершится нормально и вызовет частный метод, у меня просто были проблемы с вызовом http.post проверяемым способом. Я предполагал, что то, как я это сделал раньше, заставит его работать как обычно, но мне нужно было иметь .and.returnValue() вместо .and.callThrough() - см. Мои правки в конце моего исходного вопроса. - person CBarr; 30.04.2019