Không thể tải tệp HTML mẫu trong bài kiểm tra Karma cho chỉ thị Góc

Question

Mặc dù một số người có cùng vấn đề (như [ở đây] [1] hoặc [ở đó] [2]), tôi không thành công để kiểm tra chỉ thị của mình ứng dụng Angular (1.2.25) của tôi.

Dưới đây là cấu trúc dự án của tôi:

myapp 
    +- src/main/java/resources/META-INF/resources/workflow/directives 
    | +- directives.js 
    | +- *.html (all templates) 
    +- src/test/javascript 
     +- karma.conf.js 
     +- spec/directives 
      +- text-input.spec.js 

(có, không phải là một cấu trúc tốt, nhưng ứng dụng kiễu góc của tôi là bị mắc kẹt trong một dự án Java)

cấu hình nghiệp của tôi:

// Karma configuration 
module.exports = function (config) { 

    config.set({ 
     ... 
     // base path, that will be used to resolve files and exclude 
     basePath: '', 
     // testing framework to use (jasmine/mocha/qunit/...) 
     frameworks: ['jasmine'], 
     // list of files/patterns to load in the browser 
     files: [ 
      // Third parties dependencies: jQuery, Angular, Angular modules, Angular mocks 
      '../../main/resources/META-INF/resources/workflow/bower_components/...', 

      // My directives 
      '../../main/resources/META-INF/resources/workflow/directives/*.html', 
      '../../main/resources/META-INF/resources/workflow/directives/*.js', 

      // My application 
      '../../main/resources/META-INF/resources/workflow/scripts/*.js', 
      '../../main/resources/META-INF/resources/workflow/app/**/*.js', 

      // My Test files 
      'spec/directives/*.js' 
     ], 

     // list of files/patterns to exclude 
     exclude: [], 
     // web server port 
     port: 8888, 

     browsers: [ 'Chrome' ], 

     // Which plugins to enable 
     plugins: [ 
      'karma-ng-html2js-preprocessor', 
      'karma-chrome-launcher', 
      'karma-jasmine' 
     ], 

     preprocessors: { 
      '../../main/resources/META-INF/resources/workflow/directives/*.html': [ 'ng-html2js' ] 
     }, 
     ngHtml2JsPreprocessor: { 
      // Not sure what to put here... 
     }, 
     ... 
    }); 
}; 

Bài kiểm tra của tôi:

describe('directive: text-input', function() { 
    var element, scope; 
    beforeEach(module('myApp')); 

    beforeEach(inject(function($rootScope, $compile) { 
     scope = $rootScope.$new(); 
     element = '<div my-input-text data-label="Foo" data-model="bar"></div>'; 
     element = $compile(element)(scope); 
     scope.$digest(); 
    })); 

    describe('basics tests', function() { 
     it('should be editable', function() { 
      expect(element.text()).toBe('Foo'); 
     }); 
    }); 
}); 

Và chỉ thị riêng của mình:

var myDirs = angular.module('my-directives', []); 

// Text input 
myDirs.directive('myInputText', function() { 
    return { 
     replace: true, 
     templateUrl: 'directives/text-input.html', 
     scope: { 
      label: '=', 
      readOnly: '=', 
      code: '=', 
      model: '=' 
     } 
    }; 
}); 

Khi chạy các bài kiểm tra (grunt karma), tôi nhận được rằng lỗi:

Chrome 31.0.1650 (Windows 7) directive: text-input basics tests should be editable FAILED 
    Error: Unexpected request: GET directives/text-input.html 
    No more request expected 

tôi vẫn không nhận được những gì tôi làm sai trong tiền xử lý của tôi. Tôi đã thử nhiều cấu hình khác nhau trong ngHtml2JsPreprocessor, nhưng lỗi luôn giống nhau. tôi thấy trong các bản ghi DEBUG rằng bộ vi xử lý trước khi đang làm việc trên các tập tin HTML mẫu của tôi:

DEBUG [preprocessor.html2js]: Processing "d:/dev/my-app/src/main/resources/META-INF/resources/workflow/directives/text-input.html". 

Cảm ơn.

Answer 1

Cuối cùng tôi đã tìm được giải pháp. Trong karma.conf.js của tôi, tôi đặt một module-name, như thế:

ngHtml2JsPreprocessor: { 
     moduleName: 'my-directives' 
    }, 

sau đó, trong thử nghiệm Jasmine, tôi thêm nó:

beforeEach(module('myApp')); 
beforeEach(module('my-directives')); 

giải pháp khác là trực tiếp thiết lập các tập tin HTML như là một mô-đun mà không thay đổi karma.conf.js:

beforeEach(module('directives/text-input.html')); 

Nhưng không phải là một giải pháp tốt như tôi có chục directives/*.html ...