angular e2e 测试：如何测试服务注入（使用）另一个服务

Question

我正在尝试使用 e2e 测试来测试我的服务 angular 7，我的问题是我不知道该怎么做：

这是我的服务，（方法 return 可观察）：

import { Injectable } from '@angular/core';
import { UrlDecoratorService } from "../../common/url-decorator.service";
import { APIFetcherService } from "../common/api-fetcher.service";
import { Observable } from 'rxjs';
import { IALChrono, ALChrono } from '../../common/IALChrono.interface';

@Injectable()
export class AnnonceChronoDetailService {
    private months: string[];
    constructor(private urlDecoratorService: UrlDecoratorService, private apiFetcher: APIFetcherService) {
    }

    fetchData(chronoInfo: ALChrono): Observable<any> {
        // construct API parameters and URL
        var URL: string = this.urlDecoratorService.urlAPIDecorate("AL", "GetAccessChrono");

        var params = this.urlDecoratorService.generateParameters({
            year: chronoInfo.year,
            month: chronoInfo.month,
            sortBy: chronoInfo.sortBy,
            sortDirection: chronoInfo.sortDirection,
            pageNumber: chronoInfo.currentPage,
            pageSize: chronoInfo.pageSize
        });

        return this.apiFetcher.fetchJson(URL, params);
    }
}

它在我的服务中还有另外两个服务，UrlDecoratorService 和 APIFetcherService。

这是我的端到端测试：

import { AppPage } from './app.po';
import { AnnonceChronoDetailService } from '../../src/app/services/annonce-legale/annonce-chrono-detail.service';
import { ALChrono } from '../../src/app/common/IALChrono.interface';
import { APIResponse } from '../../src/app/common/api-response.interface';
import { Observable } from 'rxjs';

describe('workspace-project App', () => {
  let page: AppPage;
  let service: AnnonceChronoDetailService;
  this.chronoInfo = new ALChrono(); //it's a class

  beforeEach(() => {
    page = new AppPage();
  });

  it('should display welcome message', () => {
    page.navigateTo();
    expect(page.getParagraphText()).toEqual('Welcome to MyProject!');
  });


  it('#getObservableValue should return value from observable', (done: DoneFn) => {
    service.fetchData(this.chronoInfo).subscribe((resp: APIResponse) => {
      expect(resp.dataCount).toBe(5);
      done();
    });
  });
});

我需要的是如何将 UrlDecoratorService 和 APIFetcherService 这两个服务注入到我的 e2e 测试中，或者如何测试注入的服务其他服务？

如果您需要更多信息请告诉我。

Answer 1

所以端到端测试的目的是实际试用您的应用程序的构建形式，基本上您已经完成了

ng build

在您的应用程序上，之后您可以在本地托管（您也可以在外部托管）您刚刚创建的构建。

所以基本上你的服务包含在这些包中（更精确地在你的主包中）所以你不需要设置任何配置而是开始使用量角器 api 和 browser 测试你的应用程序并且很快。因此，在查看您的问题时，您的测试文件可能看起来更像这样：

  describe('workspace-project App', () => {
   let page: AppPage;
   this.chronoInfo = new ALChrono(); //it's a class

   beforeEach(() => {
     page = new AppPage();
   });

   it('should display welcome message', () => {
     page.navigateTo();
     expect(page.getParagraphText()).toEqual('Welcome to MyProject!');
   });
  }

所以包含服务测试的代码应该包含在你的单元测试中如果您不确定量角器的工作原理，我建议您阅读更多有关设置工作原理的文档。

angular e2e 测试：如何测试服务注入（使用）另一个服务

angular e2e testing : how to test Service inject(use) another services

protractor

e2e-testing

angular

angular-e2e

angular-test