如何监视自定义事件传单中的方法

Question

我需要测试使用特定参数（在本例中为 18）调用的第三方函数 (map.setZoom)

createMap() {
    const map = this.variable;
    map.locate({setView: true, enableHighAccuracy: true});
    map.on('locationfound', (e) => {
        map.setZoom(18);
    });
  }

我的规格是这样的：

let component: Component;
let fixture: ComponentFixture<Component>;

beforeEach(async(() => {
        TestBed.configureTestingModule({
            // declarations, imports, etc..
        }).compileComponents();
}));

beforeEach(() => {
        fixture = TestBed.createComponent(Component);
        component = fixture.componentInstance;
});

it('should verify map was created with zoom 18', () => {
        spyOn(component.variable, 'setZoom').and.callThrough();
        component.createMap();
        $(component.variable).trigger('on');
        expect(component.variable.setZoom).toHaveBeenCalledWith(18);
});

但我得到了这个：

问题是我要测试的函数在 jquery 触发的自定义事件中，我不知道我是否正确触发了它

Answer 1

作为@Taplar suggested, I needed to trigger using 'locationfound' not 'on'. Also, talking to the frontend guy I realised that the on() method in this case actually is from leaflet not from jquery. Leaflet triggers events using fire()方法。因此，最终规格为：

it('should verify map was created with zoom 18', () => {
        spyOn(component.variable, 'setZoom').and.callThrough();
        component.createMap();
        component.variable.fire('locationfound');
        expect(component.variable.setZoom).toHaveBeenCalledWith(18);
});

如何监视自定义事件传单中的方法

how to spy on method inside custom event leaflet

jquery

jasmine

leaflet

angular7