Angular, Karma, tsify, woes

Question

我正在尝试设置测试，其中我们使用Angular 1.5, TSify和Karma。我非常接近，但我遇到了一个问题，我还没有完全正确:

我遵循下面描述的设置:https://github.com/cmlenz/tsify-test(这个例子不包括angular)

我从angular-mocks中得到一个错误:"Cannot set property 'mock' of undefined"

这要么是一个计时问题，要么是一个作用域问题——要么是angular-mocks加载得太快，要么是browserify封装了angular变量的作用域，而mocks看不到它。不知道。

以下是我的karma.conf.js文件的相关部分:

    frameworks: ['browserify', 'jasmine'],
    files: [
        'https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js',
        './node_modules/angular-mocks/angular-mocks.js',
        './modules/**/*.spec.ts'
    ],
    exclude: [],
    preprocessors: {
        '**/*.ts': 'browserify'
    },
    browserify: {
        debug: true,
        plugin: [
            ['tsify']
        ]
    },

这一定和我加载mock的方式有关——我的angular应用不使用它，只在测试中使用，所以这一定和它有关。

提示吗?

Answer 1

angular-mocks需要在angular和您当前的Karma配置之后加载，这不会发生- angular不会被加载，直到它需要在.ts文件之一中，其中一个.spec.ts文件是依赖的。

一个解决方案是添加一个额外的文件，它需要angular和angular-mocks，并确保在Karma的files配置中该文件位于.spec.ts文件之前。

例如，可以创建名为require-angular-mocks.js的文件:

require('angular');
require('angular-mocks');

并且可以添加到Karma配置中(替换node_modules下的angular-mocks):

files: [
    'https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js',
    './require-angular-mocks.js',
    './modules/**/*.spec.ts'
],
preprocessors: {
    '**/*.js': 'browserify',
    '**/*.ts': 'browserify'
},

这应该确保angular和angular-mocks以正确的顺序加载，并且在您的规格之前加载。请注意，如果它是.js文件，则需要在Karma的preprocessors配置中添加另一个条目。