Javascript 测试typescript装饰程序

我有一个简单的修饰符，可以在满足某些条件时触发stopPropagation（）或preventDefault（）。我已经在我的应用程序中对此进行了测试，我确信装饰程序工作正常。但是，我无法测试decorator，是否触发了上述方法

在执行测试时，我得到以下错误：

 Error: Expected spy stopPropagation to have been called.

core.decorators.ts

export function eventModifier( stopPropagation = false, preventDefault?: boolean ) {
  return function (target: any, propertyKey: string, descriptor: PropertyDescriptor) {
    const originalMethod = descriptor.value;
    descriptor.value = function() {
      const context = this;
      const mouseEvent: MouseEvent = Array.from( arguments ).find( event => event instanceof MouseEvent );

      if ( stopPropagation ) {
        mouseEvent.stopPropagation();
      }

      if ( preventDefault ) {
        mouseEvent.preventDefault();
      }

      originalMethod.apply( context, arguments );
    };

    return descriptor;
  };
}

import { eventModifier } from './core.decorators';

describe('eventModifier decorator', () => {

  class TestClass {

    @eventModifier( true )
    public click( event: MouseEvent ): void {
    }

  }

  it('decorator is defined', function() {
    expect( eventModifier ).toBeDefined();
  });

  it('stopPropagation() should be called', function() {
    const testClass = new TestClass();
    const ev = new MouseEvent('click')

    spyOn( testClass, 'click' );
    spyOn( ev, 'stopPropagation' );

    testClass.click( <MouseEvent> ev );

    expect( testClass.click ).toHaveBeenCalledWith( ev );
    expect( ev.stopPropagation ).toHaveBeenCalled();
  });

});

core.decorators.spec.ts

export function eventModifier( stopPropagation = false, preventDefault?: boolean ) {
  return function (target: any, propertyKey: string, descriptor: PropertyDescriptor) {
    const originalMethod = descriptor.value;
    descriptor.value = function() {
      const context = this;
      const mouseEvent: MouseEvent = Array.from( arguments ).find( event => event instanceof MouseEvent );

      if ( stopPropagation ) {
        mouseEvent.stopPropagation();
      }

      if ( preventDefault ) {
        mouseEvent.preventDefault();
      }

      originalMethod.apply( context, arguments );
    };

    return descriptor;
  };
}

import { eventModifier } from './core.decorators';

describe('eventModifier decorator', () => {

  class TestClass {

    @eventModifier( true )
    public click( event: MouseEvent ): void {
    }

  }

  it('decorator is defined', function() {
    expect( eventModifier ).toBeDefined();
  });

  it('stopPropagation() should be called', function() {
    const testClass = new TestClass();
    const ev = new MouseEvent('click')

    spyOn( testClass, 'click' );
    spyOn( ev, 'stopPropagation' );

    testClass.click( <MouseEvent> ev );

    expect( testClass.click ).toHaveBeenCalledWith( ev );
    expect( ev.stopPropagation ).toHaveBeenCalled();
  });

});

从“/core.decorators”导入{eventModifier}；
描述（'eventModifier decorator'，（）=>{
类TestClass{
@eventModifier（真）
公共单击（事件：MouseEvent）：无效{
}
}
它（'定义了decorator'，函数（）{
expect（eventModifier）.tobededefined（）；
});
它（'stopPropagation（）应该被调用，'函数（）{
const testClass=新的testClass（）；
const ev=新建鼠标事件（'单击'）
spyOn（testClass，'click'）；
间谍（ev，“停止传播”）；
单击（ev）；
期望（testClass.click）.已与（ev）一起调用；
期望（ev.stopPropagation）.tohavebeincalled（）；
});
});

经过几天的失败和考验，我终于明白了。在testClass.click方法上设置spy时，似乎忘记了什么

以下是工作单元测试：

 import { eventModifier } from './core.decorators';

describe('eventModifier decorator', () => {

  class TestClass {

    @eventModifier( true )
    public click( event: MouseEvent ): void {
    }

  }

  it('decorator is defined', function() {
    expect( eventModifier ).toBeDefined();
  });

  it('stopPropagation() should be called', function() {
    const testClass = new TestClass();
    const ev = new MouseEvent('click')

    spyOn( testClass, 'click' ).and.callThrough();
    spyOn( ev, 'stopPropagation' );

    testClass.click( <MouseEvent> ev );

    expect( testClass.click ).toHaveBeenCalledWith( ev );
    expect( ev.stopPropagation ).toHaveBeenCalled();
  });

});

从“/core.decorators”导入{eventModifier}；
描述（'eventModifier decorator'，（）=>{
类TestClass{
@eventModifier（真）
公共单击（事件：MouseEvent）：无效{
}
}
它（'定义了decorator'，函数（）{
expect（eventModifier）.tobededefined（）；
});
它（'stopPropagation（）应该被调用，'函数（）{
const testClass=新的testClass（）；
const ev=新建鼠标事件（'单击'）
spyOn（testClass，'click'）。和.callThrough（）；
间谍（ev，“停止传播”）；
单击（ev）；
期望（testClass.click）.已与（ev）一起调用；
期望（ev.stopPropagation）.tohavebeincalled（）；
});
});

经过几天的失败和考验，我终于明白了。在testClass.click方法上设置spy时，似乎忘记了什么

以下是工作单元测试：

 import { eventModifier } from './core.decorators';

describe('eventModifier decorator', () => {

  class TestClass {

    @eventModifier( true )
    public click( event: MouseEvent ): void {
    }

  }

  it('decorator is defined', function() {
    expect( eventModifier ).toBeDefined();
  });

  it('stopPropagation() should be called', function() {
    const testClass = new TestClass();
    const ev = new MouseEvent('click')

    spyOn( testClass, 'click' ).and.callThrough();
    spyOn( ev, 'stopPropagation' );

    testClass.click( <MouseEvent> ev );

    expect( testClass.click ).toHaveBeenCalledWith( ev );
    expect( ev.stopPropagation ).toHaveBeenCalled();
  });

});

从“/core.decorators”导入{eventModifier}；
描述（'eventModifier decorator'，（）=>{
类TestClass{
@eventModifier（真）
公共单击（事件：MouseEvent）：无效{
}
}
它（'定义了decorator'，函数（）{
expect（eventModifier）.tobededefined（）；
});
它（'stopPropagation（）应该被调用，'函数（）{
const testClass=新的testClass（）；
const ev=新建鼠标事件（'单击'）
spyOn（testClass，'click'）。和.callThrough（）；
间谍（ev，“停止传播”）；
单击（ev）；
期望（testClass.click）.已与（ev）一起调用；
期望（ev.stopPropagation）.tohavebeincalled（）；
});
});