首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >角13 TestBed不注入拦截器

角13 TestBed不注入拦截器
EN

Stack Overflow用户
提问于 2022-02-24 11:30:50
回答 1查看 937关注 0票数 0

我有一个具有自定义HTTP客户端和拦截器的角13应用程序,我想对其进行单元测试。

base-url.interceptor.ts

代码语言:javascript
运行
复制
import { Inject, Injectable } from '@angular/core';
import { HttpRequest, HttpHandler, HttpEvent, HttpInterceptor } from '@angular/common/http';
import { Observable } from 'rxjs';

export const BASE_API_URL = 'BASE_API_URL';

@Injectable()
export class BaseUrlInterceptor implements HttpInterceptor {
  constructor(@Inject(BASE_API_URL) private baseUrl: string) {}

  intercept(request: HttpRequest<unknown>, next: HttpHandler): Observable<HttpEvent<unknown>> {
    const apiRequest = request.clone({ url: `${this.baseUrl}${request.url}` });
    return next.handle(apiRequest);
  }
}

base-url.interceptor.spec.ts

代码语言:javascript
运行
复制
import { TestBed } from '@angular/core/testing';
import { ApiHttpService, API_HTTP_INTERCEPTORS } from '../api-http.service';
import { BaseUrlInterceptor, BASE_API_URL } from './base-url.interceptor';

describe('BaseUrlInterceptor', () => {
  let interceptor: BaseUrlInterceptor;

  beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [],
      providers: [
        ApiHttpService,
        { provide: BASE_API_URL, value: 'http://example.com' },
        { provide: API_HTTP_INTERCEPTORS, useClass: BaseUrlInterceptor, multi: true }
      ]
    });
    interceptor = TestBed.inject(BaseUrlInterceptor);
  });

  it('should be created', () => {
    expect(interceptor).toBeTruthy();
  });
});

不幸的是,TestBed.inject(BaseUrlInterceptor)未能注入拦截器的实例。interceptor总是undefined。如果我通过手动创建实例new BaseUrlInterceptor('http://example.com');来解决这个问题,它可以工作,但是其他拦截器还有更多的依赖项,我想在这里使用。

如何配置TestBed,以便它能够成功地创建BaseUrlInterceptor实例

我创建了一个最小的CodeSandbox,它再现了问题:https://codesandbox.io/s/snowy-dust-t964no?file=/src/app/base-url.interceptor.spec.ts

此外,当我运行错误测试时,我会得到这个错误消息:

代码语言:javascript
运行
复制
Chrome Headless 98.0.4758.102 (Linux x86_64) BaseUrlInterceptor should be created FAILED
        Error: NG0204: unreachable
        error properties: Object({ code: 204 })
        Error: NG0204: unreachable
            at injectableDefOrInjectorDefFactory (node_modules/@angular/core/fesm2015/core.mjs:11494:1)
            at providerToFactory (node_modules/@angular/core/fesm2015/core.mjs:11556:1)
            at providerToRecord (node_modules/@angular/core/fesm2015/core.mjs:11521:1)
            at R3Injector.processProvider (node_modules/@angular/core/fesm2015/core.mjs:11424:1)
            at node_modules/@angular/core/fesm2015/core.mjs:11410:1
            at node_modules/@angular/core/fesm2015/core.mjs:4162:1
            at Array.forEach (<anonymous>)
            at deepForEach (node_modules/@angular/core/fesm2015/core.mjs:4162:1)
            at R3Injector.processInjectorType (node_modules/@angular/core/fesm2015/core.mjs:11410:1)
            at node_modules/@angular/core/fesm2015/core.mjs:11213:1
        Error: Expected undefined to be truthy.
            at <Jasmine>
            at UserContext.<anonymous> (projects/frontend/src/app/core/http/interceptors/base-url.interceptor.spec.ts:21:25)
            at ZoneDelegate.invoke (node_modules/zone.js/fesm2015/zone.js:372:1)
            at ProxyZoneSpec.onInvoke (node_modules/zone.js/fesm2015/zone-testing.js:287:1)
Chrome Headless 98.0.4758.102 (Linux x86_64): Executed 1 of 1 (1 FAILED) (0.072 secs / 0.056 secs)
TOTAL: 1 FAILED, 0 SUCCESS
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2022-02-24 13:15:46

您获得Error: NG0204: unreachable是因为当您定义BASE_API_URL的提供程序时,您使用的是属性value,而它应该是useValue

代码语言:javascript
运行
复制
{ provide: BASE_API_URL, useValue: 'http://example.com' },

无论如何,即使您修复了这个问题,您也会得到一个NullInjectorError,因为您没有定义一个使用BaseUrlInterceptor类作为InjectionToken的提供程序。您将使用该类作为API_HTTP_INTERCEPTORS令牌的提供程序之一。

在单元测试拦截器的上下文中,您应该摆脱ApiHttpService,只关注拦截器类。

你有两个选择:

手动实例化类

代码语言:javascript
运行
复制
beforeEach(() => {
    interceptor = new BaseUrlInterceptor('http://example.com');
});

或使用拦截器类作为测试床中的提供程序。

代码语言:javascript
运行
复制
beforeEach(() => {
    TestBed.configureTestingModule({
      imports: [],
      providers: [
        { provide: BASE_API_URL, useValue: 'http://example.com' },
        BaseUrlInterceptor,
      ],
    });
    interceptor = TestBed.inject(BaseUrlInterceptor);
  });

干杯

票数 2
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/71251261

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档