I'm taking a course about angular testing and I trying to setup a test for a componet with a service and this service has the httpClias as depedency but I got this error when I tried to run it
NullInjectorError: R3InjectorError(DynamicTestModule)[MedicoService -> HttpClient -> HttpClient]:
NullInjectorError: No provider for HttpClient!
error properties: Object({ ngTempTokenPath: null, ngTokenPath: [ 'MedicoService', 'HttpClient', 'HttpClient' ] })
NullInjectorError: R3InjectorError(DynamicTestModule)[MedicoService -> HttpClient -> HttpClient]:
NullInjectorError: No provider for HttpClient!
at NullInjector.get (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:10756:1)
at R3Injector.get (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:10923:1)
at R3Injector.get (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:10923:1)
at injectInjectorOnly (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:2290:1)
at ɵɵinject (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:2294:1)
at Object.MedicoService_Factory [as factory] (ng:///MedicoService/ɵfac.js:5:41)
at R3Injector.hydrate (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:11091:1)
at R3Injector.get (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:10912:1)
at NgModuleRef$1.get (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:24988:1)
at TestBedRender3.inject (node_modules/@angular/core/__ivy_ngcc__/fesm2015/testing.js:1943:1)
Error: Expected undefined to be truthy.
at <Jasmine>
at UserContext.<anonymous> (src/app/intemedio2/medico/service/medico.service.spec.ts:14:21)
at ZoneDelegate.invoke (node_modules/zone.js/dist/zone-evergreen.js:364:1)
at ProxyZoneSpec.push.QpwO.ProxyZoneSpec.onInvoke (node_modules/zone.js/dist/zone-testing.js:292:1)
Chrome 86.0.4240.198 (Windows 10): Executed 1 of 28 (1 FAILED) (0 secs / 0.119 secs)
Chrome 86.0.4240.198 (Windows 10) MedicoService should be created FAILED
NullInjectorError: R3InjectorError(DynamicTestModule)[MedicoService -> HttpClient -> HttpClient]:
NullInjectorError: No provider for HttpClient!
error properties: Object({ ngTempTokenPath: null, ngTokenPath: [ 'MedicoService', 'HttpClient', 'HttpClient' ] })
NullInjectorError: R3InjectorError(DynamicTestModule)[MedicoService -> HttpClient -> HttpClient]:
NullInjectorError: No provider for HttpClient!
at NullInjector.get (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:10756:1)
at R3Injector.get (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:10923:1)
at R3Injector.get (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:10923:1)
at injectInjectorOnly (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:2290:1)
at ɵɵinject (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:2294:1)
at Object.MedicoService_Factory [as factory] (ng:///MedicoService/ɵfac.js:5:41)
at R3Injector.hydrate (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:11091:1)
at R3Injector.get (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:10912:1)
at NgModuleRef$1.get (node_modules/@angular/core/__ivy_ngcc__/fesm2015/core.js:24988:1)
at TestBedRender3.inject (node_modules/@angular/core/__ivy_ngcc__/fesm2015/testing.js:1943:1)
Error: Expected undefined to be truthy.
at <Jasmine>
at UserContext.<anonymous> (src/app/intemedio2/medico/service/medico.service.spec.ts:14:21)
at ZoneDelegate.invoke (node_modules/zone.js/dist/zone-evergreen.js:364:1)
Chrome 86.0.4240.198 (Windows 10): Executed 26 of 28 (1 FAILED) (skipped 2) (0.382 secs / 0.316 secs)
All thaI have is this service (medicosService)
import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class MedicoService {
constructor(public http: HttpClient) { }
getMedicos() {
return this.http.get('....');
}
}
and this component
import { MedicoService } from './service/medico.service';
import { Component, OnInit } from '@angular/core';
@Component({
selector: 'app-medico',
templateUrl: './medico.component.html',
styleUrls: ['./medico.component.css']
})
export class MedicoComponent implements OnInit {
constructor(public medicoService: MedicoService) { }
medicos: any [] = []
ngOnInit(): void {
}
saludarMEdico(nombre: string): string {
return `hello ${nombre}`;
}
optenerMedicos() {
this.medicoService.getMedicos().subscribe((medicos: any []) => {
this.medicos = medicos;
})
}
}
and this is the test
import { MedicoService } from './service/medico.service';
import { ComponentFixture, TestBed } from '@angular/core/testing';
/** El testbed es una clase con muchos metodos para hacewr pruebas */
import { MedicoComponent } from './medico.component';
import { HttpClientModule } from '@angular/common/http';
describe('MedicoComponent', () => {
let component: MedicoComponent;
let fixture: ComponentFixture<MedicoComponent>;
beforeEach(async () => {
await TestBed.configureTestingModule({
declarations: [MedicoComponent],
providers: [MedicoService],
imports:[HttpClientModule]
})
.compileComponents();
});
beforeEach(() => {
fixture = TestBed.createComponent(MedicoComponent);
component = fixture.componentInstance;
fixture.detectChanges();
});
//comprueba que el componente se cree
it('should create', () => {
expect(component).toBeTruthy();
});
// verificacion alternativa si el componente se creo, tenemos acceso a sus metodos
it('should return a greeting based on the sent name', () => {
const name = 'Gerardo';
const greeting = component.saludarMEdico(name);
expect(greeting).toContain(name);
});
});
}
I've tried to use HttpClientTestingModule instead of HttpClientModule in the imports but I have the same error so, I dont know what is going on.
Aucun commentaire:
Enregistrer un commentaire