Trouble translating Drag and Drop examples

,
1

Hello,

I was trying to translate the drag and drop example shown here, into ReScript.

I am currently stuck at the drop_handler function. I’ve translated it to:

  let dropHandler = event => {
    event->ReactEvent.Mouse.preventDefault
    let dataTransfer = Webapi.Dom.DataTransfer.make()
    let data= dataTransfer->Webapi.Dom.DataTransfer.getData("text/plain")
    event
    ->ReactEvent.Mouse.target
    ->Webapi.Dom.EventTarget.unsafeAsElement
    ->Webapi.Dom.Element.appendChild(
      ~child=Webapi.Dom.document->Webapi.Dom.Document.getElementById(data)->Js.Option.getExn,
    )
  }

And the compiler complains about the expression event->ReactEvent.Mouse.target:

This has type: {..}
Somewhere wanted:
  Dom.eventTarget (defined as Dom.eventTarget_like<Dom._baseClass>)

I check the source code for ReactEvent.res and it says it should return a Dom.eventTarget but I end up with a {…}. How do I coerce/cast it to a Dom.eventTarget?

@get external target: Type.t => {..} = "target" /* Should return Dom.eventTarget */

Also any general feedback on the verbose code I am writing is welcome :slight_smile:

2

Possibly relevant More type-safe way to call a method on event target? - #5 by Lomand