Karma-Setup für Angular 2.

Question

Ich versuche Karma mit Jasmine zum Testen meiner Angular2 App einzurichten. Karma kann Erweiterungen für Importe in Spezifikationsdateien nicht anhängen. Zum Beispiel hat meine Spezifikationsdatei import {TileComponent} from './tiles.component'; Wenn ich Karma starte, erhalte ich die folgende Fehlermeldung: http://localhost:9876/base/wwwroot/app/tiles/tiles.component 404 (Not Found) Wenn ich versuche, zu diesem Link zu gehen und js am Ende manuell anzuhängen, wird es meine Datei laden.

karma.conf.js:

module.exports = function (config) { 
 

 
    var appBase = 'wwwroot/app/'; 
 
    var appAssets = '/base/app/'; 
 

 
    config.set({ 
 
     basePath: '', 
 
     frameworks: ['jasmine'], 
 
     plugins: [ 
 
      require('karma-jasmine'), 
 
      require('karma-chrome-launcher'), 
 
      require('karma-htmlfile-reporter') 
 
     ], 
 

 
     customLaunchers: { 
 
      Chrome_travis_ci: { 
 
       base: 'Chrome', 
 
       flags: ['--no-sandbox'] 
 
      } 
 
     }, 
 
     files: [    'node_modules/systemjs/dist/system.src.js', 
 

 
      'node_modules/core-js/client/shim.js', 
 

 
      'node_modules/reflect-metadata/Reflect.js', 
 
      'node_modules/zone.js/dist/zone.js', 
 
      'node_modules/zone.js/dist/jasmine-patch.js', 
 
      'node_modules/zone.js/dist/async-test.js', 
 
      'node_modules/zone.js/dist/fake-async-test.js', 
 

 
      // RxJs. 
 
      { pattern: 'node_modules/rxjs/**/*.js', included: false, watched: false }, 
 
      { pattern: 'node_modules/rxjs/**/*.js.map', included: false, watched: false }, 
 

 
      { pattern: 'node_modules/@angular/**/*.js', included: false, watched: false }, 
 
      { pattern: 'node_modules/@angular/**/*.js.map', included: false, watched: false }, 
 

 
      { pattern: 'systemjs.config.js', included: false, watched: false }, 
 
      //{ pattern: 'karma-test-shim.js', included: false, watched: false }, 
 
      //'systemjs.config.js', 
 
      'karma-test-shim.js', 
 
      { pattern: appBase + '**/*.js', included: false, watched: true }, 
 

 
      { pattern: appBase + '**/*.html', included: false, watched: true }, 
 
      { pattern: 'wwwroot/styles/**/*.css', included: false, watched: true }, 
 

 
      { pattern: 'app/**/*.ts', included: false, watched: false }, 
 
      { pattern: appBase + '**/*.js.map', included: false, watched: false } 
 
     ], 
 

 
     proxies: { 
 
      "/app/": appAssets 
 
     }, 
 

 
     exclude: [], 
 
     preprocessors: {}, 
 
     reporters: ['progress', 'html'], 
 

 
     htmlReporter: { 
 
      outputFile: '_test-output/tests.html', 
 

 
      pageTitle: 'Unit Tests', 
 
      subPageTitle: __dirname 
 
     }, 
 

 
     port: 9876, 
 
     colors: true, 
 
     logLevel: config.LOG_INFO, 
 
     autoWatch: true, 
 
     browsers: ['Chrome'], 
 
     singleRun: false 
 
    }) 
 
}

Karma-Test-shim.js

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

 
__karma__.loaded = function() { 
 
}; 
 

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

 
function isSpecFile(path) { 
 
    return /\.spec\.js$/.test(path); 
 
} 
 

 
function isBuiltFile(path) { 
 
    var builtPath = '/base/wwwroot/'; 
 
    return isJsFile(path) && (path.substr(0, builtPath.length) === builtPath); 
 
} 
 

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

 
System.config({ 
 
    baseURL: '/base', 
 
    packageWithIndex: true, // sadly, we can't use umd packages (yet?) 
 
    map: { 
 
     'http://localhost:9876/base/wwwroot/app/app.component': 'http://localhost:9876/base/wwwroot/app/app.component.js' 
 
    } 
 
}); 
 

 
System.import('systemjs.config.js') 
 
    .then(function() { 
 
     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);

Answer 1

Das Problem war, dass ich den Import system.config.j s zweimal. Ich habe den Import aus der Datei "karma.conf.js" entfernt. Ich habe auch einige kleinere Pfadänderungen vorgenommen.