justinfagnani / codemirror-elements

A set of CodeMirror custom HTML elements
MIT License
38 stars 2 forks source link

[Bug] "codemirror-document-change" event appears to return previous value on target when called #3

Open jovanzlatanovic opened 4 months ago

jovanzlatanovic commented 4 months ago

Hi, just wanted to say right off the bat this is a wonderful package!

I did notice one minor issue when trying to get changes from the tag in Lit.

My setup is as follows:

  private async updateCode(event: DocumentChangeEvent) {
    let target = event.target;
    console.log(target.value)
  }

  render() {
    return html`
      <cm-editor @codemirror-document-change="${this.updateCode}"></cm-editor>
    `;
  }

The "codemirror-document-change" does get hit on every time I type in the text area, but the event.target.value returned is always the previous value of the text editor.

I've managed to resolve this by calling queueMicrotask():

  private async updateCode(event: DocumentChangeEvent) {
    let target = event.target;
    queueMicrotask(() => console.log(target.value))
  }

  render() {
    return html`
      <cm-editor @codemirror-document-change="${this.updateCode}"></cm-editor>
    `;
  }

Unsure if this is a bug on my end, but it appears that the event.target.value is the previous value in that specific instance once the event is hit.