ジャスミンテストからドキュメントレベルのイベントをトリガする方法角度2/4

Question

角度検査のドキュメントによれば、テストからイベントをトリガするために、デバッグ要素でtriggerEventHandler()メソッドを使用します。このメソッドにはevent nameとobjectが使用されます。これは、HostListenerを使用してイベントを追加する場合に機能します。例：@HostListener('mousemove', ['$event'])またはdocumentレベルイベントを追加する場合は、@HostListener('document:mousemove', ['$event'])のようにします。

私の現在のディレクティブの実装では、HostListenersをネストできないため、レベルのイベントをdocument.addEventListenerのHostListenerを使って追加します。

@HostListener('mousedown', ['$event']) 
callMouseDown(event){ 
    if (something) { 
    document.addEventListener('mousemove', this.callMouseMove.bind(this)); 
    } 
} 

callMouseMove(event){ 
// do some computations. 
} 

は今、私は私のテストからdocumentレベルで追加されたmousemoveイベントをトリガします：次のように
コードです。 triggerEventHandler()の現在の実装は機能しません。つまり、リスナーはテストで起動されません。

これを動作させるにはどうすればよいですか？誰も助けを借りて助けてくれますか？

編集：追加のテスト：

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}); 
    triggerEventHandler("document:mousemove", {pageX: 250, pageY: 320}); 
    // the above statement won't work. 
    expect(arr).toEqual({x:50, y: 20}); 
})); 

Answer 1

あなたは、角度レポ上の問題hereとして記録されて説明した同様の問題のように思えます。

コンポーネントインスタンスを使用してディレクティブにアクセスし、メソッドにアクセスできます（callMouseMoveの場合）。 次のように動作するはずです：

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

・ホープ、このことができます。

更新

私はあなたのディレクティブ内部のプライベートメソッドを持っている場合、私の方法が機能しないことに気づきました。カスタムイベントまたはこの場合はマウスイベントをプログラムで作成し、イベントをドキュメントレベルまたは要素自体のいずれかでトリガする方がよいでしょう。この方法はyurzuiによって言及されました。彼に感謝します。ここで

は、あなたがそれを行うことができます方法は次のとおりです。

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

あなたのようにあなたのスペックからこの関数を呼び出すことができます。

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

私はこのケースでは、ここでpageXまたはpageYを渡していないです、という注意、それらはreadonlyですが、clientXとclientYの値に基づいて内部的に計算されます。

カスタムイベントを作成し、以下のように、あなたが行うことができます好きな値を渡したい場合は、次のように

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

はそれを起動します。このことができます

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

希望を。