使用 Jest 测试 TranslatePipe

Question

当我尝试在 Angular 项目中运行测试时遇到此错误

 NavigationMainComponent › should create

    TypeError: Cannot read properties of undefined (reading 'subscribe')

      at _TranslatePipe.transform (node_modules/@ngx-translate/core/dist/fesm2022/ngx-translate-core.mjs:928:75)

我尝试模拟 TranslatePipe 但没有任何变化。我以这种方式嘲笑了 TranslateService：

{ provide: TranslateService, useValue: mock.translateServiceMock },

export const translateServiceMock = {
  addLangs: jest.fn(),
  setDefaultLang: jest.fn(),
  use: jest.fn().mockReturnValue(of('da')),
  getLangs: jest.fn().mockReturnValue(['da', 'en']),
  get: jest.fn().mockReturnValue(of('translated text')),
  instant: jest.fn((key: string) => key),
  onLangChange: of({ lang: 'en' }),
};

我在导入中添加了 TranslateModule.forRoot() 。 我不知道缺少什么才能使测试正常运行。

Answer 1

TranslatePipe

内部订阅了

onTranslationChange

和

onDefaultLangChange

。您的模拟翻译服务不会模拟这些属性，因此它们未定义并导致错误。你也需要嘲笑那些。

export const translateServiceMock = {
  addLangs: jest.fn(),
  setDefaultLang: jest.fn(),
  use: jest.fn().mockReturnValue(of('da')),
  getLangs: jest.fn().mockReturnValue(['da', 'en']),
  get: jest.fn().mockReturnValue(of('translated text')),
  instant: jest.fn((key: string) => key),
  onLangChange: of({ lang: 'en' }),
  // add the following 2 lines
  onTranslationChange: of(),
  onDefaultLangChange: of(),
};