Jasmine单元测试不加载组件Angular2 RC1

时间:2016-06-03 13:49:25

标签: unit-testing angular

我无法让我的茉莉花单元测试加载一个组件进行测试。

Webstorm告诉我,语法方面的一切都很好。但是,当我加载实时服务器以进行单元测试加载时,它似乎不起作用。

我将它编译到root的测试目录。

所以这是我的目录树(abv为了方便):

-- client(src)
|-- common
|---- welcome.component.ts
|---- welcome.spec.ts
-- node_modules
-- tests(compiled spec and components) 
|-- client(src)
|---- common
|------ welcome.component.ts
|------ welcome.spec.ts
--unit-tests.html 
--systemjs.config.js

直播服务器正在给我这个:

GET /tests/client/common/welcome.component 404 

welcome.spec.ts

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

import {WelcomeComponent} from './welcome.component';

describe('Welcome tests', () => {
    let welcome:WelcomeComponent;

    beforeEach(() => {
        welcome = new WelcomeComponent('sir');
    });

    it('Nombre should equal sir', () => {
        expect(welcome.nombre).toEqual('sir');
    })
});

unit-tests.html

<!DOCTYPE html>
<html>
<head>
    <meta http-equiv="content-type" content="text/html;charset=utf-8">
    <title>Tests</title>
    <link rel="stylesheet" href="node_modules/jasmine-core/lib/jasmine-core/jasmine.css">
    <script src="node_modules/jasmine-core/lib/jasmine-core/jasmine.js"></script>
    <script src="node_modules/jasmine-core/lib/jasmine-core/jasmine-html.js"></script>
    <script src="node_modules/jasmine-core/lib/jasmine-core/boot.js"></script>
</head>
<body>
    <!-- #1. add the system.js library -->
    <script src="node_modules/zone.js/dist/zone.js"></script>
    <script src="node_modules/reflect-metadata/Reflect.js"></script>
    <script src="node_modules/systemjs/dist/system.src.js"></script>

    <script src="systemjs.config.js"></script>
    <script>
        // #2. Configure systemjs to use the .js extension
        //     for imports from the app folder
        System.config({
            packages: {
                'client': {defaultExtension: 'js'}
            }
        });

        // #3. Import the spec file explicitly
        System.import('tests/client/common/welcome.spec.js');
        System.import('tests/client/common/header.spec.js')
        // #4. wait for all imports to load ...
        //     then re-execute `window.onload` which
        //     triggers the Jasmine test-runner start
        //     or explain what went wrong.
                .then(window.onload)
                .catch(console.error.bind(console));
    </script>
</body>
</html>

systemjs.config.js

(function(global) {

  // map tells the System loader where to look for things
  var map = {
    'app':                        'tests/client', // 'dist',
    'rxjs':                       'node_modules/rxjs',
    'angular2-in-memory-web-api': 'node_modules/angular2-in-memory-web-api',
    '@angular':                   'node_modules/@angular'
  };

  // packages tells the System loader how to load when no filename and/or no extension
  var packages = {
    'app':                        { main: 'main.js',  defaultExtension: 'js' },
    'rxjs':                       { defaultExtension: 'js' },
    'angular2-in-memory-web-api': { defaultExtension: 'js' },
  };

  var packageNames = [
    '@angular/common',
    '@angular/compiler',
    '@angular/core',
    '@angular/http',
    '@angular/platform-browser',
    '@angular/platform-browser-dynamic',
    '@angular/router',
    '@angular/router-deprecated',
    '@angular/testing',
    '@angular/upgrade',
  ];

  // add package entries for angular packages in the form '@angular/common': { main: 'index.js', defaultExtension: 'js' }
  packageNames.forEach(function(pkgName) {
    packages[pkgName] = { main: 'index.js', defaultExtension: 'js' };
  });

  var config = {
    map: map,
    packages: packages
  }

  // filterSystemConfig - index.html's chance to modify config before we register it.
  if (global.filterSystemConfig) { global.filterSystemConfig(config); }

  System.config(config);

})(this);

如果你也需要我,我可以添加更多,header.spec工作得很好,但它是自我容器。 (期望true = true等)

SystemJS应该为单元测试加载它,但它没有,网站本身工作得很好所以Welcome.component很好。但由于某种原因,我无法加载单元测试。

我哪里会出错?我觉得这是一个配置问题,但我对单元测试不是很熟悉。

1 个答案:

答案 0 :(得分:1)

前几天我遇到了类似的问题,请查看this comment.如果您有spec-bundle.js或类似内容,请确保var testingvar browser指的是RC1而非beta。

另外,如果你有这个地方:testing.setBaseTestProviders( browser.TEST_BROWSER_STATIC_PLATFORM_PROVIDERS, browser.TEST_BROWSER_STATIC_APPLICATION_PROVIDERS); 这是它应该如何寻找RC1,它与beta

不同