Namespace jasmine not found in /node_modules/angular2/src/testing/matchers.d.ts

Question

I want to test my angular2 app with karma, but I get a typescript error:

/my/path/node_modules/angular2/src/testing/matchers.d.ts

Error:(4, 37) TS2503: Cannot find namespace 'jasmine'.

NPM Modules are installed, typescript compiler is running well. What's wrong?

myservice.serviceSpec.ts:

import {it, describe, expect, beforeEach, inject} from 
'angular2/testing';
import {myService} from "../app/myservice.service";

describe('Tests', () => {
    it('should be true', () => {
        expect(true).toBe(true);
    });
});

package.json:

{
  "name": "myapp",
  "version": "0.1.0",
  "dependencies": {
    "angular2": "^2.0.0-beta.2",
    "es6-promise": "^3.0.2",
    "es6-shim": "^0.33.13",
    "reflect-metadata": "^0.1.2",
    "rxjs": "^5.0.0-beta.0",
    "systemjs": "^0.19.17",
    "zone.js": "^0.5.10"
  },
  "devDependencies": {
    "jasmine-core": "^2.4.1",
    "karma": "^0.13.19",
    "karma-chrome-launcher": "^0.2.2",
    "karma-coverage": "^0.5.3",
    "karma-jasmine": "^0.3.7",
    "remap-istanbul": "^0.5.1"
  }
}

tsconfig.json:

{
  "compilerOptions": {
    "target": "ES5",
    "module": "system",
    "moduleResolution": "node",
    "sourceMap": true,
    "emitDecoratorMetadata": true,
    "experimentalDecorators": true,
    "removeComments": false,
    "noImplicitAny": true
  },
  "exclude": [
    "node_modules"
  ]
}

karma.conf.js:

// Karma configuration
// Generated on Wed Feb 10 2016 09:56:19 GMT+0100 (CET)

module.exports = function (config) {
    config.set ({

        // base path that will be used to resolve all patterns (eg. files, exclude)
        basePath: '',


        // frameworks to use
        // available frameworks: https://npmjs.org/browse/keyword/karma-adapter
        frameworks: ['jasmine'],


        // list of files / patterns to load in the browser
        files: [
            'node_modules/systemjs/dist/system.src.js',
            'node_modules/angular2/bundles/http.dev.js',
            'test/karma_test_shim.js',
            'test/myservice.serviceSpec.js',
            {pattern: 'app/**/*.js', included: false, watched: true},
            {pattern: 'test/**/*Spec.js', included: false, watched: true}
        ],


        // list of files to exclude
        exclude: [],


        // preprocess matching files before serving them to the browser
        // available preprocessors: https://npmjs.org/browse/keyword/karma-preprocessor
        preprocessors: {},


        // test results reporter to use
        // possible values: 'dots', 'progress'
        // available reporters: https://npmjs.org/browse/keyword/karma-reporter
        reporters: ['progress'],


        // web server port
        port: 9876,


        // enable / disable colors in the output (reporters and logs)
        colors: true,


        // level of logging
        // possible values: config.LOG_DISABLE || config.LOG_ERROR || config.LOG_WARN || config.LOG_INFO || config.LOG_DEBUG
        logLevel: config.LOG_INFO,


        // enable / disable watching file and executing tests whenever any file changes
        autoWatch: false,


        // start these browsers
        // available browser launchers: https://npmjs.org/browse/keyword/karma-launcher
        browsers: ['Chrome'],


        // Continuous Integration mode
        // if true, Karma captures browsers, runs the tests and exits
        singleRun: false,

        // Concurrency level
        // how many browser should be started simultaneous
        concurrency: Infinity
    })
}

karma_test-shim.js:

// 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/testing').then(function(testing) {
  return System.import('angular2/platform/testing/browser').then(function(testing_platform_browser) {
    testing.setBaseTestProviders(testing_platform_browser.TEST_BROWSER_PLATFORM_PROVIDERS,
                                 testing_platform_browser.TEST_BROWSER_APPLICATION_PROVIDERS);
  });
}).then(function() {
  return Promise.all(
    Object.keys(window.__karma__.files) // All files served by Karma.
    .filter(onlySpecFiles)
    .map(function(moduleName) {
      // loads all spec files via their global module names
      return System.import(moduleName);
  }));
}).then(function() {
  __karma__.start();
}, function(error) {
  __karma__.error(error.stack || error);
});
function onlyAppFiles(filePath) {
  return /^\/base\/app\/.*\.js$/.test(filePath)
}
function onlySpecFiles(path) {
  return /Spec\.js$/.test(path);
}

MatthewScarpino · Accepted Answer · 2016-02-10 15:18:31Z

5

The compiler needs the Jasmine declaration file, jasmine.d.ts, to declare Jasmine's functions. You can download it from here and reference it in TypeScript with:

/// <reference path="jasmine.d.ts"/>

answered Feb 10, 2016 at 15:18

MatthewScarpino

5,9667 gold badges40 silver badges52 bronze badges

Sign up to request clarification or add additional context in comments.

3 Comments

Galdor Over a year ago

So I have to put this line in all of my Specs? /// <reference path="../node_modules/angular2/typings/jasmine/jasmine.d.ts"/>. Seems to work.

Galdor Over a year ago

no, put it into an extra helpers file, your answer was very helpful

Serhii Over a year ago

The link is broken and answer is not clear. Can you please add better and clearer description?

Dila Gurung · Accepted Answer · 2017-02-08 11:31:18Z

3

In my case installing "@types/jasmine" fixed this issue.

answered Feb 8, 2017 at 11:31

Dila Gurung

1,78421 silver badges26 bronze badges

Comments

MrLehiste · Accepted Answer · 2016-03-04 23:39:04Z

2

Just run following command in your project root folder:

typings install jasmine --save-dev --ambient

Then reference paths are not longer necessary

answered Mar 4, 2016 at 23:39

MrLehiste

1,0361 gold badge8 silver badges14 bronze badges

Comments

Galdor · Accepted Answer · 2016-02-11 10:37:06Z

1

Answer is in angular2 upgrade guide:

Add a file called test_helper.ts to the test directory and add a reference to the Jasmine and mock type definitions we already installed earlier: test/test_helper.ts

/// <reference path="../typings/jasmine/jasmine.d.ts" />

answered Feb 11, 2016 at 10:37

Galdor

2,0136 gold badges27 silver badges45 bronze badges

Comments

ramon22 · Accepted Answer · 2016-05-03 16:31:52Z

1

You can try declaring jasmine

namespace Tests {
  declare var jasmine
  ///tests
  describe('Tests', () => {
      it('should be true', () => {});
  });
}

answered May 3, 2016 at 16:31

ramon22

3,6363 gold badges37 silver badges49 bronze badges

Comments

Serhii · Accepted Answer · 2019-07-07 08:50:04Z

1

The similar issue in my case was resolved using import:

import * as jasmine from 'jasmine-core';

P.S. Make sure the first you have installed necessary jasmine packages (jasmine-core ...).

answered Jul 7, 2019 at 8:50

Serhii

7,64516 gold badges69 silver badges126 bronze badges

Collectives™ on Stack Overflow

Namespace jasmine not found in /node_modules/angular2/src/testing/matchers.d.ts

6 Answers 6

3 Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

6 Answers 6

3 Comments

Comments

Comments

Comments

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related