如何使用茉莉花测试对 mapbox 弹出窗口进行单元测试？

Question

我有一个地图框弹出窗口。我正在使用 jasmine，我想为它编写一个单元测试。

所以我有这个功能：


  selectCluster(event: MouseEvent, feature: any) {
    event.stopPropagation(); 
    this.selectedCluster = {geometry: feature.geometry, properties: feature.properties};
  }

这是模板：

 <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>

这是我的单元测试：

 fit('Should prevent popup will be closing after popup is triggered', () => {
    const ev = new Event('MouseEvent');
    spyOn(ev, 'stopPropagation');   
    expect(ev.stopPropagation).toHaveBeenCalled();
  });

但是我得到这个错误：

Expected spy stopPropagation to have been called.

那么我必须改变什么？

谢谢

Answer 1

我认为你不应该那样测试。

 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')
  });

要测试 stopPropagation，您应该更关注被它停止的事件。如果您的测试检查事件没有发生，您可以确定 event.stopPropagation(); 正在代码中执行它的操作。

如何使用茉莉花测试对 mapbox 弹出窗口进行单元测试？

How to unit test a mapbox popup with jasmine testing?

javascript

typescript

karma-jasmine

mapbox-gl-js

angular