_setAsap error when loading angular2-polyfilles.js in Karma unit test with Angular2 beta and SystemJS

Question

When running Karma unit test, I am getting the following error:

Chrome 47.0.2526 (Linux 0.0.0) ERROR
Uncaught TypeError: Cannot read property '_setAsap' of undefined
Evaluating path/node_modules/angular2/bundles/angular2-polyfills.min.js
Error loading path/node_modules/angular2/bundles/angular2-polyfills.min.js

The karma.conf.js contains something like:

// Karma configuration
// Generated on Tue Dec 08 2015 14:19:08 GMT-0600 (CST)
module.exports = function(config) {
    config.set({
        // base path that will be used to resolve all patterns (eg. files, exclude)
        basePath: '../',
        files: [
            'node_modules/angular2/bundles/angular2-polyfills.min.js',
            'node_modules/es6-shim/es6-shim.js',
            'node_modules/systemjs/dist/system.js',
            'node_modules/rxjs//Rx.js',
            'node_modules/angular2/bundles/angular2.min.js',
            'dist/components/uploader.js',
            'dist/components/uploader.spec.js'
        ],
        ...

The uploader.js is a compiled JavaScript file from TypeScript and is an Angular2 component. Uploader.spec.js is the unit test. I use Karma, SystemJS and Angular2 beta to try to set up the unit test.

When looking into _angular2_polyfills.js_, the _setAsap seems to point to module es6-promise . However, even I have node_modules/es6-promise/dist/es6-promise.js added into the file list, it does not work.

Answer 1

So, I had similar issues, and I had to add this to my system.conf.js file:

System.config({
    paths: {
        'agular2-polyfills': 'node_modules/angular2/bundles/angular2-polyfills.js',
        'typescript': 'node_modules/typescript/lib/typescript.js',
        'systemjs': 'node_modules/systemjs/dist/system.js',
        'system-polyfills': 'node_modules/systemjs/dist/system-polyfills.js',
        'es6-module-loader': 'node_modules/es6-module-loader/dist/es6-module-loader.js'
    },
    map: {
        angular2: 'node_modules/angular2',
        rxjs: 'node_modules/rxjs',
        crypto: '@empty'// this fixed my last issue
    },
    meta: {
        'path/to/components/*': {
            format: 'register'
        }
    }
});

If I remember correctly (I don't claim to be a systemjs ninja ) after looking through several stack questions and reading the config docs , I came to this solution, but I don't remember the reason for some of it other than it having to do with having to load everything using karma.

My karma.conf files array:

// list of files / patterns to load in the browser
    files: [
      'node_modules/reflect-metadata/Reflect.js',
      '*.spec.js',
      '**/*.spec.js',
      '**/**/*.spec.js'
    ]

and the karma.conf systemjs config:

systemjs: {
    // Path to your SystemJS configuration file 
    configFile: 'system.conf.js',

    // Patterns for files that you want Karma to make available, but not loaded until a module requests them. eg. Third-party libraries. 
    serveFiles: [
        'client/**/*.js',
        'server/**/*.js',
    ],

    // SystemJS configuration specifically for tests, added after your config file. 
    // Good for adding test libraries and mock modules 
    config: {
        transpiler: null,
        defaultJSExtensions: true
    },

    meta: {
        'angular2/angular2':{
            format: 'register'
        }
    }
},

IMPORTANT NOTE This may not be the best way, or even close, but this is how I got it working. I have not yet gone through my refactor phase on this part of my project, as I'll do that after I'm done with the first phase of my project.

Good luck!