在 Angular 中,可以使用 HttpTestingController
来进行 Http 服务的单元测试。当涉及到 API 路径参数时,可以使用 expectOne
方法来验证请求的 URL 是否正确。
下面是一个示例解决方法的代码:
import { TestBed, inject } from '@angular/core/testing';
import { HttpClientTestingModule, HttpTestingController } from '@angular/common/http/testing';
import { DataService } from './data.service';
describe('DataService', () => {
let service: DataService;
let httpMock: HttpTestingController;
beforeEach(() => {
TestBed.configureTestingModule({
imports: [HttpClientTestingModule],
providers: [DataService]
});
service = TestBed.inject(DataService);
httpMock = TestBed.inject(HttpTestingController);
});
afterEach(() => {
httpMock.verify();
});
it('should make a GET request with correct URL parameter', () => {
const mockId = 123;
const mockData = { id: mockId, name: 'John' };
service.getData(mockId).subscribe(data => {
expect(data).toEqual(mockData);
});
const req = httpMock.expectOne(`api/data/${mockId}`);
expect(req.request.method).toBe('GET');
req.flush(mockData);
});
});
在这个示例中,我们首先导入了 HttpClientTestingModule
和 HttpTestingController
,并在 beforeEach
中初始化了 DataService
和 HttpTestingController
。
在单元测试中,我们调用了 getData
方法,该方法会发起一个 GET 请求并返回数据。我们使用 subscribe
来监听并验证返回的数据是否正确。
接下来,我们使用 httpMock.expectOne
来验证请求的 URL 是否为 api/data/${mockId}
,其中 ${mockId}
是我们传入的参数。然后,我们使用 expect
来验证请求的方法是否为 GET。
最后,我们使用 req.flush
来返回模拟的数据,并完成测试。
请注意,api/data/${mockId}
是一个示例 URL,你需要根据你的实际情况调整为正确的 API 路径参数。