2014-12-01 2 views
12

Я использую gulp/gulp-jasmine/angular для запуска моих модульных тестов. Тем не менее, я сталкиваюсь следующее сообщение об ошибке при выполнении своей цели Глотка:gulp-jasmine Окно не определено Ошибка

C:\Projects\website2>gulp test 
[01:53:10] Using gulpfile C:\Projects\website2\gulpfile.js 
[01:53:10] Starting 'test'... 
[01:53:11] Version: webpack 1.4.13 
     Asset  Size Chunks    Chunk Names 
test.bundle.js 1051728  0 [emitted] test 
F 

Failures: 
1) Exception loading: C:\Projects\website2\scripts\dist\test.bundle.js Error 
1.1) ReferenceError: window is not defined 

1 spec, 1 failure 
Finished in 0.015 seconds 
[01:53:11] 'test' errored after 916 ms 
[01:53:11] Error in plugin 'gulp-jasmine' 
Message: 
    Tests failed 

Я считаю, что проглатывать-жасмин использует PhantomJS (не окно браузера не срабатывает). Может кто-нибудь помочь мне с тем, что я делаю неправильно? Есть ли настройки конфигурации, которые мне не хватает?

Вот мой gulpfile.js:

var gulp = require('gulp'); 
var path = require('path'); 
var webpack = require('gulp-webpack'); 
var webpackConfig = require('./webpack.config'); 
var testWebpackConfig = require('./test.webpack.config'); 
var jasmine = require('gulp-jasmine'); 

gulp.task('default', ['build'], function() { 

}); 

gulp.task('build', function() { 
    return gulp.src(['scripts/app/**/*.js', '!scripts/app/**/*.tests.js']) 
     .pipe(webpack(webpackConfig)) 
     .pipe(gulp.dest('scripts/dist')); 
}); 

gulp.task('test', function() { 
    return gulp.src(['scripts/app/**/*.tests.js']) 
     .pipe(webpack(testWebpackConfig)) 
     .pipe(gulp.dest('scripts/dist'))  
     .pipe(jasmine()); 
}); 
+0

Любой прогресс в этом вопросе? У меня такая же проблема. –

+0

Я подозреваю, что ошибка «window not defined» связана с Angular, требующей контекста браузера и рабочей DOM для правильной загрузки. Жасмин - это всего лишь тестовая структура. Я думаю, вам нужен браузер, который предоставляет API DOM (то есть окно). Я обнаружил, что PhantomJS хорошо работает для этого. См. Мой ответ ниже. – pixelbits

ответ

8

Глоток-жасмин проходит испытания через Node.js и, таким образом, не подходит для тестирования на стороне клиента, см https://github.com/sindresorhus/gulp-jasmine/issues/46

Для клиентских испытаний, если вы хотите использовать жасмин (вместо кармы или параллельно), вы можете написать файл SpecRunner.html (имя не имеет значения) и запустить его в браузере:

<!DOCTYPE html> 
<html> 
    <head> 
    <meta charset="utf-8"> 
    <title>Jasmine Spec Runner</title> 

    <!-- You need to specify package 'jasmine-core' in your Node.js package.json --> 

    <link rel="shortcut icon" href="node_modules/jasmine-core/images/jasmine_favicon.png"> 
    <link rel="stylesheet" href="node_modules/jasmine-core/lib/jasmine-core/jasmine.css"> 

    <script src="node_modules/jasmine-core/lib/jasmine-core/jasmine.js"></script> 
    <script src="node_modules/jasmine-core/lib/jasmine-core/jasmine-html.js"></script> 
    <script src="node_modules/jasmine-core/lib/jasmine-core/boot.js"></script> 

    <!-- Source and Spec dependencies --> 
    <script src="node_modules/underscore/underscore.js"></script> 
    <script src="node_modules/angular/angular.js"></script> 
    <script src="node_modules/angular-mocks/angular-mocks.js"></script> 

    <!-- Source files --> 
    <script src="app/MySourceCode1.js"></script> 
    <script src="app/MySourceCode2.js"></script> 

    <!-- Spec files --> 
    <script src="test/MySourceCode1.spec.js"></script> 
    <script src="test/MySourceCode2.spec.js"></script> 
    </head> 
    <body> 
    </body> 
