AngularJS + Karma + Ng-html2js => Не удалось создать модуль... html

Я не могу заставить Karma работать для директив с внешними шаблонами.

Вот мой конфигурационный файл кармы:

preprocessors: {
    'directives/loading/templates/loading.html': 'ng-html2js'
},

files: [
    ...
    'directives/loading/templates/loading.html',
]

ngHtml2JsPreprocessor: {
    prependPrefix: '/app/'
},

В файле директивы:

...
templateUrl: '/app/directives/loading/templates/loading.html'
...

В спецификационном файле:

describe('Loading directive', function() {
    ...
    beforeEach(module('/app/directives/loading/templates/loading.html'));
    ...
});

Я получаю следующую ошибку:

Не удалось создать экземпляр модуля /app/directives/loading/templates/loading.html из-за: Ошибка: нет модуля:/app/directives/loading/templates/loading.html

Если я модифицирую исходный код препроцессора karma-ng-html2js, чтобы напечатать результат сгенерированный файл, я получаю:

angular.module('/app/directives/loading/templates/loading.html', []).run(function($templateCache) {
    $templateCache.put('/app/directives/loading/templates/loading.html',
        '<div ng-hide="hideLoading" class="loading_panel">\n' +
        '   <div class="center">\n' +
        '       <div class="content">\n' +
        '           <span ng-transclude></span>\n' +
        '           <canvas width="32" height="32"></canvas>\n' +
        '       </div>\n' +
        '   </div>\n' +
    '</div>');
});

Итак, кажется, что сгенерированный JS файл правильный, но не загруженный кармой...

Кроме того, если я использую debug на уровне журнала, вот строки, связанные с шаблоном:

DEBUG [preprocessor.html2js]: Обработка "/home/rightink/public_html/bo2/master/web/app/directives/loading/templates/loading.html"

DEBUG [наблюдатель]: разрешенные файлы:
      /correct/path/to/the/app/directives/loading/templates/loading.html.js

Я что-то пропустил?

Спасибо,

Ответ 1

Проблема может заключаться в том, что относительные пути, указанные в разделе file, расширяются до полных.

Что-то вроде directives/loading/templates/loading.html = > /home/joe/project/angular-app/directives/loading/templates/loading.html

... и затем шаблоны регистрируются с их полными путями.

Решение состоит в том, чтобы сконфигурировать препроцессор ng-html2js для удаления абсолютной части путей шаблона. Например, в файле karma.conf.js добавьте директиву stripPrefix следующим образом:

ngHtml2JsPreprocessor: {
    // strip this from the file path
    stripPrefix: '.*/project/angular-app/'
    prependPrefix: '/app/'
}

Обратите внимание, что stripPrefix является регулярным выражением.

Ответ 2

У вас может быть кеш-память до процессора к вашим модулям, которые затем могут быть включены до ваших тестов:

karma.conf.js

files: [
  ...
  'app/**/*.html'
],

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

ngHtml2JsPreprocessor: {
   moduleName: 'templates'
},

директивный файл

...
templateUrl: 'app/path-to-your/template.html',
...

специфицированный файл

describe('My directive', function() {

  beforeEach(module('templates'));
  ...
});

Ответ 3

Это может быть не ваша точная проблема, но в нашем приложении нам нужно добавить следующее в karma.conf.js:

ngHtml2JsPreprocessor: {
    cacheIdFromPath: function(filepath) {
        return '/vision/assets/' + filepath;
    }
}

Соответствующие настройки препроцессоров выглядят следующим образом:

preprocessors: {
    'views/**/*.html': 'html2js'
},

Насколько я понял, это связано с использованием абсолютных URL-адресов в AngularJS при указании шаблонов - какая карма переписывалась при выполнении тестов?

В любом случае надеюсь, что это поможет.

Ответ 4

Я изучаю AngularJS и сталкиваюсь с той же проблемой. Я понятия не имею, почему, но изменение порта в karma.conf.js исправило это для меня.

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

    ...

    port: 9877,

    ...

  });
};

Edit:

После небольшого тестирования я обнаружил, что проблема только в Chrome, и была решена путем явной очистки всей истории браузера (Ctrl + F5 не работает).