Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Feature Request: Allow nullish values to omit event handlers #7568

Closed
brandonmcconnell opened this issue May 19, 2022 · 6 comments · Fixed by #7863
Closed

Feature Request: Allow nullish values to omit event handlers #7568

brandonmcconnell opened this issue May 19, 2022 · 6 comments · Fixed by #7863

Comments

@brandonmcconnell
Copy link
Contributor

brandonmcconnell commented May 19, 2022

Describe the problem

Most props can be excluded in this sort of fashion:

<MyComponent
  prop={condition ? someValue : undefined}
/>

However, this does not work for event handlers (at least in TS setups) due to the expected TypeScript type (e: MouseEvent) => any.

Describe the proposed solution

I propose setting up event handlers in such a way that they support the types null | undefined as well as (e: MouseEvent) => any and that in the case of null | undefined, the handler be excluded from the element/component instance.

Alternatives considered

Currently, to work around this, I am using an "empty" function with nullish coalescing. This won't kill site performance by any means, but firing a pointless function like this is not the ideal workaround.

Here is an example of my current setup:

<MyComponent
  prop={condition ? someValue : undefined}
  on:click={clickFunction ?? (() => {})}
/>

Importance

would make my life easier

@brandonmcconnell brandonmcconnell changed the title Allow nullish values to omit event handlers Feature Request: Allow nullish values to omit event handlers May 19, 2022
@Conduitry
Copy link
Member

@dummdidumm I think this would be a language-tools thing? Is that correct? The compiler itself already allows nullish values for event handlers, and treats them as not attaching a handler.

@dummdidumm
Copy link
Member

Yes this needs a adjustment in language tools. This is already allowed for Dom events but not component events

@dummdidumm dummdidumm transferred this issue from sveltejs/svelte May 19, 2022
@dummdidumm dummdidumm added the bug label May 19, 2022
@brandonmcconnell
Copy link
Contributor Author

Thanks, @Conduitry and @dummdidumm!

@dummdidumm
Copy link
Member

@Conduitry was about to implement this and tested it out in the REPL one more time, and noticed that this isn't implemented for component events. If I do <Component on:click={null} />, an error is thrown every time I fire the click event. The "handles null/undefined" behavior seems to be implements for DOM events only.

@Conduitry
Copy link
Member

This should be supported now as of 3.51.0.

@maxlath
Copy link
Contributor

maxlath commented May 23, 2023

Is there a way to re-enable the strict mode? ^^'

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging a pull request may close this issue.

4 participants