в моем Angular компоненте у меня есть массив объектов компаний, который предоставляется как @Input()
: при загрузке (как это происходит из запроса HTTP) я беру значение и присваиваю его другой переменной с именем filteredList
, который я использую для *ngFor
.
*ngFor
используется в меню выбора, и у меня есть @ViewChild
, который является HTML текстовым вводом, который, когда происходит событие keyup, я беру значение ввода и фильтрую FilterList. Я записываю событие keyup, используя rx JS fromEvent
Для упрощения это мой HTML
<input id="companiesInput" #companyInput>
<mat-selection-list (selectionChange)="listBoxChange($event)">
<mat-list-option
*ngFor="let company of filteredList"
[value]="company"
[checkboxPosition]="'before'">
{{company.displayName}}
</mat-list-option>
</mat-selection-list>
и вот часть моего кода компонента ... все работает ну !! Вот мой тест
describe('tagsSubscription', () => {
it('should filter the available list of companies returned', () => {
const dummyArray = [
{ id: 1, displayName: 'saftey io' },
{ id: 2, displayName: 'msa' },
{ id: 3, displayName: 'acme' }
];
component.companyList = dummyArray;
fixture.detectChanges();
component.ngOnChanges({ companyList: { currentValue: dummyArray } });
const fromEventSpy = spyOn(rxjs, 'fromEvent').and.returnValue(() => rxjs.of({}));
const companiesInput = element.querySelector('#companiesInput');
element.querySelector('#companiesInput').value = 'ac';
companiesInput.dispatchEvent(generateKeyUpEvent('a'));
fixture.detectChanges();
companiesInput.dispatchEvent(generateKeyUpEvent('c'));
fixture.detectChanges();
expect(component.filteredList.length).toEqual(1);
});
});
После выхода из системы я вижу, что в моем тесте значение fromEvent никогда не вызывается и, таким образом, tagsSource.subscribe никогда не запускается. Я делаю что-то не так, я подумал о том, чтобы высмеивать fromEvent
в моем тесте, добавив следующую строку в начало моего мероприятия, например:
const fromEventSpy = spyOn(rxjs, 'fromEvent').and.returnValue(() => rxjs.of('ac'))
;
это не так тоже не работает. Кто-нибудь знает, как проводить тестирование с помощью Obventables с помощью Angular, и, возможно, подскажет, как мне выполнить тестирование?