Feature request: event handlers with only modifiers, e.g. on:click|stopPropagation

stopPropagation can be useful on its own, as a way of catching "cancel when user clicks away" functionality and preventing it from being triggered by clicks that originate within the focused thing itself.

It would be nice to be able to use the event modifier without having to supply a "noop" handler, e.g.

<div on:click|stopPropagation>
    ...
</div>

[Conduitry]

I think this would be confusing. An event directive with no handler and no modifiers means an event that's forwarded to the parent component. This would make adding modifiers to it do something completely different.

Ah yeah, forgot about that feature. Doesn't seem worth it in that case.

[Rich-Harris]

I have wanted this myself in the past. What if we had something like this?

<div on:click|stopPropagation={}>
  ...
</div>

It's not not confusing, but it is arguably nicer than on:click={e => e.stopPropagation()}

[Conduitry]

I was also thinking about something like that. Do we want the ={} to be equivalent to some other thing in general, like ={null} or ={undefined}? Do we want event handlers in general to check (at compile time? at run time?) whether they're truthy before running? (Semi-related: #3040.) I can see the desire to stop the addition of this feature from getting out of hand, but I also think it would be weird to have a one-off, special ={} syntax just for event handlers.

[Rich-Harris]

Yeah, it's definitely a straw man. I'll reopen this anyway, in case we think of something better

[antony]

Going to vote against this mostly, since on:click={e => e.stopPropagation()} isn't that difficult, and we have other stuff to fix.

If it did get turned into a feature, I'd suggest on:click|stopPropagation not ={}.