SolidJS•11mo ago

Can on__ handler be async?

Seems that having async handlers works fine,

const button = <button onClick={doSomethingAsync}>Click me</button>

const button = <button onClick={doSomethingAsync}>Click me</button>

although the particular ESLint config I'm working with doesn't like it,

Promise-returning function provided to attribute where a void return was expected. (eslint@typescript-eslint/no-misused-promises)

Promise-returning function provided to attribute where a void return was expected. (eslint@typescript-eslint/no-misused-promises)

Are async handlers supported? If so, do Solid's types need to be updated?

7 Replies

aryzingOP•11mo ago

Possibly updated the following?

  interface EventHandler<T, E extends Event> {
    (
      e: E & {
        currentTarget: T;
        target: DOMElement;
      }
-   ): void;
+   ): Promise<void> | void
  }

  interface EventHandler<T, E extends Event> {
    (
      e: E & {
        currentTarget: T;
        target: DOMElement;
      }
-   ): void;
+   ): Promise<void> | void
  }

thetarnav•11mo ago

you can use promises and solid types do not need to be updated because void already means that it doesn’t care about what you return this seems like an issue with your eslint rule, not typescript

aryzingOP•11mo ago

Thanks for clarifying. Does void really mean that it doesn't care about the return value? Isn't it more like it doesn't expect a return value?

thetarnav•11mo ago

yeah you can theoretically return anything and typescript won't complain (which is why an eslint rule might be useful to catch that, as it is weird do do that) but ts won't let you use the value returned by that function its a weird design but it means that any function will extend a (...a: any[]) => void type

aryzingOP•11mo ago

Got it, thanks!

Alex Lohr•11mo ago

If the async thing you do is a request, it might be better to just use a signal's setter as event handler and use a derived version of the getter as source for a resource.

deluksic•11mo ago

We recently enabled no-misused-promises and a few more rules around promises to catch places where we did not .catch (pun intended). It is a very good thing that solidjs has void here, otherwise this rule would not work properly! Solidjs does NOT catch for you, you should do it yourself!

Gaming

Programming

Can on__ handler be async?