Getting height when event is trigged with lit-element

Question

How I can get height of element when an event is trigged?

I would like to get height of an editable div but EventTarget has not properties .

import { LitElement, html, customElement } from 'lit-element';

@customElement('my-example')
export class Example extends LitElement {
  render() {
    return html`
      <div
        @keyup="${(e: KeyboardEvent) => console.log(e.target?.offsetHeight)}"
        contenteditable="true"
      ></div>
    `;
  }
}

Error:

Property 'offsetHeight' does not exist on type 'EventTarget'.

Answer 1

Could it be that <div> cannot itself take focus? I unearthed this comment: "Focus is not available to a div in most browsers, IE being an exception. You can still trap the onkey events through the body or form elements, which do support focus." ( https://www.sitepoint.com/community/t/onkeyup-on-div/2133/2 )

I wrote an example here: https://webcomponents.dev/edit/8LCH2QRq8vXSUqs2y8Vy

I could not get a focus until I put an <input> inside the <div> .