首页 文章

Angular2,Typescript,Karma,Jasmine命令行测试

提问于
浏览
8

在Angular2网站上是一个在浏览器中使用Jasmine进行单元测试的示例:https://angular.io/docs/ts/latest/testing/first-app-tests.html

虽然这样可行,但使用Karma从命令行运行相同的测试会很不错 . 我尝试了很多配置,但它们都不适用于Angular2,SystemJs,Typescript,Karma,Jasmine的组合 .

http://twofuckingdevelopers.com/2016/01/testing-angular-2-with-karma-and-jasmine/本教程使用CommonJS,我试图用SystemJS替换它,导致错误并且找不到lib .

当我尝试https://github.com/juliemr/ng2-test-seed的配置时,它会抛出如下错误:

25 01 2016 16:19:57.489:WARN [web-server]: 404: /angular2/http
25 01 2016 16:19:57.493:WARN [web-server]: 404: /base/app/angular2/components/cities/cities.data.srv
25 01 2016 16:19:57.494:WARN [web-server]: 404: /base/app/angular2/components/cities/city
25 01 2016 16:19:57.695:WARN [web-server]: 404: /base/app/angular2/components/cities/city.model
25 01 2016 16:19:57.703:WARN [web-server]: 404: /base/app/angular2/pipes/init-caps-pipe
25 01 2016 16:19:57.717:WARN [web-server]: 404: /base/app/angular2/pipes/init-caps/init-caps.pipe

有没有人使用Angular2,Typescript,Karma,Jasmine命令行测试的工作示例?

1 回答

  • 1

    我使用它了:

    karma.conf.js

    module.exports = function(config) {
      config.set({
    
        basePath: '',
    
        frameworks: ['jasmine'],
    
        files: [
          // paths loaded by Karma
          {pattern: 'node_modules/angular2/bundles/angular2-polyfills.js', included: true, watched: true},
          {pattern: 'node_modules/systemjs/dist/system.src.js', included: true, watched: true},
          {pattern: 'node_modules/rxjs/bundles/Rx.js', included: true, watched: true},
          {pattern: 'node_modules/angular2/bundles/angular2.dev.js', included: true, watched: true},
          {pattern: 'node_modules/angular2/bundles/testing.dev.js', included: true, watched: true},
          {pattern: 'node_modules/angular2/bundles/http.dev.js', included: true, watched: true},
          {pattern: 'karma-test-shim.js', included: true, watched: true},
    
    
          // paths loaded via module imports
          {pattern: 'app/**/*.js', included: false, watched: true},
    
          // paths loaded via Angular's component compiler
          // (these paths need to be rewritten, see proxies section)
          // {pattern: 'app/**/*.html', included: false, watched: true},
          // {pattern: 'app/**/*.css', included: false, watched: true},
    
          // paths to support debugging with source maps in dev tools
          {pattern: 'app/**/*.ts', included: false, watched: false},
          {pattern: 'app/**/*.js.map', included: false, watched: false}
        ],
    
        // proxied base paths
        proxies: {
          // required for component assests fetched by Angular's compiler
          "/app/": "/base/app/"
        },
    
        reporters: ['progress'],
        port: 9876,
        colors: true,
        logLevel: config.LOG_INFO,
        autoWatch: true,
        browsers: ['Chrome'],
        singleRun: true
      })
    }
    

    karma-test-shim.js

    // Turn on full stack traces in errors to help debugging
    Error.stackTraceLimit=Infinity;
    
    
    jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;
    
    // // Cancel Karma's synchronous start,
    // // we will call `__karma__.start()` later, once all the specs are loaded.
    __karma__.loaded = function() {};
    
    
    System.config({
      packages: {
        'base/app': {
          defaultExtension: false,
          format: 'register',
          map: Object.keys(window.__karma__.files).
                filter(onlyAppFiles).
                reduce(function createPathRecords(pathsMapping, appPath) {
    
                  // creates local module name mapping to global path with karma's fingerprint in path, e.g.:
                  // './hero.service': '/base/src/app/hero.service.js?f4523daf879cfb7310ef6242682ccf10b2041b3e'
                  var moduleName = appPath.replace(/^\/base\/app\//, './').replace(/\.js$/, '');
                  pathsMapping[moduleName] = appPath + '?' + window.__karma__.files[appPath]
                  return pathsMapping;
                }, {})
    
          }
        }
    });
    
    System.import('angular2/src/platform/browser/browser_adapter').then(function(browser_adapter) {
      browser_adapter.BrowserDomAdapter.makeCurrent();
    }).then(function() {
      return Promise.all(
        Object.keys(window.__karma__.files) // All files served by Karma.
        .filter(onlySpecFiles)
        // .map(filePath2moduleName)        // Normalize paths to module names.
        .map(function(moduleName) {
          // loads all spec files via their global module names (e.g. 'base/src/app/hero.service.spec')
          return System.import(moduleName);
        }));
    })
    .then(function() {
      __karma__.start();
    }, function(error) {
      __karma__.error(error.stack || error);
    });
    
    
    function filePath2moduleName(filePath) {
      return filePath.
               replace(/^\//, '').              // remove / prefix
               replace(/\.\w+$/, '');           // remove suffix
    }
    
    
    function onlyAppFiles(filePath) {
      return /\/base\/app\/(?!.*\.spec\.js$).*\.js$/.test(filePath);
    }
    
    
    function onlySpecFiles(path) {
      return /spec\.js$/.test(path);
    }
    

相关问题