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

Question

Я готов написать несколько тестов с 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, что Бабель пишет в верхней части файла, код в 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"; 

Обновление

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

«сценарии»: {

"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'] 
     } 
    } 
    }); 
}; 

Answer 1

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

E.g.

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

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

Answer 2

Импорт Бабель-порожденный модуль в тесте перед выполнением (рекомендуется)

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

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

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

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

---

Расскажи Бабель пропустить поколение модуля (проще)

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