为什么我从Karma网络服务器收到404消息？

时间：2015-06-01 13:54:46

标签： angularjs karma-runner ecmascript-6 jspm

目前，我正在尝试使用Node / AngularJs / JSPM和ES6转换程序Babel和Karma设置一个演示项目。

服务部分正在运作。我需要稍后改进，但第一个“你好世界”＃39;从角度来看。

我想添加Karma来为角度应用运行单元测试。但我收到jspm_packages的404警告，请参见下面的截图。

我的测试没有运行，因为它总会失败。我的测试文件看起来像这样（还没有角度特定部分）：

// HomeController.spec.js
import 'angular-mocks';

describe('Test suite for HomeController', function() {

    it('dummy test', function() {
        expect(true).toBe(true); // will not fail
    });
});

不确定什么是错的，我尝试过很多事情但没有成功，也许我做错了什么。但这是我在Karma配置中尝试的内容：

  • 尝试了许多不同的路径设置，因为我认为它是路径的问题
  • 使用过的代理
  • Browserify和Bablify转换来源
  • 用于加载测试依赖项的JSPM插件

您可以在bitbucket.

找到我目前正在处理的代码

我的应用程序的目录结构如下所示：

enter image description here

以下是Karma的截图： enter image description here

这是我当前的Karma配置文件：

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: ['jspm', 'jasmine'],


// list of files / patterns to load in the browser
files: [
  //'client/test-unit/**/*.test.js'
],

jspm: {
  paths: {
    // '*': 'client/app/**/*.js'
  },
  // Edit this to your needs
  // config: 'client/app/jspm.config.js',
  // Edit this to your needs
  loadFiles: ['client/test-unit/**/*.spec.js'],
  serveFiles: ['client/app/**/*.js', 'client/app/**/*.css', 'client/app/**/*.html']
},

proxies:  {
  // '/assets/jspm_packages/': '/client/app/assets/jspm_packages/'
},

plugins:[
  'karma-jasmine',
  'karma-coverage',
  'karma-jspm',
  'karma-chrome-launcher'
],

// 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: {
//  'client/app/**/*.js': ['browserify'],
//  'client/test-unit/**/*.js': ['browserify']
},

/*browserify: {
  debug: true,
  transform: [ 'babelify' ]
},*/
// babelPreprocessor: {
//   options: {
//     sourceMap: 'inline'
//   },
//   filename: function (file) {
//     return file.originalPath.replace(/\.js$/, '.es5.js');
//   },
//   sourceFileName: function (file) {
//     return file.originalPath;
//   }
// },


// 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
 });
};

1 个答案:

答案 0 :(得分：4)

我想我已经找到了解决问题的方法。

我必须设置一些代理才能使其正常工作。 此外，将日志级别更改为logLevel: config.LOG_DEBUG以调试我的问题也很有帮助，因为这样您就会看到问题的更多详细信息。

另一个问题是测试文件在执行之前没有被转换。那是因为用于转换的预处理器没有正确设置。

packages对象内部的jspm路径也需要它才能正常工作。

它仍然很难理解，我不确定是否有更简单的方法。 无论如何，以下karma.config对我有用：

＆＃13;
＆＃13; 
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: ['jspm', 'jasmine'],


    // list of files / patterns to load in the browser
    files: [
      //'client/test-unit/**/*.test.js'
    ],

    proxies:  {
      '/base/app/': '/base/client/app/',
      '/base/assets/jspm_packages/': '/base/client/app/assets/jspm_packages/'
    },

    jspm: {
      // Edit this to your needs
      config: 'client/app/jspm.config.js',
      // Edit this to your needs
      loadFiles: ['client/test-unit/**/*.spec.js'],
      serveFiles: ['client/app/**/*.js'],
      packages: "client/app/assets/jspm_packages/"
    },


    plugins:[
      'karma-jasmine',
      'karma-coverage',
      'karma-jspm',
      'karma-chrome-launcher'
    ],

    // 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-unit/**/*.js': ['babel', 'coverage']
    //  'client/app/**/*.js': ['browserify'],
    //  'client/test-unit/**/*.js': ['browserify']
    },

    /*browserify: {
      debug: true,
      transform: [ 'babelify' ]
    },*/
    // babelPreprocessor: {
    //   options: {
    //     sourceMap: 'inline'
    //   },
    //   filename: function (file) {
    //     return file.originalPath.replace(/\.js$/, '.es5.js');
    //   },
    //   sourceFileName: function (file) {
    //     return file.originalPath;
    //   }
    // },


    // 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_DEBUG, //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
  });
};
＆＃13;
＆＃13;
＆＃13;

我的测试文件如下所示：

＆＃13;
＆＃13; 
// HomeController.spec.js

import 'app/app';
import 'angular-mocks';

describe('Test suite for HomeController', function() {

	// var homeController;

	beforeEach(function() {
		module('myApp');
		
		// inject(function($controller) {
		// 	console.log('inject called', $controller);
		// 	//controller = $controller;	
		// 	homeController = $controller('homeController');
		// });
	});

	it('should say "Hello World"', inject(function($controller) {

			var homeController = $controller('homeController');

			// console.log(homeController, angular.mocks);
			expect(homeController.hello).toEqual('Hello world from ES6 HomeController.'); // will not fail
		})
	);
});
＆＃13;
＆＃13;
＆＃13;

相关问题
最新问题