单元测试 – 使用Jasmine进行Angular2测试,mouseenter / mouseleave-test

@Directive({
  SELEctor: '[myHighlight]',host: {
    '(mouseenter)': 'onMouseEnter()','(mouSELEavE)': 'onMouSELEave()'
  }
})
export class HighlightDirective {
  private _defaultColor = 'Gainsboro';
  private el: HTMLElement;

  constructor(el: ElementRef) { this.el = el.nativeElement; }

  @Input('myHighlight') highLightcolor: String;

  onMouseEnter() { this.highlight(this.highLightcolor || this._defaultColor); }
  onMouSELEave() { this.highlight(null); }

  private highlight(color:string) {
    this.el.style.BACkgroundColor = color;
  }

}

现在我想测试,如果在事件上调用(右)方法.所以像这样：

it('check if item will be highlighted',inject( [TESTComponentBuilder],(_tcb: TESTComponentBuilder) => {
    return _tcb
      .createAsync(TestHighlight)
      .then( (fixturE) => {
        fixture.detectChanges();
        let element = fixture.nativeElement;
        let component = fixture.componenTinstance;
        spyOn(component,'onMouseEnter');
        let div = element.querySELEctor('div');


        div.mouseenter();


        expect(component.onMouseEnter).toHaveBeenCalled();
      });
  }));

使用TESTClass：

@Component({
  template: `<div myHighlight (mouseenter)='onMouseEnter()' (mouSELEavE)='onMouSELEave()'></div>`,directives: [HighlightDirective]
})
class TestHighlight {
  onMouseEnter() {
  }
  onMouSELEave() {
  }
}

现在,我收到了消息：

那么,有谁知道,哪个是正确的功能(如果存在)？我已经尝试过使用click()..

谢谢！