How to trigger document level events from a jasmine test Angular 2/4

Seems like the similar problem which you have described is logged as the issue here on angular repo.

You can get the access of the directive with the component instance and can access the method (i.e., in your case it's the callMouseMove). The following way should work:

it('test spec', inject([MyService], (service: MyService) => {
   x = [];
  //service calls the method
  service.evtEmit.subscribe(e => {
   x.push(e);
  });
  triggerEventHandler("mousedown", {pageX: 200, pageY: 300});
  component.directive.callMouseMove({pageX: 250, pageY: 320});
  expect(arr).toEqual({x:50, y: 20});
}));

Hope this helps.

Update

I realized that my way doesn't work if you have private methods inside your directive. It is better to create custom events or in this case a mouse event programmatically and trigger the events either at document level or on the element itself. This method was mentioned by yurzui. Thanks to him.

Here's how you can do it:

function programmaticTrigger(eventType: string, evtObj: any) {
   let evt = new MouseEvent(eventType, evtObj);
   document.dispatchEvent(evt);
}

You can call this function from your spec as:

programmaticTrigger("mousemove", {clientX: 250, clientY: 320});

Note that, I am not passing pageX or pageY here in this case, because they are readonly but they are computed internally based on the clientX and clientY values.

If you want to create a custom event and pass in whatever values you want, you can do as follows:

function programmaticTrigger(eventType: string, evtObj: any) {
       let evt: any;
       evt = Event(eventType, evtObj);
       document.dispatchEvent(evt);
    }

Invoke it as follows:

programmaticTrigger("mousemove", {pageX: 250, pageY: 320});

Hope this helps.