Currently, I am trying to perform a test on a select element...
<select [ngModel]="selectedRouters" name="routerName" class="form-control" id="routersSelect" size="12" (ngModelChange)="selectRouters($event)" multiple>
<option [value]="router.name" *ngFor="let router of routers$ | orderBy : 'name'">
{{router.name}}
</option>
</select>
This test is done with a method that looks like:
selectRouters(routers) {
this.routers$
.filter(router => routers.includes(router.name))
.forEach(router => router.setSelected(true))
this.routers$
.filter(router => !routers.includes(router.name))
.forEach(router => router.setSelected(false))
}
The issue lies in the fact that the method expects a string[], and I'm unsure how to properly test this...
//initialization
component = fixture.componentInstance
//testing
component.selectedRouters = Array.of(r.name);
let evt = document.createEvent('Event');
evt.initEvent('ngModelChange');
selector.dispatchEvent(evt);
//alternative attempt
selector.dispatchEvent(new CustomEvent('ngModelChange') {
detail: ["arg1"]
})
The problem arises as the argument being passed is an event type instead of string[], leading to errors within the code.
If anyone has insight on how to tackle this challenge or knows how to effectively test a selected value from a select element, your input would be greatly appreciated.