I want to test a particular function located inside a component, so I don't really need to render its template or CSS. As far as I've researched, there's no way to prevent the template from loading, but I want to ask if there is a way to exclude the CSS files given inside the styles property.
This is the component:
@Component({
selector: 'app-form',
templateUrl: './form.component.html',
styleUrls: [ './form.component.css' ],
encapsulation: ViewEncapsulation.None,
})
export class FormComponent implements OnInit {
constructor(
// many dependencies
) {}
// ....
functionIWantToTest() { /*...*/}
}
This is the CSS that imports other files (which are not found (see below))
@import url("/vendor/selectize/dist/css/selectize.css");
@import url("/vendor/codemirror/lib/codemirror.css");
// many other rules
This is the test config:
let service: NetworktoolsSmtp;
let formComponent: FormComponent;
@Injectable()
class TranslateServiceStub {
}
@Injectable()
class NetworktoolsSmtpStub {
}
@Injectable()
class NetworkInterfaceStub {
}
@Injectable()
class MasterApiEntityRepositoryServiceStub {
}
@Injectable()
class AlertsRepositoryServiceStub {
}
let translations: any = {"TEST": "This is a test"};
class FakeLoader implements TranslateLoader {
getTranslation(lang: string): Observable<any> {
return Observable.of(translations);
}
}
// there is a pipe names keys in the form template
@Pipe({name: 'keys'})
class KeysStub implements PipeTransform {
transform(value: number): number {
return value;
}
}
beforeEach(async(() => {
return TestBed.configureTestingModule({
imports: [
TranslateModule.forRoot({
loader: {provide: TranslateLoader, useClass: FakeLoader}
})
],
declarations: [
FormComponent,
KeysStub,
],
providers: [
{ provide: NetworktoolsSmtp, useClass: NetworktoolsSmtpStub },
{ provide: TranslateService, useClass: TranslateServiceStub },
{ provide: NetworkInterface, useClass: NetworkInterfaceStub },
{ provide: MasterApiEntityRepositoryService, useClass: MasterApiEntityRepositoryServiceStub },
{ provide: TranslateService, useClass: TranslateServiceStub },
{ provide: AlertsRepositoryService, useClass: AlertsRepositoryServiceStub },
],
schemas: [ NO_ERRORS_SCHEMA ]
}).compileComponents();
}));
beforeEach(() => {
service = TestBed.get(NetworktoolsSmtp);
formComponent = TestBed.createComponent(FormComponent).componentInstance;
});
These are the warnings shown in the console when running tests. I would like to prevent the loading of the CSS file so that there is no attempt to load the other resources (they are not found because they are not supposed to exist until the application is built). Is there a way to do it?
Aucun commentaire:
Enregistrer un commentaire