I have a mapbox popup. I am using jasmine and I want to write a unit test for it.
So I have this function:
selectCluster(event: MouseEvent, feature: any) { event.stopPropagation(); this.selectedCluster = {geometry: feature.geometry, properties: feature.properties}; }
and this is the template:
<ng-template mglClusterPoint let-feature> <div class="marker-cluster" (click)="selectCluster($event, feature)"> <fa-icon [icon]="faVideo" [styles]="{'stroke': 'black', 'color': 'black'}" size="lg" class="pr-2"></fa-icon> <fa-icon [icon]="faWifi" [styles]="{'stroke': 'black', 'color': 'black'}" size="lg" class="pr-2"></fa-icon> </div> </ng-template>
and this is my unit test:
fit('Should prevent popup will be closing after popup is triggered', () => { const ev = new Event('MouseEvent'); spyOn(ev, 'stopPropagation'); expect(ev.stopPropagation).toHaveBeenCalled(); });
But I get this error:
Expected spy stopPropagation to have been called.
So what I have to change?
Thank you
Advertisement
Answer
I dont think you should be testing like that.
it('Should set selectedCluster when clicked', () => { spyOn(component,'selectCluster').and.callThrough(); fixture.debugElement.query(By.css('.marker-cluster')).nativeElement.click(); fixture.detectChanges(); expect(component.selectCluster).toHaveBeenCalled(); expect(component.selectedCluster).toBe('whatever you are expecting') });
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.