Jest.js 测试功能路由解析器

pftdvrlh  于 2023-03-16  发布在  Jest
关注(0)|答案(1)|浏览(182)

基于类的路由解析器最近在Angular中被弃用,取而代之的是函数解析器。请参阅文档here
有人有单元测试这些函数解析器的例子吗?
我在Angular文档中找不到任何示例,而且Angular测试环境很难配置。因此,例如,一个单元如何测试文档中的示例函数?

export const heroResolver: ResolveFn<Hero> =
    (route: ActivatedRouteSnapshot, state: RouterStateSnapshot) => {
      return inject(HeroService).getHero(route.paramMap.get('id')!);
    };

我使用的解析器基本上与此相同,因为它调用一些服务来通过ID获取实体。当尝试在Jest中配置调用解析器时,我得到以下错误:

NG0203: inject() must be called from an injection context such as a constructor, a factory function, a field initializer, or a function used with `EnvironmentInjector#runInContext`. Find more at https://angular.io/errors/NG0203
nx7onnlm

nx7onnlm1#

这是一个我与自己斗争过的问题,直到我找到了解决方案,我才能放下,现在我很高兴地向你们展示这个解决方案;)
我在Netanel巴塞尔的这篇优秀文章中找到了我想要的东西,文章标题为 Testing DI Functions in Angularhttps://netbasal.com/testing-di-functions-in-angular-37a5e7ed75f9 .
您需要的API是TestBed.runInInjectionContext(),并且是在Angular 15.1中发布的,所以是最近的东西。
假设getHero()返回一个可观察值,则解决方案如下所示:

it('should call getHero()', (done) => {
    TestBed.runInInjectionContext(() => heroResolver(routeMock, stateMock)).subscribe(() => {            
        expect(heroServiceMock.getHero).toHaveBeenCalledWith(routeMock.paramMap['id']);
        done();
    });
});

我在这里并不是测试getHero()返回的内容,这可能是您想要为您的特定用例添加的内容。routeMockstateMock是您必须为您的测试用例设置和填充的模拟。
希望这能有所帮助!

相关问题