2017-01-05 2 views
1

Мое приложение имеет множество модулей со многими компонентами и услугами и другими материалами Angular2.Угловое тестирование 2 - Невозможно создать компонент

Теперь я пытаюсь использовать метод TestBed для создания модульных тестов с жасмином + кармой.

Я столкнулся с ошибкой при раскрытии доказательства концепции. Я создал тест для одного из моих компонентов, который выглядит следующим образом:

let myCompServiceStub = {} as MyComponentService; 
let routerStub = {} as Router; 
let globalServiceStub = {} as MyGlobalService; 

describe('MyComponent',() => { 
    let component: MyComponent; 
    let fixture: ComponentFixture<MyComponent>; 

    beforeEach(async(() => { 
     TestBed 
      .configureTestingModule({ 
       imports: [MyModule], 
       providers: [ 
        { provide: MyComponentService, useValue: myCompServiceStub }, 
        { provide: Router, useValue: routerStub }, 
        { provide: MyGlobalService, useValue: globalServiceStub } 
       ] 
      }) 
      .compileComponents() 
      .then(() => { 
       fixture = TestBed.createComponent(MyComponent); 
       // component = fixture.componentInstance; 
      }); 
    })); 


    it('test it',() => { 
     expect(true).toBe(true); 
    }); 
}); 

MyModule имеет кучу импорта других модулей (большинство из них шахты, но есть также CommonModule, MaterializeModule, FormsModule модулей образуют угловые и материализовать), которые определяют некоторые глобальные компоненты. Он также имеет MyComponentService в провайдерах. Импортированные пользовательские модули не имеют предоставленных услуг.

MyGlobalService предоставлен в AppComponent, который является основным компонентом.

Когда я пытаюсь запустить тесты, я получаю сообщение об ошибке:

PhantomJS 2.1.1 (Windows 8 0.0.0) MyComponent test it FAILED 
     [email protected]:8833:41 
     [email protected]:10715:50 
     [email protected]:8832:53 
     [email protected]:8709:58 
     [email protected]:8976:43 
     [email protected]:4098:31 
     karma-shim.js:4111:33 
     [email protected]:4466:13 
     [email protected]:9045:79 
     karma-shim.js:9081:32 

И я действительно застрял на нем, уже нет хороших идей , что я делаю неправильно?

Мои тесты зависимостей выглядит следующим образом:!

"@angular/common": "~2.3.0", 
"@angular/compiler": "~2.3.0", 
"@angular/compiler-cli": "^2.3.1", 
"@angular/core": "~2.3.0", 
"@angular/forms": "~2.3.0", 
"@angular/http": "~2.3.0", 
"@angular/platform-browser": "~2.3.0", 
"@angular/platform-browser-dynamic": "~2.3.0", 
"@angular/platform-server": "^2.3.1", 
"@angular/router": "~3.3.0", 
"angular2-materialize": "6.3.0", 
"karma": "1.1.2", 
"karma-chrome-launcher": "^1.0.1", 
"karma-coverage": "^1.0.0", 
"karma-jasmine": "^1.0.2", 
"karma-phantomjs-launcher": "^1.0.0", 
"karma-remap-istanbul": "0.1.1", 
"karma-sourcemap-loader": "^0.3.7", 
"karma-webpack": "1.7.0", 
"@types/jasmine": "^2.5.36", 
"jasmine-core": "^2.3.4", 
"jasmine-spec-reporter": "^2.4.0", 

ответ

0
let fixture: ComponentFixture<MyComponent>; 

и

fixture = TestBed.createComponent(ListPRDComponent); 

MyComponent = ListPRDComponent

попробовать:

fixture = TestBed.createComponent(MyComponent); 
+0

Упс, это была опечатка, о которой идет речь, чтобы скрыть некоторые секретные данные :) –

1

Убедитесь, что вы на самом деле импортировать компонент (не могу увидеть, если вы сделали или нет) через

import { MyComponent } from './MyComponent.component'; 
import { FormsModule } from '@angular/forms'; 

Также в вас TestBed.configureTestingModule установить компонент в качестве декларации

TestBed.configureTestingModule({ 
     declarations: [ MyComponent ], 
     imports:[FormsModule ], 
     providers:[] 
    }) 
    .compileComponents() 
    })); 

P.S. Я также импортирую FormsModule на все мои тестовые компоненты.

+0

У меня была аналогичная проблема, импортировав FormsModule и HttpClientTestingModule, исправил ее для меня – remib

Смежные вопросы