使用 Jest 在 Angular 中模拟 class

Question

我一直在努力模拟一个我想测试的函数。我一直在阅读 Jest 文档，我确信答案可能就在某处，但我只能将各个部分拼凑起来才能使其发挥作用。我也找不到任何以前的问题让我解决了我的问题，因为我调查的许多问题似乎有点过时了。

这是我要测试的功能（有点简化）：

export function getOrganizationAdministrationLinks(permissions: RolePermission[], features: FeatureEnum[],
    translateService: CustomTranslateService): Array<{ name: string, target: string } | 'divider'> {
const uiLinks = new Array<{ name: string, target: string }>();
const organizationLinks = new Array<{ name: string, target: string }>();
const tradingLinks = new Array<{ name: string, target: string }>();

if (havePermissionsAndFeatures(permissions, features, OrganizationSettingsPermissions.permissions, OrganizationSettingsPermissions.features)) {
    uiLinks.push({ name: translateService.get('something'), target: 'interface' });
}

return [uiLinks, organizationLinks, tradingLinks]
    .filter(group => group.length > 0)
    .flatMap(group => [...group, 'divider' as const])
    .slice(0, -1);

我遇到问题的依赖项是 CustomTranslateService。它看起来像这样：

export class CustomTranslateService {

public onLangChange: EventEmitter<LangChangeEvent>;

constructor(private readonly translate: TranslateService,
            private readonly userBrowserStateService: UserBrowserStateService) {
    this.onLangChange = this.translate.onLangChange;
    this.setCulture(this.userBrowserStateService.getCulture());
}
/**
 * Returns a translation for the translation key & params.
 */
public get(key: I18nKey): string {
    if (typeof key === 'string') {
        return this.translate.instant(key);
    } else {
        return this.translate.instant(key.key, key.params);
    }
}

我遇到的问题是，当调用 getOrganizationAdministrationLinks 这是我要测试的函数时，我必须传递一个 CustomTranslateService。 CustomTranslateService 本身有依赖关系，我不知道如何模拟它。我怀疑我可能不得不手动模拟它，但感觉有点矫枉过正，因为我只想模拟 get 方法的 return 调用。

我只使用 jest 和 jest-preset-angular 包。我看到了一些使用 ts-jest 的建议，但我不确定是否需要它。我也在 Angular 12.0.2 和 TypeScript 4.1.3.

Answer 1

这是我想要实现的解决方案的基本测试：

    test('getOrganizationAdministrationLinks should return correct name and target when called with rolePermissions and features', () => {
    const expected = [{
        name: 'overruns',
        target: 'interface'
    }];

    const translateService: Partial<CustomTranslateService> = { get: () => 'overruns' } ;
    const actual = getOrganizationAdministrationLinks(rolePermissions, features, translateService as CustomTranslateService);

    expect(actual).toEqual(expected);
});

感谢@jonrsharpe 的一般帮助和 link！

使用 Jest 在 Angular 中模拟 class

Mock class in Angular using Jest

typescript

jestjs

angular