I am working on component testing with angular2. in my html template i use the translate pipe. This is the code of the test :
import { ComponentFixture, TestBed ,getTestBed} from '@angular/core/testing';
import { By } from '@angular/platform-browser';
import { DebugElement } from '@angular/core';
import { RightComponent } from './right.component';
import {TranslateService} from 'ng2-translate/ng2-translate';
import {Injector} from "@angular/core";
let comp: RightComponent;
let fixture: ComponentFixture<RightComponent>;
let el: DebugElement;
let translate: TranslateService;
let injector: Injector;
describe('testComponent', () => {
beforeEach(() => {
TestBed.configureTestingModule({
declarations: [ RightComponent ]
});
injector = getTestBed();
translate = injector.get(TranslateService);
fixture = TestBed.createComponent(RightComponent);
comp = fixture.componentInstance; // BannerComponent test instance
// get title DebugElement by element name
el = fixture.debugElement.query(By.css('h2'));
});
it('should display original title', () => {
fixture.detectChanges(); // trigger data binding
expect(el.nativeElement.textContent).toContain('Liste des droits');
});
});
i got this error the the translate pipe is not known :
Error: Template parse errors:
The pipe 'translate' could not be found ("<h2>[ERROR ->]{{'RIGHT_TITLE' | translate}}</h2>
<div class="table-responsive">
<table id="rightTableId" clas"): RightComponent@0:4
The pipe 'translate' could not be found ("
<table id="rightTableId" class="table table-striped">
<tr>
<th>[ERROR ->]{{'NAME_LABEL' | translate}}</th>
</tr>
<tr *ngFor="let right of rights">
"): RightComponent@4:16
The pipe 'translate' could not be found ("
</tr>
<tr *ngFor="let right of rights">
<td>[ERROR ->]{{right.name | translate}}</td>
</tr>
</table>
How we resolve this problem ?
Thanks.
it's the ng2-translate github.com/ocombe/ng2-translate
You need to configure the TestBed
with the library module just like you would configure the library with your real application. And looking at the documentation, it shows configuring it by importing the module
imports: [
TranslateModule.forRoot()
]
So you should do the same in the TestBed
configuration
TestBed.configureTestingModule({
declarations: [ RightComponent ],
imports: [TranslateModule.forRoot()]
});
This is what the TestBed.configureTestingModule
is for: to configure a module for the test environment.