I have a mapbox popup. I am using jasmine and I want to write a unit test for it.
So I have this function:
JavaScript
x
6
1
selectCluster(event: MouseEvent, feature: any) {
2
event.stopPropagation();
3
this.selectedCluster = {geometry: feature.geometry, properties: feature.properties};
4
}
5
6
and this is the template:
JavaScript
1
7
1
<ng-template mglClusterPoint let-feature>
2
<div class="marker-cluster" (click)="selectCluster($event, feature)">
3
<fa-icon [icon]="faVideo" [styles]="{'stroke': 'black', 'color': 'black'}" size="lg" class="pr-2"></fa-icon>
4
<fa-icon [icon]="faWifi" [styles]="{'stroke': 'black', 'color': 'black'}" size="lg" class="pr-2"></fa-icon>
5
</div>
6
</ng-template>
7
and this is my unit test:
JavaScript
1
6
1
fit('Should prevent popup will be closing after popup is triggered', () => {
2
const ev = new Event('MouseEvent');
3
spyOn(ev, 'stopPropagation');
4
expect(ev.stopPropagation).toHaveBeenCalled();
5
});
6
But I get this error:
JavaScript
1
2
1
Expected spy stopPropagation to have been called.
2
So what I have to change?
Thank you
Advertisement
Answer
I dont think you should be testing like that.
JavaScript
1
8
1
it('Should set selectedCluster when clicked', () => {
2
spyOn(component,'selectCluster').and.callThrough();
3
fixture.debugElement.query(By.css('.marker-cluster')).nativeElement.click();
4
fixture.detectChanges();
5
expect(component.selectCluster).toHaveBeenCalled();
6
expect(component.selectedCluster).toBe('whatever you are expecting')
7
});
8
To test stopPropagation
, you should rather focus on the event which is being stopped by it. If your test checks that the event is not happening, you can be sure that event.stopPropagation();
is doing its thing in the code.