angularjs - Jest 和混合 Angular/AngularJS 应用程序

Question

我正在考虑使用 jest 来测试我的混合应用程序(Angular + AngularJS)。我正在使用 jest-preset-angular 进行 Angular 测试，但我还需要 angular-mocks 进行 AngularJS 测试。

问题是当我在 setupJest.ts 中同时导入 jest-preset-angular 和 angular-mocks 时，所有测试(Angular和 AngularJS)失败，出现 Cannot read property '$injector' of null 错误(来自 angular-mocks)。

如果我只导入 jest-preset-angular 所有 Angular 测试都会通过，如果我只导入 angular-mocks 所有 AngularJS 测试都会通过。

如何让它协同工作？

package.json:

"jest": {
    "preset": "jest-preset-angular",
    "setupTestFrameworkScriptFile": "<rootDir>/src/setupJest.ts"
}

setupJest.ts:

import 'jest-preset-angular';
import 'angular';
import 'angular-mocks';

const mock = () => {
    let storage = {};
    return {
        getItem: key => key in storage ? storage[key] : null,
        setItem: (key, value) => storage[key] = value || '',
        removeItem: key => delete storage[key],
        clear: () => storage = {},
    };
};

Object.defineProperty(window, 'localStorage', {value: mock()});
Object.defineProperty(window, 'sessionStorage', {value: mock()});
Object.defineProperty(window, 'getComputedStyle', {
    value: () => ['-webkit-appearance']
});

Answer 1

事实证明顺序很重要。
在 jest-preset-angular 之前导入 angular-mocks 修复了这个问题:

import 'angular';
import 'angular-mocks';
import 'jest-preset-angular';