獲取AngulaJS + Angular AMD + RequireJS與Karma和Jasmine配合使用時出錯

Question

我想為我創建的AngularJS + Angular AMD和RequireJS應用程序添加基於Karma和Jasmine + Require Js的單元測試支持。 我已經為此動了兩天的腦筋，但是我仍然離達成交易還差得很遠。

我不斷收到錯誤：

INFO [karma]: Karma v0.12.21 server started at http://localhost:9876/
INFO [launcher]: Starting browser Chrome
INFO [Chrome 36.0.1985 (Mac OS X 10.9.4)]: Connected on socket 8oFHaa2hqJPs0ecgIXCa with id 31963369
Chrome 36.0.1985 (Mac OS X 10.9.4) ERROR: 'There is no timestamp for     ../www/scripts/specs/UserControllerTest.js!'

WARN [web-server]: 404: /www/scripts/specs/UserControllerTest.js
Chrome 36.0.1985 (Mac OS X 10.9.4) ERROR
  Uncaught Error: Script error for: specs/UserControllerTest
  http://requirejs.org/docs/errors.html#scripterror
  at /usr/local/lib/node_modules/requirejs/require.js:141

我的代碼如下：

1. 業力配置文件：

    // Karma configuration // Generated on Fri Aug 15 2014 20:49:40 GMT+1000 (EST) 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', 'requirejs'], // list of files / patterns to load in the browser files: [ 'test-main.js', {pattern: 'specs/*.js', included: true} ], // 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'], // Continuous Integration mode // if true, Karma captures browsers, runs the tests and exits singleRun: false }); }; 

2. 我的test-main.js文件。

     var allTestFiles = []; var TEST_REGEXP = /(spec|test)\\.js$/i; var pathToModule = function(path) { return path.replace(/^\\/base\\//, '').replace(/\\.js$/, ''); }; Object.keys(window.__karma__.files).forEach(function(file) { if (TEST_REGEXP.test(file)) { // Normalize paths to RequireJS module names. allTestFiles.push(pathToModule(file)); } }); require.config({ // Karma serves files under /base, which is the basePath from your config file baseUrl: '../www/scripts', // alias libraries paths paths: { 'angular': '../libs/angular', 'angular-route': '../libs/angular-route', 'angular-animate':'../libs/angular-animate', 'angular-mocks':'../libs/angular-mocks', 'angularAMD': '../libs/angularAMD.min', 'Framework7':'../libs/framework7', 'UserController':'controller/UserCtrl', 'WebCallManager':'services/WebCallManager' }, // Add angular modules that does not support AMD out of the box, put it in a shim shim: { 'angularAMD': ['angular'], 'angular-route': ['angular'], 'angular-animate':['angular'], 'angular-mocks':['angular'], 'Framework7':{exports: 'Framework7'} }, //kick start application //deps: ['app'], // dynamically load all test files deps: allTestFiles, // we have to kickoff jasmine, as it is asynchronous callback: window.__karma__.start }); 

3. 我的單元測試是：

     describe('UserController', function () { var scope,controller; //mock Application to allow us to inject our own dependencies beforeEach(angular.mock.module('app')); //mock the controller for the same reason and include $rootScope and $controller beforeEach(angular.mock.inject(function($rootScope, $controller) { //create an empty scope scope = $rootScope.$new(); //declare the controller and inject our empty scope $controller('UserController', {$scope: scope}); })); it('checks the controller name', function () { expect(scope.name).toBe('Superhero'); }); }); 

我已經上傳了我項目的所有代碼以鏈接到此處 。 能夠為我提供幫助的任何人都將受到高度贊賞。 我認為In在此結束。

Answer 1

marcoseu是正確的， There is no timestamp for...錯誤意味着karma無法找到該文件，但還有更多。

我建議將業力的基本路徑作為項目的根目錄。 這避免了Karma將文件路徑設置為絕對路徑而不是相對路徑，這使事情變得更簡單，並且避免了路徑引用問題（至少在Windows OS中如此）。

您的測試應該是一個require模塊（即，使用define），以便可以確保它所需要的對象已完全加載。 請參閱http://karma-runner.github.io/0.12/plus/requirejs.html上的示例測試

karma.config.js basePath: "../", files: [ 'test/test-main.js', {pattern: 'test/specs/*.js', included: false}, {pattern: 'www/**/*.js', included: false}, ],

現在，您的文件都由Karma在/ base下提供。

test-main.js require.config({ baseUrl: "/base/www/scripts",

調試

但最重要的是，您可以調試所有這些。 運行Karma，切換到Karma創建的chrome實例，點擊調試按鈕，打開chrome開發人員工具。 檢查控制台和您的源文件。 特別是debug.html的源代碼，如底部所示，它定義了您所有業力提供的文件。

您還可以設置斷點，然后刷新頁面以查看正在執行的測試。 您將可以自己查看為什么會出現測試錯誤。 贏得。

Answer 2

錯誤“ There is no timestamp for...表示karma無法訪問有問題的文件。 您需要定義www目錄，以便業力可以訪問該目錄。 請嘗試以下操作：

karma.config.js files: [ 'test-main.js', {pattern: './specs/*.js', included: true}, {pattern: '../../www/**/*.js', included: false} ],

看看karma.conf在angularAMD項目和噶文檔文件 。