Testing hammerjs events with angular2

Question

I'm building a testing suite and try to cover 100% of the code. Thing is, I have callback functions on panning. Does anyone how to correctly test hammerjs events with karma & jasmine on angular2 ?

HTML

<div (pan)="panning($event)" id="square">

TypeScript

public swiper($event) {
  let e = $event;
  let top = e.center.x - (e.target.clientHeight/2);
  let left = e.center.y - (e.target.clientWidth/2);
  e.target.style.transform = 'translate3d('+ top +'px, '+ left +'px, 0px)';
}

Thank you.

M

Answer 1

You should be able to use this:

it('should call panning on pan', (async() => {
    fixture.debugElement.query(By.css('#square')).triggerEventHandler("pan", myNiceEvent)
    fixture.detectChanges()
    fixture.whenStable().then(testMyChanges)
}

I know it's been a long time, but I've struggled with that for Angular v5.2.0 myself.

Hoping this will help someone ;)