JS тесты с кармой / мокко / чай / глотком

Я попытался добавить тестирование в мой шаблон веб-приложения, которое проводится вместе с gulp.

Я добавил Karma/Mocha/Chai и выполнил тестирование в часах Gulp:

gulp.task('watch', ['browserSync', 'build-css'], () => {
    gulp.watch('./app/scss/**/*.scss', ['build-css']);
  gulp.watch(['app/*.html', 'app/js/**/*.js'], browserSync.reload);     //Also reloads the browser when HTML or JS changes                  
    gulp.watch(['app/js/**/*.js', 'test/**/*.test.js'], ['test']);      //Re-run tests whenever JS or test changes
});

gulp.task('test',                                                       //Run tests once
    shell.task('karma start --single-run --browsers ChromeHeadless karma.conf.js')
);

В моем karma.conf.js Я загружаю все мои файлы:

files: [
  'app/*.html',
  'app/css/*.css',
  'app/js/**/*.js',
  'test/**/*.test.js'
],

Теперь актуальный тестовый файл работает. Так что, если у меня есть это:

script.test.js

describe('Array', () => {
    describe('#indexOf()', () => {
      it('should return -1 when the value is not present', () => {
        assert.equal(-1, [1,2,3,].indexOf(4));
      });
    });
  });

тогда я получу пропуск, без проблем.

У меня проблема в том, что мой основной файл script.js вызывает падение Кармы. Я верю, что это потому, что он пытается манипулировать DOM. У меня есть функция под названием createUI которая принимает пару аргументов, одним из которых является идентификатор элемента страницы, в который должен быть вставлен пользовательский интерфейс. Он работает точно так, как я хочу, когда он работает нормально, но когда Карма запускает тест, он дает мне это:

HeadlessChrome 64.0.3282 (Mac OS X 10.13.2) ERROR
  {
    "message": "Uncaught ReferenceError: table is not defined\nat /var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/app/js/script.js:10:0 <- /var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/195d5d9b0835bfdadaba24427f863496.browserify:11:43\n\nReferenceError: table is not defined\n    at Object.require./Users/jamesbrenton/Documents/webapp-boilerplate/app/js/script.js (/var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/app/js/script.js:10:0 <- /var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/195d5d9b0835bfdadaba24427f863496.browserify:11:43)\n    at s (/var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/node_modules/browser-pack/_prelude.js:1:0 <- /var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/195d5d9b0835bfdadaba24427f863496.browserify:1:273)\n    at app/js/script.js:1:34",
    "str": "Uncaught ReferenceError: table is not defined\nat /var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/app/js/script.js:10:0 <- /var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/195d5d9b0835bfdadaba24427f863496.browserify:11:43\n\nReferenceError: table is not defined\n    at Object.require./Users/jamesbrenton/Documents/webapp-boilerplate/app/js/script.js (/var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/app/js/script.js:10:0 <- /var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/195d5d9b0835bfdadaba24427f863496.browserify:11:43)\n    at s (/var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/node_modules/browser-pack/_prelude.js:1:0 <- /var/folders/bb/v9p4j7395_9f24f49p04h1pr0000gq/T/195d5d9b0835bfdadaba24427f863496.browserify:1:273)\n    at app/js/script.js:1:34"
  }

Если я заверну свой вызов функции внутри window.onload блок, как это:

script.js

window.onload = function() {
    cards.createUI(deck, table);
};

тогда испытания кажутся успешными. Однако я не могу поверить, что это правильный способ решения этой проблемы, поскольку код работает в нормальных условиях. Могу ли я отложить карму от запуска тестов до загрузки DOM? Или я что-то здесь упустил?

0 ответов

Другие вопросы по тегам