title: What are the object types of the mouse events in Javascript/Angular 6
body: <p>I want to create a simple object info tooltip when the user hovers for a few milliseconds on some divs. So, I'm doing a couple of tests to try the mouse event handling in Angular 6. This is what I've got so far in the Angular component:</p>
  
  <p>HTML template:</p>
  
  <pre><code>&lt;div (mouseenter)="showObjectInfo($event)"
    (mouseleave)="clearObjectInfo($event)" [attr.data-item]="item.id"&gt;
  </code></pre>
  
  <p>Component TS:</p>
  
  <pre><code>showObjectInfo(e : any) {
    console.log('&lt;&lt;&lt; ENTER DIV');
    this.infoTooltipTimer = setTimeout(() =&gt; {
      console.log('TOOLTIP FOR ', e, e.target.getAttribute('data-item'), typeof e);
    }, 1400);
  }
  
  clearObjectInfo(e : any) {
    console.log('&gt;&gt;&gt; LEAVE');
  
    if(this.infoTooltipTimer) {
      clearTimeout(this.infoTooltipTimer);
  
      this.infoTooltipTimer = undefined;
    }
  }
  </code></pre>
  
  <p>So far, it works fine. But I've come across a doubt. I'd like to give the event its correct type (as you can see, right now it's 'any'). I've searched in the W3Schools website and I found that the event type should be 'MouseEvent', like you can see in the following picture:</p>
  
  <p><a href="https://i.stack.imgur.com/LkXfS.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/LkXfS.png" alt="enter image description here"></a></p>
  
  <p>However, if I declare the event as <code>e : MouseEvent</code>, Typescript complains that 'Property getAttribute does not exist on type EventTarget', in the <code>showObjectInfo</code> function.</p>
  
  <p>What is the right object type? Thanks!</p>