Accessing e.target.value on input onChange event causes Typescript Error

[Hamzali]

Describe the bug Typescript errors when using event.target.value value on input/textarea/select/etc. html elements.

To Reproduce Just open a Typescirpt solidjs project and write a input handler;

<input onChange={e => setInputName(e.target.value)} />

Expected behavior No type erros expected.

Reproduction https://playground.solidjs.com/?hash=941500074&version=1.1.6

[atk]

The event is deferred, thus the target is not necessarily the same as the item it is happening on. Try e.currentTarget.value instead.

[ryansolid]

Yeah this isn't Solid specific unless we commandeered the types in an incorrect way I think. The target could be any element that could produce that event below it in the tree, whereas the currentTarget is the element you are on. Maybe not relevant in a textarea, but in general TS can't know what the target is beyond any element that could create the event. I do wonder though for say a change or input event could we know every target would have to have a value property. Our JSX types were borrowed mostly from Preact and Inferno. Does React do something here?

Also I see an onChange. Unless you want it to trigger on blur it might not be what you are expecting. onInput is the DOM event for per character updates.

[Hamzali]

I was getting into solid and refactoring my old react application to solid. I have used the examples in the website in order to convert my app then got the erros so I wanted to ask that what am I doing wrong.

As far as I know that React uses SytheticEvent interface in order to handle the events so it might has something more then the default DOM events.

It seems using currentTarget more correct way of using the dom reference in the event.

Thanks a lot for the detailed information and solutions @ryansolid @atk.