I'm trying to test my login form component:
import { Component, OnInit } from '@angular/core';
import { FormGroup, FormBuilder, Validators } from '@angular/forms';
import { AuthService } from '../../../shared/services';
@Component({
selector: 'login',
templateUrl: 'login.component.html',
providers: [AuthService],
styleUrls: ['./login.component.scss']
})
export class LoginComponent implements OnInit {
loginForm: FormGroup;
username: FormGroup;
password: FormGroup;
constructor(private fb: FormBuilder,
private authService: AuthService)
{ }
ngOnInit() {
this.loginForm = this.fb.group({
username: ['', Validators.required],
password: ['', Validators.required]
});
}
submit() {
this.authService.login();
}
}
this is the test:
import {
inject,
TestBed
} from '@angular/core/testing';
import { ReactiveFormsModule } from '@angular/forms';
import { LoginComponent } from './login.component';
import { AuthService } from '../../../shared/services/auth.service';
import { ComponentFixture } from '@angular/core/testing';
class MockAuthService {
login() {
return true;
}
};
describe('LoginComponent', () => {
let fixture: ComponentFixture<LoginComponent>;
let login: LoginComponent;
beforeEach(() => {
TestBed.configureTestingModule({
imports: [
ReactiveFormsModule
],
providers: [
{
provide: AuthService,
useClass: MockAuthService
}
],
declarations: [LoginComponent]
});
fixture = TestBed.createComponent(LoginComponent);
login = fixture.componentInstance;
});
it('should submit the form to auth', inject([AuthService],
(auth: AuthService) => {
login.ngOnInit();
spyOn(auth, 'login');
login.submit();
expect(auth.login).toHaveBeenCalled();
}));
});
For some reason I can't understand, the test throws an error:
Error: No provider for RequestHandlerService!.
RequestHandler is a service I use in AuthService, which means that the test is not using my mocked class MockAuthService. Can you help figure out what I did wrong in the mocking?
Thanks.