NodeJS,Angular Seed,Gulp,Jasmine,Karma问题

build立一个angular种子,我有一切工作,我甚至可以启动茉莉花浏览器,但由于某种原因,我的规范不工作,所以我添加了一个karma.conf文件,它似乎打破了茉莉花浏览器。 我是新来的使用茉莉花,所以我很茫然,有很多关于如何做到最好的意见,但无论我尝试我似乎无法得到它的工作,我已经在这里添加回购链接为代码。 希望有人能够看到我做错了什么。

这个种子需要NodeJS

下载git,把它放在一个文件夹中,进入根目录下的config文件夹,运行npm install然后运行gulp,它会自动在控制台的浏览器中启动,你会看到这个错误

[14:52:17] 'jasmineWeb' errored after 2.27 ms [14:52:17] TypeError: object is not a function at Gulp.<anonymous> (/webdev/E20/config/gulpfile.js:137:11) at module.exports (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:34:7) at Gulp.Orchestrator._runTask (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:273:3) at Gulp.Orchestrator._runStep (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:214:10) at /webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:279:18 at finish (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:21:8) at module.exports (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:60:3) at Gulp.Orchestrator._runTask (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:273:3) at Gulp.Orchestrator._runStep (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:214:10) at /webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:279:18 

这是我用来发射茉莉花的任务

 gulp.task('jasmineWeb', function() { var filesForTest = ['../src/**/*.js', '../src/**/*_spec.js'] return gulp.src(filesForTest) .pipe(karma({configFile: 'karma.conf.js',action: 'run'})) .pipe(watch(filesForTest)) .pipe(jasmineBrowser.specRunner()) .pipe(jasmineBrowser.server({port: 8888})); }); 

这是我的Karma.conf文件

 // Karma configuration // Generated on Tue Jul 28 2015 11:28:22 GMT-0400 (EDT) module.exports = function(config) { config.set({ // base path that will be used to resolve all patterns (eg. files, exclude) basePath: '', // frameworks to use // available frameworks: https://npmjs.org/browse/keyword/karma-adapter frameworks: ['jasmine'], // list of files / patterns to load in the browser files: [ '../src/lib/js/angular/angular.min.js', '../src/lib/js/angular/angular-mocks.js', '../src/com/**/*.js', '../src/com/**/*_spec.js' ], // list of files to exclude exclude: [ ], // preprocess matching files before serving them to the browser // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor preprocessors: { }, // test results reporter to use // possible values: 'dots', 'progress' // available reporters: https://npmjs.org/browse/keyword/karma-reporter reporters: ['progress'], // web server port port: 9876, // 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: true, // start these browsers // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher browsers: ['Chrome', 'Firefox', 'IE', 'PhantomJS'], // Continuous Integration mode // if true, Karma captures browsers, runs the tests and exits singleRun: false }) } 

我提前感激

https://bitbucket.org/baylysoft/angular-seed-project

噶现在正在运行,但我现在得到这个错误

 PhantomJS 1.9.8 (Mac OS X 0.0.0) Controller: com/modules/AboutController Sets the Page Message It should show the page message FAILED ReferenceError: Can't find variable: $scope at /webdev/E20/src/com/modules/about/aboutController_spec.js:15 Chrome 44.0.2403 (Mac OS X 10.10.4) Controller: com/modules/AboutController Sets the Page Message It should show the page message FAILED ReferenceError: $scope is not defined at Object.<anonymous> (/webdev/E20/src/com/modules/about/aboutController_spec.js:15:16) Chrome 44.0.2403 (Mac OS X 10.10.4): Executed 1 of 1 (1 FAILED) ERROR (0.008 secs / 0.006 secs) PhantomJS 1.9.8 (Mac OS X 0.0.0): Executed 1 of 1 (1 FAILED) ERROR (0 secs / 0.004 secs) 

这里是更新的spec文件

 'use strict'; describe('Controller: com/modules/AboutController', 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('Sets the Page Message', function() { it('It should show the page message', function() { expect($scope.message).toEqual('This is the about page message from the controller'); }); }); }); 

我运行茉莉花,噶玛,就像你一样使用Gulp。 不过,我如何启动它有一些差异。 也许这可能有助于你的。

你的karma.config.js看起来很相似,所以可能没有问题。

不过,在我的大文件中,我只是称之为

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

