Angular2 rc6 karma配置

时间:2016-09-13 09:08:03

标签: angular karma-jasmine

Angular2项目升级到RC6后,我的jasmine测试停止运行。我试图更改karma.conf.js,但它不起作用。我错过了什么?

karma.conf.js

// Karma configuration file, see link for more information
// https://karma-runner.github.io/0.13/config/configuration-file.html

module.exports = function (config) {
  config.set({
    basePath: '..',
    frameworks: ['jasmine'],
    plugins: [
      require('karma-jasmine'),
      require('karma-chrome-launcher')
    ],
    customLaunchers: {
      // chrome setup for travis CI using chromium
      Chrome_travis_ci: {
        base: 'Chrome',
        flags: ['--no-sandbox']
      },
      Chrome_without_security: {
        base: 'Chrome',
        flags: ['--disable-web-security']
      }
    },
    files:[
      // System.js for module loading
      'dist/vendor/systemjs/dist/system.src.js',

      // Polyfills
      'dist/vendor/core-js/client/shim.js',

      // Reflect and Zone.js
      'dist/vendor/reflect-metadata/Reflect.js',
      'dist/vendor/zone.js/dist/zone.js',
      'dist/vendor/zone.js/dist/long-stack-trace-zone.js',
      'dist/vendor/zone.js/dist/proxy.js',
      'dist/vendor/zone.js/dist/sync-test.js',
      'dist/vendor/zone.js/dist/jasmine-patch.js',
      'dist/vendor/zone.js/dist/async-test.js',
      'dist/vendor/zone.js/dist/fake-async-test.js',

      { pattern: 'dist/vendor/es6-shim/es6-shim.js', included: true, watched: false },
      { pattern: 'dist/vendor/zone.js/dist/zone.js', included: true, watched: false },
      { pattern: 'dist/vendor/reflect-metadata/Reflect.js', included: true, watched: false },
      { pattern: 'dist/vendor/systemjs/dist/system-polyfills.js', included: true, watched: false },
      { pattern: 'dist/vendor/systemjs/dist/system.src.js', included: true, watched: false },

      { pattern: 'config/karma-test-shim.js', included: true, watched: true },

      // Distribution folder.
      { pattern: 'dist/**/*', included: false, watched: true }
    ],
    exclude: [
      // Vendor packages might include spec files. We don't want to use those.
      'dist/vendor/**/*.spec.js'
    ],
    preprocessors: {},
    reporters: ['progress'],
    port: 9876,
    colors: true,
    logLevel: config.LOG_INFO,
    autoWatch: true,
    browsers: ['Chrome', 'Chrome_without_security'],
    singleRun: false
  });
};

系统配置

    // SystemJS configuration file, see links for more information
// https://github.com/systemjs/systemjs
// https://github.com/systemjs/systemjs/blob/master/docs/config-api.md

/***********************************************************************************************
 * User Configuration.
 **********************************************************************************************/
/** Map relative paths to URLs. */
const map: any = {
  "ng2-charts": "vendor/ng2-charts",
  'ng2-bs3-modal': 'vendor/ng2-bs3-modal',
  "assets": "assets",
};

/** User packages configuration. */
const packages: any = {
  "ng2-charts": {main: 'ng2-charts.js'},
  "ng2-bs3-modal": {main: 'ng2-bs3-modal.js'},
  // Needed after angular2-rc.6
  '@angular/core': {main: 'bundles/core.umd.js'},
  '@angular/common': {main: 'bundles/common.umd.js'},
  '@angular/compiler': {main: 'bundles/compiler.umd.js'},
  '@angular/forms': {main: 'bundles/forms.umd.js'},
  '@angular/http': {main: 'bundles/http.umd.js'},
  '@angular/platform-browser': {main: 'bundles/platform-browser.umd.js'},
  '@angular/platform-browser-dynamic': {main: 'bundles/platform-browser-dynamic.umd.js'},
  '@angular/router': {main: 'bundles/router.umd.js'}
};

////////////////////////////////////////////////////////////////////////////////////////////////
/***********************************************************************************************
 * Everything underneath this line is managed by the CLI.
 **********************************************************************************************/
const barrels: string[] = [
  // Angular specific barrels.
  '@angular/core',
  '@angular/common',
  '@angular/compiler',
  '@angular/forms',
  '@angular/http',
  '@angular/router',
  '@angular/platform-browser',
  '@angular/platform-browser-dynamic',

  // Thirdparty barrels.
  'rxjs',

  // App specific barrels.
  'app',
  'app/shared',
  'app/shared/navbar',
  'app/shared/sidebar',
  'app/shared/footer',
  'app/dashboard',
  'app/docs',
  /** @cli-barrel */
];

