Svelte 5: mixing and matching old and new events is buggy

[Rich-Harris]

Describe the bug

If you have both onclick and on:click in the same component...

<script>
  let count = $state(0);

  function increment() {
    count += 1;
  }
</script>

<button onclick={increment}>
  clicks: {count}
</button>

<button on:click={increment}>
  clicks: {count}
</button>

...the generated code is buggy — the handler is incorrectly hoisted, and count is undefined for the second handler.

Reproduction

https://svelte-5-preview.vercel.app/#H4sIAAAAAAAAE5WPwQrCMBBEfyUEDy0K6jW2gt9hPNR0C8F2E5KNICH_bpKCgjePM7Nvlol80jN4Lq6R47AAF_xiLd9xetki_BNmgqy9CU4Vp_PKaUtniZJmIKZMQGI923gaCJpDe8pJzqaAirRBplE5WACpaVksiaSV2fbsWI4pSez231rs7oEokwbVrNWjj5-KVN9W1wsWa0-lV-KHFv_ieediRj1pGLkgFyDd0hvqXqI4IgEAAA==

Logs

No response

System Info

next

Severity

annoyance

[dummdidumm]

Should we do the same we do when mixing slots and render tags and error (but only on element handlers, components might not be under the author's control)

[Rich-Harris]

That seems reasonable, yeah