如果您还需要查看文件以进行更改,则可以运行此操作。

 var filesForTest = [ '../src/**/*.js' ]; gulp.task( 'watchOnSave', function(){ gulp.watch( filesForTest, [ 'karma' ]); } gulp watchOnSave 

karma.config.js文件将为您执行浏览器,并运行您在karma.config.js文件中定义的规范。

  '../src/com/**/*_spec.js' // just make sure all your JS files are in your karma **files** property. 

让我知道如果这个工作,或者我们会TS的解决scheme。

UPDATE

在你的app(app.js)中,你有这个

 var appName = 'EuropaSeed'; var globalApp = angular.module(appName,['ngRoute','ngCookies']); var app = angular.module(appName); 

在你的testing中你有

 beforeEach(module('EuroSeed')); 

你的问题之一是你有两个名为EuroSeed的模块

 app and globalApp 

所以相反,在你的testing中,调出你需要的两个模块中的哪一个

 beforeEach(module(app)); 

这与您在控制器中的function相匹配

 app.controller('AboutController',... 

我正在使用这个来运行规范,这是通过现在,但没有使用除了另一个问题,以通过。

大文件为

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

成功


这可能是规范,所以我想我会张贴规格和控制器在这里,他们是非常简单的。

现在“app”被设置在app.js文件中,所以应用程序本身就可以工作

aboutcontroller

 //This is the about function that is used in the About Module. 'use strict'; app.controller('AboutController',// jshint ignore:line ['$scope', function ($scope) { $scope.message = 'This is the about page message from the controller'; }]); 

关于控制器testing

 'use strict'; describe('Controller: com/modules/AboutController', function() { beforeEach(module('EuropaSeed')); var $controller; beforeEach(inject(function(_$controller_){ // The injector unwraps the underscores (_) from around the parameter names when matching $controller = _$controller_; })); describe('Sets the Page Message', function() { it('It should show the page message', function() { expect($scope.message).toEqual('This is the about page message from the controller'); }); }); }); 

我拉了我正在运行的testing,我仍然在jasmineWeb上得到相同的错误,所以它可能是configuration。

 Europas-MacBook-Pro:config ray$ gulp jasmineWeb [08:29:33] Using gulpfile /webdev/E20/config/gulpfile.js [08:29:33] Starting 'jasmineWeb'... [08:29:33] 'jasmineWeb' errored after 12 ms [08:29:33] TypeError: object is not a function at Gulp.<anonymous> (/webdev/E20/config/gulpfile.js:137:11) at module.exports (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:34:7) at Gulp.Orchestrator._runTask (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:273:3) at Gulp.Orchestrator._runStep (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:214:10) at Gulp.Orchestrator.start (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:134:8) at /usr/local/lib/node_modules/gulp/bin/gulp.js:129:20 at process._tickCallback (node.js:355:11) at Function.Module.runMain (module.js:503:11) at startup (node.js:129:16) at node.js:814:3 Europas-MacBook-Pro:config ray$ 

我采取了你的build议,并增加了业务任务的吞噬文件,它给了我相同的结果,所以,我肯定搞砸了configuration的地方。

 Europas-MacBook-Pro:config ray$ gulp karma [08:31:46] Using gulpfile /webdev/E20/config/gulpfile.js [08:31:46] Starting 'karma'... [08:31:46] 'karma' errored after 145 μs [08:31:46] TypeError: undefined is not a function at Gulp.<anonymous> (/webdev/E20/config/gulpfile.js:144:9) at module.exports (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/lib/runTask.js:34:7) at Gulp.Orchestrator._runTask (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:273:3) at Gulp.Orchestrator._runStep (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:214:10) at Gulp.Orchestrator.start (/webdev/E20/config/node_modules/gulp/node_modules/orchestrator/index.js:134:8) at /usr/local/lib/node_modules/gulp/bin/gulp.js:129:20 at process._tickCallback (node.js:355:11) at Function.Module.runMain (module.js:503:11) at startup (node.js:129:16) at node.js:814:3 

这是我正在运行的更新规范

 'use strict'; describe('Controller: com/modules/AboutController', function() { beforeEach(module(app)); var AboutController, scope; beforeEach(inject(function ($rootScope, $controller) { scope = $rootScope.$new(); AboutController = $controller('AboutController', { "$scope": scope }); })); it('It should show the page message', function () { // you might also need to do this AboutController(); expect(scope.greeting).toEqual("This is the about page message from the controller"); }); }); 

来回走了,从这里得到几个人的帮忙(非常感谢你们),我find了罪魁祸首,结果certificate这个问题不是在实际testing中,而是在业力configuration文件中,这是欺骗的问题是我正在加载的凉亭组件,我没有加载足够的ng-mocks不足以testing控制器,所以我添加了一些其他的,它的工作,我能够让我所有的testing工作正常。

这是我在karma.conf文件部分下添加的内容

 'bower_components/angular/angular.js', 'bower_components/angular-route/angular-route.js', 'bower_components/angular-mocks/angular-mocks.js', 'bower_components/angular-resource/angular-resource.js', 'bower_components/angular-cookies/angular-cookies.js', 'bower_components/angular-sanitize/angular-sanitize.js', '../src/com/**/*.js', '../src/com/**/*_spec.js' 

我已经用那些想要更好的例子的新工作代码更新了bitbucket种子

bitbucket.org/baylysoft/angular-seed-project