4

I am currently trying to get unit testing working with Angular2 final and karma + jasmine.

I have the following problem: TypeError: Cannot read property 'injector' of null if don't add: TestBed.initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting()) .configureTestingModule({ declarations: [], providers: [Stuff], imports: [Stuff] });

To my test.

But I can only call the initTestEnvironment and configureTestingModule once, so more than 1 test is not possible. And I'd like to prevent having an init test.

Here is my karma-test-shim.js

    // #docregion
// /*global jasmine, __karma__, window*/
Error.stackTraceLimit = 0; // "No stacktrace"" is usually best for app testing.

// Uncomment to get full stacktrace output. Sometimes helpful, usually not.
// Error.stackTraceLimit = Infinity; //

jasmine.DEFAULT_TIMEOUT_INTERVAL = 1000;

var builtPath = '/base/app/';

__karma__.loaded = function () { };

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

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

function isBuiltFile(path) {
  return isJsFile(path) && (path.substr(0, builtPath.length) == builtPath);
}

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

System.config({
  baseURL: '/base',
  // Extend usual application package list with test folder
  packages: { 'testing': { main: 'index.js', defaultExtension: 'js' } },

  // Assume npm: is set in `paths` in systemjs.config
  // Map the angular testing umd bundles
  map: {
    '@angular/core/testing': 'npm:@angular/core/bundles/core-testing.umd.js',
    '@angular/common/testing': 'npm:@angular/common/bundles/common-testing.umd.js',
    '@angular/compiler/testing': 'npm:@angular/compiler/bundles/compiler-testing.umd.js',
    '@angular/platform-browser/testing': 'npm:@angular/platform-browser/bundles/platform-browser-testing.umd.js',
    '@angular/platform-browser-dynamic/testing': 'npm:@angular/platform-browser-dynamic/bundles/platform-browser-dynamic-testing.umd.js',
    '@angular/http/testing': 'npm:@angular/http/bundles/http-testing.umd.js',
    '@angular/router/testing': 'npm:@angular/router/bundles/router-testing.umd.js',
    '@angular/forms/testing': 'npm:@angular/forms/bundles/forms-testing.umd.js',
  },
});

System.import('systemjs.config.js')
  .then(importSystemJsExtras)
  .then(initTestBed)
  .then(initTesting);

/** Optional SystemJS configuration extras. Keep going w/o it */
function importSystemJsExtras(){
  return System.import('systemjs.config.extras.js')
  .catch(function(reason) {
    console.log(
      'WARNING: System.import could not load "systemjs.config.extras.js"; continuing without it.'
    );
    console.log(reason);
  });
}

function initTestBed(){
  return Promise.all([
    System.import('@angular/core/testing'),
    System.import('@angular/platform-browser-dynamic/testing')
  ])

  .then(function (providers) {
    var coreTesting    = providers[0];
    var browserTesting = providers[1];

    console.log("call initTestEnvironment")
    coreTesting.TestBed.initTestEnvironment(
      browserTesting.BrowserDynamicTestingModule,
      browserTesting.platformBrowserDynamicTesting());

    console.log("call configure teting module")
    coreTesting.TestBed.configureTestingModule({
      declarations: [],
      providers: [],
      imports: []
    })
  })


}

// Import all spec files and start karma
function initTesting () {
  return Promise.all(
    allSpecFiles.map(function (moduleName) {
      return System.import(moduleName);
    })
  )
  .then(__karma__.start, __karma__.error);
}

I thought calling the initTestEnvironment in the test shim is enough. I am surprised that I the call in the karma-test-shim.js seems to have no effect.

package.json and code are in a related question: AsyncTestCompleter Browserify Angular2 HTTP Mock Test

Thank you so much for your help.

Community
  • 1
  • 1
Toby
  • 229
  • 1
  • 2
  • 7
  • 1
    If the `TestBed.initTestEnvironment` is already in the shim, there's no need to call it again in your tests. Have you confirmed that the shim is even being used? Did you add it to your karma config? – Paul Samsotha Oct 14 '16 at 05:07
  • Yes I see the log output: console.log("call configure teting module"). But I get the error: TypeError: Cannot read property 'injector' of null. I need to call TestBed.initTestEnvironment(BrowserDynamicTestingModule, platformBrowserDynamicTesting()) for the tests to work. But I call it in a beforeEach(), so when I add a second test it complains that I called TestBed.initTestEnvironment more than once (But in reality I called it three times). – Toby Oct 17 '16 at 02:11
  • 2
    You can call `TestBed.resetEnvironment` before the call to initEnvironment. That might do the trick. – Paul Samsotha Oct 17 '16 at 02:13
  • @peeskillet that works! Thank You! – Toby Oct 17 '16 at 02:38

0 Answers0