2014-12-01 21 views
12

Używam gulp/gulp-jaśmin/kątowe do uruchamiania testów jednostkowych. Ja jednak napotkać następujący błąd podczas uruchamiania mój cel haustem:Okno gulp-jaśminowe nie jest zdefiniowane błąd

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 

wierzę łyk-jaśmin wykorzystuje PhantomJS (bez okna przeglądarki jest uruchamiany). Czy ktoś może mi pomóc z tym, co robię źle? Czy brakuje ustawienia konfiguracyjnego?

Oto moje 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

żadnego postępu w tej kwestii? Mam ten sam problem. –

+0

Podejrzewam, że błąd "nie zdefiniowany w oknach" ma związek z Angular, wymagającym kontekstu przeglądarki i działającego DOM, aby poprawnie załadować. jaśmin to tylko szkielet testowy. Myślę, że potrzebujesz przeglądarki udostępniającej interfejs API DOM (np. Okno). Stwierdziłem, że PhantomJS działa dobrze. Zobacz moją odpowiedź poniżej. – pixelbits

Odpowiedz

8

łyk-jaśmin uruchamia testy poprzez node.js, a tym samym nie nadaje się do testowania stronie klienta zobaczyć https://github.com/sindresorhus/gulp-jasmine/issues/46

Dla testów po stronie klienta, jeśli chcesz używać Jasmine (zamiast karmy lub równolegle), można zapisać plik SpecRunner.html (nazwa nie ma znaczenia) i uruchomić go w przeglądarce:

<!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> 

lub użyj 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()); 
}); 

Albo użyć Karma :)

5

udało mi się rozwiązać ten inny sposób korzystając PhantomJS na bezgłowe przeglądarce, karma dla badanego biegacza wiersza polecenia, jaśmin w ramach testu, a łyk dla biegacza zadania.

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' 
     } 

    }) 
} 

zainstalować niezbędne moduły NPM:

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 

zaktualizować swój gulpfile.js i zapewniają dwa zadania: Zadanie domyślne uruchamianie testów jednostkowych raz , zadanie TDD do oglądania systemu plików i uruchamiania testów po każdej zmianie pliku:

łyk 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); 
}); 

Aby wywołać:

gulp default 
gulp tdd 

Dla kompletności, tutaj jest mój indeks-kontroler, a związane Test:

Indeksu controller.js

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

in 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 'wymaga wszystkiego w' module_węzła', które uruchamia 'karma-', więc nie powinieneś potrzebować sekcji 'plugins' w konfiguracji, chyba że masz' node_modules/karma- * 'które musisz wykluczyć ale nie można usunąć . – LeeGee

Powiązane problemy