У меня есть angular проект, для которого я хочу написать модульный тест. Всякий раз, когда тест попадает в функцию getAlert в коде, я получаю эту ошибку: Failed: this.alertController.getAlerts не является функцией. Я понятия не имею, что здесь делать.
alert.component.ts
import {Component, OnInit} from '@angular/core';
import {AlertController} from '../../controllers/AlertController';
import {Alert} from '../../entities/Alert';
@Component({
selector: 'app-alert',
templateUrl: './alert.component.html',
styleUrls: ['./alert.component.css']
})
export class AlertComponent implements OnInit {
alerts: Alert[];
constructor(private alertController: AlertController) {
}
ngOnInit(): void {
this.alertController.getAlerts().subscribe(alert => {
this.alerts = alert;
});
}
}
alert.component.spe c .ts
import {async, TestBed} from '@angular/core/testing';
import {FormsModule} from '@angular/forms';
import {HttpClientModule} from '@angular/common/http';
import {RouterTestingModule} from '@angular/router/testing';
import {CUSTOM_ELEMENTS_SCHEMA} from '@angular/core';
import {AlertComponent} from './alert.component';
import {of} from 'rxjs';
import {AlertController} from '../../controllers/AlertController';
const alertServiceStub = {
get() {
const alert = [
{
alertId: 1,
alertMessage: 'test message',
transactionContext: null,
state: null
}];
return of( alert );
}
};
describe('RuleOverViewComponentTest', () => {
beforeEach(async(() => {
TestBed.configureTestingModule({
declarations: [
AlertComponent
],
imports: [FormsModule, HttpClientModule, RouterTestingModule],
providers: [AlertComponent, {provide: AlertController, useValue: alertServiceStub}],
schemas: [
CUSTOM_ELEMENTS_SCHEMA
]
}).compileComponents();
}));
it('should create the component', async(() => {
const fixture = TestBed.createComponent(AlertComponent);
const app = fixture.debugElement.componentInstance;
expect(app).toBeTruthy();
}));
it('should create the component', async(() => {
const fixture = TestBed.createComponent(AlertComponent);
fixture.detectChanges();
expect(document.querySelectorAll('#alert').length).toEqual(1);
}));
});
AlertController.ts
@Injectable({
providedIn: 'root'
})
export class AlertController {
alertUrl: string;
constructor(
private httpClient: HttpClient
) {
this.alertUrl = 'http://localhost:8091/alert-service/';
}
public getAlerts(): Observable<Alert[]> {
return this.httpClient.get<Alert[]>(this.alertUrl + 'alert');
}
public getAlert(alertId: number): Observable<Alert> {
return this.httpClient.get<Alert>(this.alertUrl + 'alert/' + alertId);
}
public blockCard(alertId: number) {
return this.httpClient.post(this.alertUrl + 'blockCard/', alertId);
}
public closeAlert(alertId: number) {
return this.httpClient.post(this.alertUrl + 'closeAlert', alertId);
}
}
Я получаю это с каждой функцией в каждом тесте, который я пытаюсь сделать. Но насколько я знаю, как я сделал функции, это прекрасно. так что же на самом деле происходит, как я могу сделать тест успешным.