Тестовый код, транслируемый для es6

Я готов написать несколько тестов с Qunit для приложения Backbone, которое написано для ES6 с применением babel.js, чтобы он мог работать в современных браузерах. Чтобы убедиться, что я правильно настроил qunit и все указанные пути правильно, я сначала протестировал модель Backbone, написанную на ES5, и все работало, как ожидалось. Однако я включил bundle.js (который содержит результаты моего кода ES6 с применением babel.js к нему) в мой tests/index.html и написал

 test ( "Code transformed by babel.js contained in bundle.js can be tested", function(){
    expect(1);
    var es6model = new ES6Model();
    equal( es6model.get("defaultproperty"), "defaultstring", "defaultproperty should be defaultstring");
 })

и это говорит мне, что ES6Model не определен.

Вопрос: есть ли что-то о коде, преобразованном babeljs, что сделало бы его более сложным для тестирования с помощью Qunit?

В дополнение ко всем сложным js, которые babel пишет в верхней части файла, код в bundle.js выглядит следующим образом:

var Model = Backbone.Model;
var View = Backbone.View;
var Collection = Backbone.Collection;
var Router = Backbone.Router;
var LocalStorage = Backbone.LocalStorage;

var ES6Model = (function (Model) {
    function ES6Model() {
        _classCallCheck(this, ES6Model);

        if (Model != null) {
            Model.apply(this, arguments);
        }
    }

    _inherits(ES6Model, Model);

    _prototypeProperties(Gopher, null, {
        defaults: {
            value: function defaults() {

                return {
                    defaultproperty: "defaultstring"

                };
            },
            writable: true,
            configurable: true
        }
    });

    return ES6Model;
})(Model);

Update

Я включаю весь код, созданный babel.js в файле с именем bundle.js, и включаю его в мой index.html, как и любой другой файл js, и он запускается без проблем, поэтому я предположил, что могу проверить он, как и любой другой js-код. Тем не менее, следует отметить (как отметил комментатор), что код, созданный babel.js, содержится в модуле.. именно так bundle.js начинается с модели, которую я пытаюсь проверить после

(function e(t,n,r){function s(o,u){if(!n[o]){if(!t[o]){var a=typeof require=="function"&&require;if(!u&&a)return a(o,!0);if(i)return i(o,!0);var f=new Error("Cannot find module '"+o+"'");throw f.code="MODULE_NOT_FOUND",f}var l=n[o]={exports:{}};t[o][0].call(l.exports,function(e){var n=t[o][1][e];return s(n?n:e)},l,l.exports,e,t,n,r)}return n[o].exports}var i=typeof require=="function"&&require;for(var o=0;o<r.length;o++)s(r[o]);return s})({1:[function(require,module,exports){
"use strict";

Update

Я использую браузер для применения babel к различным файлам моего кода ES6, который создает пакет. Чтобы запустить тесты, я делаю npm run test и для компиляции пакета, я пытаюсь использовать оба из них (один из них использует modules --ignore), но ни один из них не работает

"scripts": {

    "test": "./node_modules/karma/bin/karma start --log-level debug",
    "build-js": "browserify app/app.js app/views.js app/models.js  app/d3charts.js -t babelify > app/bundle.js",
    "t-build": "browserify app/app.js app/views.js app/models.js app/d3charts.js -t [babelify --modules ignore] > app/test/test-bundle.js"
  },

(Приложение является приложением Backbone.js).

Это мой конфигурационный файл кармы. У меня нет никакой дополнительной конфигурации (так что я предполагаю, что мое включение кармы требует отхода, но, возможно, необходимо...)

module.exports = function(config) {
  config.set({
    basePath: '',
    frameworks: ['qunit'],
    plugins: ['karma-qunit', 'karma-phantomjs-launcher', 'karma-requirejs'],

    files : [
      'app/test/jquery.js',     
      'app/test/d3.js',
      'app/test/json2.js',
      'app/test/underscore.js',
      'app/test/backbone.js',
      'app/backbone.localStorage.js',

      'app/test/test-bundle.js',
      'app/test/tests.js'

    ],


    reporters: ['progress'],

    // web server port
    port: 8080,

    // enable / disable colors in the output (reporters and logs)
    colors: true,

    // level of logging
    // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
    logLevel: config.LOG_INFO,

    // enable / disable watching file and executing tests whenever any file changes
    autoWatch: false,

    // start these browsers
    // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
    browsers: ['PhantomJS'],

    // Continuous Integration mode
    // if true, Karma captures browsers, runs the tests and exits
    singleRun: true,

    // See http://stackoverflow.com/a/27873086/1517919
    customLaunchers: {
        Chrome_sandbox: {
            base: 'Chrome',
            flags: ['--no-sandbox']
        }
    }
  });
};

Ответ 1

Для справки, чтобы сделать это с помощью traceur, необходимо скомпилировать файл traceur-runtime.js в код (см. https://github.com/google/traceur-compiler/issues/777 - аналогичная переменная, не определенная ошибка).

например.

traceur --out out/src/yourcode.js --script lib/traceur-runtime.js --script test/yourcode.js

(см. Компиляция Offline https://github.com/google/traceur-compiler/wiki/Compiling-Offline).

Ответ 2

Импортировать модуль, сгенерированный Babel, в ваш тест перед выполнением (рекомендуется)

Для обработки импорта вам потребуется включить загрузчик модуля (например, SystemJS). Babel имеет отличную документацию для своей модульной системы.

Это выглядит примерно так:

System.import( 'path/to/ES6Module' )
  .then( function( ES6Module ) {
    // … Run your tests on ES6Module here
  });

Примечание. System.import() возвращает Promise, поэтому ваш тестовый пакет должен поддерживать асинхронные операции.


Скажите Babel пропустить создание модуля (проще)

Вы можете сказать, что Бабель не должен обертывать ваш код в модуль, используя флаг --modules ignore. Это позволяет вашему коду настраивать глобальные переменные, немедленно доступные для ваших модульных тестов. Глобальные переменные не рекомендуются (особенно в производственных системах), но их проще применять.