Карма — Неожиданный токен при включении html-файла

Я пытаюсь включить простой html-файл в свой конфигурационный файл кармы, чтобы получить доступ к html-элементам из моих файлов javascript и проверить это с помощью жасмина в карме.

Но я всегда получаю сообщение об ошибке Неожиданный токен ‹. Я видел в веб-трансляции, что можно включать файлы html, но я не знаю, почему это не работает с моей конфигурацией?

заранее спасибо


karma-runner
person Jan Baer    schedule 11.07.2013    source источник

Ответы (3)


arrow_upward
-1
arrow_downward

Вам нужно использовать препроцессор html2js (или ng-html2js препроцессор при использовании AngularJS). См. описание препроцессора, как он работает.

Начиная с Karma 0.10 препроцессор html2js поставляется с Karma и настроен по умолчанию:

module.exports = function(config) {
  config.set({
    files: [
      'templates/*.html'
    ],
    preprocessors: {
      '**/*.html': ['html2js']
    }
  });
};

Затем вы можете получить доступ к содержимому html в виде строки JS:

var elm = $(__html__['templates/x.html'])

Ошибка, которую вы получаете, означает, что файлы HTML не были предварительно обработаны. По умолчанию все HTML-файлы в basePath предварительно обработаны, поэтому, возможно, ваши HTML-файлы находятся где-то еще, и в этом случае вам нужно явно указать их в конфигурации preprocessors. Поделитесь своим karma.conf.js, если вам нужна дополнительная помощь.

person Vojta    schedule 23.09.2013
comment
Это неправильный способ сделать это... Если вы хотите использовать статический файл, вы должны отключить флаг include по его шаблону. - person inf3rno; 17.01.2014
comment
Таким образом, вам не нужно иметь дело с асинхронностью, вы можете легко писать свои тесты синхронно. - person Vojta; 12.03.2014
comment
Тем не менее, вы можете использовать include: false, конечно. - person Vojta; 12.03.2014

arrow_upward
1
arrow_downward

С помощью конфигурации кармы вы должны зарегистрировать каждый файл, который хотите использовать в своих тестах. Вы можете сделать это, добавив шаблоны в свой массив files в своей конфигурации.

Шаблон файла выглядит следующим образом:

files: [
    {
        pattern: 'test/unit/*.js',
        watched: true, //watching file modifications for test autorun
        included: true, //included as <script src="..."> in the runner html file
        served: true //used by tests (the test server should serve it)
    }
]

Вы можете использовать синтаксис короткого шаблона:

files: [
    'test/unit/*.js'
]

Это означает то же самое, что и предыдущий шаблон.

Если вы не хотите использовать свой файл в своем тесте, включенном как <script src="file.js"></script>, вы должны использовать included: false и загрузить файл из своих тестов через AJAX. Имейте в виду, что вы должны использовать для этого относительные URL-адреса, потому что домен тестового сервера всегда может измениться...

Порядок шаблона тоже важен, он использует обратное переопределение:

files: [
     {pattern: '*.js', included: true}
     {pattern: '*.js', included: false}
]

В этом случае каждый файл js будет включен, поэтому первый шаблон переопределяет второй.

Например, по html-файлам:

настройка кармы:

files: [
     {pattern: 'bootstrap.js', included: true}
     {pattern: 'x.html', included: false}
]

bootstrap.js:

var xhr = new XMLHttpRequest();
xhr.open('get', '/base/x.html', false);
xhr.send();
console.log(xhr.status, xhr.responseText); //200, '<html content>'

URI всегда имеет префикс /base, потому что Karma хранит свои собственные файлы index.html и js на верхнем уровне, поэтому ему нужна подпапка. Если вы хотите узнать, какие URI обслуживаются, вы можете использовать этот код:

var servedUris = Object.keys(window.__karma__.files);

Я написал некоторые основные fs вещи для поддержки синхронизации, прочитанной Yadda: https://github.com/acuminous/yadda/blob/master/lib/shims/karma-fs.js Возможно, вы сможете переместить его в другой проект, расширить его и использовать fs вместо AJAX в браузер. По крайней мере, так я бы сделал с Browserify.

person inf3rno    schedule 17.01.2014
comment
Спасибо за предоставление бесплатного решения для взлома, но я получаю 404 по запросу AJAX. В karma.conf.js у меня basePath: '', files: [ { pattern: 'spec/fixture.svg', included: false, served: true }], а в моем тесте xhr.open('GET', 'spec/fixture.svg', false). Есть ли способ увидеть конечные точки сервера кармы? - person dotnetCarpenter; 04.10.2016
comment
Ага. Я не думал, что base является корневым каталогом. Вы могли бы улучшить свой ответ, прояснив это. - person dotnetCarpenter; 04.10.2016
comment
@dotnetCarpenter Хорошо. - person inf3rno; 04.10.2016
comment
@dotnetCarpenter Готово. - person inf3rno; 04.10.2016

arrow_upward
0
arrow_downward

В итоге я сделал простой патч для файла lib/middleware/karma.js в моей установке Karma. Он использует расширение .literal для обозначения «просто вывести весь файл на страницу». Мне всегда казалось странным, что в Karma нет встроенного способа сделать это. Мой способ, конечно, не блестяще построен, но он может быть достаточно хорош для вас.

При этом вы можете просто иметь в своем karma.conf.js:

// ...
files: [
   "path/to/my_html.literal", // Echoed directly onto the page
   "path/to/other.js",        // Normal behaviour
   // ...
],

Моя вложенная функция scriptTags (внутри createKarmaMiddleware) выглядит так:

var scriptTags = files.included.map(function(file) {
  var filePath = file.path;
  var fileExt = path.extname(filePath);

  // Include .literal files directly into the body of the HTML.
  if (filePath.match(/.literal$/)) {
     var fs = require("fs");
     return fs.readFileSync(filePath, "utf-8");
  }

  // ...

Разница здесь: https://github.com/amagee/karma/commit/c09346a71fc27ec94cc212a2bd89b33def >

person Andrew Magee    schedule 05.02.2014