</html> 

или использовать gulp-jasmine-browser:

var gulp = require('gulp'); 
var $ = require('gulp-load-plugins')(); 

// You need to specify packages 'jasmine-core' and 'gulp-jasmine-browser' 
// in your Node.js package.json 

gulp.task('jasmine', function() { 
    return gulp.src([ 
    'node_modules/underscore/underscore.js', 
    'node_modules/angular/angular.js', 
    'node_modules/angular-mocks/angular-mocks.js', 

    'app/MySourceCode1.js', 
    'app/MySourceCode2.js', 
    'test/MySourceCode1.spec.js', 
    'test/MySourceCode2.spec.js', 
    ]) 
    .pipe($.jasmineBrowser.specRunner()) 
    .pipe($.jasmineBrowser.server()); 
}); 

Или использовать Karma :)

5

Я был в состоянии решить этот другой путь, используя PhantomJS для обезглавленного браузера, карма для теста бегуна командной строки, жасмин для тестовой структуры, и глоток для задачи.

karma.conf.js

module.exports = function(config) { 
    config.set({ 
     basePath: './', 

     files: [ 
      'node_modules/angular/angular.js', 
      'node_modules/angular-mocks/angular-mocks.js', 
      'index-controller.js', 
      'index-controller.tests.js' 
     ], 

     exclude: [ 
     ], 

     autoWatch: true, 

     frameworks: ['jasmine'], 

     browsers: ['PhantomJS'], 

     plugins: [ 
      'karma-jasmine', 
      'karma-junit-reporter', 
      'karma-chrome-launcher', 
      'karma-firefox-launcher', 
      'karma-phantomjs-launcher' 
     ], 

     junitReporter: { 
      outputFile: 'unit.xml', 
      suite: 'unit' 
     } 

    }) 
} 

Установите необходимые НПЕ модули:

npm install angular 
npm install angular-mocks 
npm install -g gulp 
npm install gulp 
npm install karma 
npm install -g karma-cli 
npm install karma-jasmine 
npm install karma-junit-reporter 
npm install karma-chrome-launcher 
npm install karma-firefox-launcher 
npm install karma-phantomjs-launcher 
npm install phantomjs 

Обновите свой gulpfile.js и обеспечивает две задачи: задача по умолчанию для запуска модульных тестов один раза , задача TDD для просмотра файловой системы и запуска тестов при изменении любого файла:

gulp file.js

var gulp = require('gulp'); 
var karma = require('karma').server; 
gulp.task('default', function(done) { 
    karma.start({  
    configFile: __dirname + '/karma.conf.js', 
     singleRun: true 
    }, done); 

}); 

gulp.task('tdd', function (done) { 
    karma.start({ 
    configFile: __dirname + '/karma.conf.js' 
    }, done); 
}); 

Для запуска:

gulp default 
gulp tdd 

Для полноты, вот мой индекс-контроллер, и связанные с ними тест:

индекс-controller.js

var app = angular.module('app', []); 
app.controller('ctrl', function($scope) { 
    $scope.name = 'mickey mouse'; 
}); 

в DEX-controller.tests.js

describe('index-controller', function() { 
    beforeEach(module('app')); 
    var $controller; 

    beforeEach(inject(function(_$controller_){ 
     // The injector unwraps the underscores (_) from around the 
     // parameter names when matching 
     $controller = _$controller_; 
    })); 

    describe('$scope.name', function() { 
     it('should be mickey mouse', function() { 
      var $scope = {}; 
      var controller = $controller('ctrl', { $scope: $scope }); 

      expect($scope.name).toEqual('mickey mouse'); 
     }); 

    }); 
}); 
+0

Karma 'требует' 'все в' node_module', который запускает 'karma-', поэтому вам не нужно раздел 'plugins' в config, если у вас нет' node_modules/karma- * 'вам нужно исключить, но не удалять , – LeeGee

Смежные вопросы