4

AngularJS アプリのカルマ テストを設定しようとしていますが、どういうわけか常に失敗しています。ここのすべての手順に従いましたが、ng-html2js プリプロセッサが正しく機能していないように感じます。私は常に次のメッセージを受け取ります：

エラー: 予期しない要求: GET js/templates/my-template.template.html

これが私のコード構造です

コード構造

そしてここに私のテスト構造

ここに画像の説明を入力

私がテストしようとしているディレクティブは次のとおりです。

angular
    .module('myapp')
    .directive('myDirective', ['myService', function (myService) {
        return {
            restrict: 'E',
            templateUrl: 'js/templates/my-template.template.html',
            scope: {},
            link: function (scope) {
            }
        }
    }]);

私のカルマconfは次のようになります：

module.exports = function (config) {
config.set({

    basePath: '../../',

    frameworks: ['jasmine'],


    files: [
        //some omitted like angular and so on...
        'main/resources/static/**/*.js',
        '**/*.html',
        'test/js/**/*Spec.js'
    ],

    preprocessors: {
        '**/*.html': ['ng-html2js']
    },

    ngHtml2JsPreprocessor: {
        moduleName: 'templates'
    }
... (more default stuff omitted)
}

および mySpec.js は次のようになります。

describe('directive', function () {
    'use strict';

    beforeEach(module('myapp'));
    beforeEach(module('templates'));

    var elm,
        scope;

    beforeEach(inject(function ($rootScope, $compile) {
        elm = angular.element(
        '<my-directive>' +
        '</my-directive>');

        scope = $rootScope.$new();

        $compile(elm)(scope);
        scope.$digest();
    }));

    describe('Does something', function () {
        console.log('test');
        expect(true).toBe(true);
    });
});
4

2 に答える 2

1

beforeEach 関数に、ディレクティブの html テンプレートのモック テンプレートを追加します。使用$templateCache:

describe('directive', function () {
    'use strict';

    beforeEach(module('myapp'));
    beforeEach(module('templates'));

    var elm,
        scope;

    beforeEach(inject(function ($rootScope, $compile, $templateCache) {


        $templateCache.put('js/templates/my-template.template.html','HTML_OF_YOUR_DIRECTIVE');

        elm = angular.element(
        '<my-directive>' +
        '</my-directive>');

        scope = $rootScope.$new();

        $compile(elm)(scope);
        scope.$digest();
    }));

    describe('Does something', function () {
        console.log('test');
        expect(true).toBe(true);
    });
});
于 2016-06-17T18:30:10.603 に答える
1

私はそれを手に入れたと思います。解決策は karma.conf.js にありました:

ngHtml2JsPreprocessor: {
    cacheIdFromPath: function (filepath) {
        //The suggested filepath.strip would through an error
        var cacheId = filepath.replace('main/resources/static/', '');
        return cacheId;
    },
    moduleName: 'templates'
}
于 2016-06-17T19:30:19.073 に答える