2016-02-05 2 views
0

У меня есть простой тест, который я пытаюсь запустить через жасмин. Вот файлы ts.Jasmine Testing Angular2 Компоненты, не соответствующие @Component аннотация

Unit-test.html

<html> 
<head> 
    <title>1st Jasmine Tests</title> 
    <link rel="stylesheet" href="../node_modules/jasmine-core/lib/jasmine-core/jasmine.css" /> 
    <script src="../node_modules/systemjs/dist/system.src.js"></script> 
    <script src="../node_modules/angular2/bundles/angular2.dev.js"></script> 
    <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> 
    <!--<script src="../node_modules/zone/lib/zone.js"></script>--> 

</head> 
<body> 

    <script> 
     // #2. Configure systemjs to use the .js extension 
     //  for imports from the app folder 
     System.config({ 
      transpiler: 'typescript', 
      typescriptOptions: { emitDecoratorMetadata: true }, 
      packages: { 
       'test': { defaultExtension: 'js' }, 
       'app': { defaultExtension: 'js' } 
      } 
     }); 
     // #3. Import the spec file explicitly 
     System.import('test/test.spec') 
      // #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> 

test.spec.ts

import {TestComponent} from "../app/components/about/test.component" 

describe('Test Component->',() => { 
    it('has name given in the constructor',() => { 
     var t1 = new TestComponent('Super Cat'); 
     expect(t1.myValue).toEqual('Super Cat'); 
    }); 
    it('does not have the id given in the constructor',() => { 
     var t2 = new TestComponent('Super Cat'); 
     expect(t2.myValue).not.toEqual(1); 
    }); 
}); 

test.component.ts ВНИМАНИЕ комментируемого Компонентный аннотацию

import {Component} from 'angular2/core'; 

//@Component({ 
// selector: 'test-component', 
// templateUrl: "<div></div>", 
//}) 

export class TestComponent { 

    constructor(value: string) { 
     this.myValue = value; 
    } 

    public myValue = ''; 

    onKey2() { 
     return this.myValue; 
    } 
} 

Теперь, если я ударил unit-test.html с аннотацией @Copmonent, я получил следующий результат:

enter image description here

однако, если я раскомментировать аннотаций линию @Component, так как это на самом деле, как будет определяться мои компоненты ... Я получаю следующую ошибку

enter image description here

Может кто-то пожалуйста, скажите мне, почему я получаю эту ошибку. Я пробовал импортировать «отражать метаданные», а также не добился успеха

ответ

0

Хорошо, я думаю, что получил ... Мне пришлось изменить раздел сценария в моем unit-test.html на следующий в этом точном порядке !! Теперь мне просто нужно выяснить, как это сделать в отдельный проект.

<script src="../node_modules/angular2/bundles/angular2-polyfills.js"></script> 
<script src="../node_modules/systemjs/dist/system.src.js"></script> 
<script src="../node_modules/rxjs/bundles/Rx.js"></script> 
<script src="../node_modules/angular2/bundles/angular2.dev.js"></script> 
<script src="../node_modules/angular2/bundles/testing.dev.js"></script> 
<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> 
Смежные вопросы