Angular 1.x，ES5 / ES6以及使用Karma進行測試

Question

我有一個我正在為其開發測試的有角度的應用程序（混合了文件ES5和ES6）。 我正在使用babel CLI通過這些選項--modules system --module-ids來轉譯ES6文件。 假設我有這樣的事情：

ES5文件：

angular.module('app').controller('A', function($scope) {
    ...
});

ES6文件：

export class B {
    constructor($scope) {
        this.$scope = $scope 
    }

   ...
}

我有一個名為boot.js的文件：

import {B} from 'controllers/B';

angular.module('app').controller('B', B);

在我的頁面上，我導入啟動文件（使用es6-module-loader）並引導角度應用程序：

System.import('boot').then(function() {
    angular.bootstrap(document, ['app']);
});

現在，我假設我需要做一些與業力測試類似的事情-在運行測試之前，我需要加載boot.js。 解決問題的方法是在測試文件中調用System.impot（'boot'）-但似乎不正確：

'use strict';

System.import('boot');

describe('Controller: B', function() {
    beforeEach(module('app'));

    var $scope;

    beforeEach(inject(function(_$rootScope_, $controller) {
        scope = _$rootScope_.$new();

        $controller('B', {$scope: $scope); 
    }));

    it('...', function() {

    });
});

有一個更好的方法嗎？

Answer 1

我最終找到的解決方案涉及使用karma-systemjs 。

在systemjs / files部分中包括所有測試文件：

 systemjs: {
     files: [
         // TEST FILES
     ],

     configFile: 'system.config.js',

     config: {
         paths: {
             'angular-mocks': 'node_modules/angular-mocks/angular-mocks.js'
         }
     }
}

並在測試中代替使用：

System.import('boot');

采用：

'use strict';

import 'angular-mocks';
import 'angular/boot.js';

describe('Controller: B', function() {
    beforeEach(module('app'));

    var $scope;

    beforeEach(inject(function(_$rootScope_, $controller) {
        scope = _$rootScope_.$new();

        $controller('B', {$scope: $scope); 
    }));

    it('...', function() {

    });
});

希望這會在將來對其他人有所幫助。