const cliSystemConfigPackages: any = {};
barrels.forEach((barrelName: string) => {
  cliSystemConfigPackages[barrelName] = { main: 'index' };
});

/** Type declaration for ambient System. */
declare var System: any;

// Apply the CLI SystemJS configuration.
System.config({
  map: {
    '@angular': 'vendor/@angular',
    'rxjs': 'vendor/rxjs',
    'main': 'main.js',
  },
  packages: cliSystemConfigPackages
});

// Apply the user's configuration.
System.config({ map, packages });

控制台输出:

13 09 2016 10:26:30.221:INFO [karma]: Karma v0.13.22 server started at http://localhost:9876/
13 09 2016 10:26:30.234:INFO [launcher]: Starting browser Chrome
13 09 2016 10:26:40.276:INFO [Chrome 52.0.2743 (Windows 7 0.0.0)]: Connected on socket /#oCu42Oxjq0zJ0shVAAAB with id 42186977
13 09 2016 10:26:41.025:WARN [web-server]: 404: /base/dist/vendor/@angular/core/testing.js
13 09 2016 10:26:41.029:WARN [web-server]: 404: /base/dist/vendor/@angular/platform-browser-dynamic/testing.js
Missing error handler on `socket`.
TypeError: (msg || "").replace is not a function
    at C:\project\node_modules\karma\lib\reporter.js:45:23
    at onBrowserError (C:project\node_modules\karma\lib\reporters\base.js:58:60)
    at .<anonymous> (C:\project\node_modules\karma\lib\events.js:13:22)
    at emitTwo (events.js:106:13)
    at emit (events.js:191:7)
    at onKarmaError (C:\project\node_modules\karma\lib\browser.js:95:13)
    at Socket.<anonymous> (C:\project\node_modules\karma\lib\events.js:13:22)
    at emitOne (events.js:101:20)
    at Socket.emit (events.js:188:7)
    at Socket.onevent (C:\project\node_modules\socket.io\lib\socket.js:335:8)
    at Socket.onpacket (C:\project\node_modules\socket.io\lib\socket.js:295:12)
    at Client.ondecoded (C:\project\node_modules\socket.io\lib\client.js:193:14)
    at Decoder.Emitter.emit (C:\project\node_modules\component-emitter\index.js:134:20)
    at Decoder.add (C:\project\node_modules\socket.io-parser\index.js:247:12)
    at Client.ondata (C:\project\node_modules\socket.io\lib\client.js:175:18)
    at emitOne (events.js:96:13)
13 09 2016 10:26:43.044:WARN [Chrome 52.0.2743 (Windows 7 0.0.0)]: Disconnected (1 times)

更新

果报测试shin.js

// Test shim for Karma, needed to load files via SystemJS

/*global jasmine, __karma__, window*/
Error.stackTraceLimit = Infinity;
jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;

__karma__.loaded = function () {
};

var distPath = '/base/dist/';
var appPaths = ['app']; //Add all valid source code folders here

function isJsFile(path) {
  return path.slice(-3) == '.js';
}

function isSpecFile(path) {
  return path.slice(-8) == '.spec.js';
}

function isAppFile(path) {
  return isJsFile(path) && appPaths.some(function(appPath) {
    var fullAppPath = distPath + appPath + '/';
    return path.substr(0, fullAppPath.length) == fullAppPath;
  });
}

var allSpecFiles = Object.keys(window.__karma__.files)
  .filter(isSpecFile)
  .filter(isAppFile);

// Load our SystemJS configuration.
System.config({
  baseURL: distPath
});

System.import('system-config.js').then(function() {
  // Load and configure the TestComponentBuilder.
  return Promise.all([
    System.import('@angular/core/testing'),
    System.import('@angular/platform-browser-dynamic/testing')
  ]).then(function (providers) {
    var testing = providers[0];
    var testingBrowser = providers[1];

    testing.setBaseTestProviders(testingBrowser.TEST_BROWSER_DYNAMIC_PLATFORM_PROVIDERS,
      testingBrowser.TEST_BROWSER_DYNAMIC_APPLICATION_PROVIDERS);
  });
}).then(function() {
  // Finally, load all spec files.
  // This will run the tests directly.
  return Promise.all(
    allSpecFiles.map(function (moduleName) {
      return System.import(moduleName);
    }));
}).then(__karma__.start, __karma__.error);

1 个答案:

答案 0 :(得分:0)

我解决了类似的问题,当packageConfigPaths被添加到系统配置时,如下例所示:

    packageConfigPaths: [
    '/node_modules/*/package.json',
    '/node_modules/**/package.json',
    '/node_modules/@angular/*/package.json',
    '/node_modules/@angular2-material/*/package.json'
    ]`