mirror of https://github.com/sveltejs/svelte
fix: run event attributes after binding event listeners (#11230)
* fix: run event attributes after binding event listeners By running the event listener logic inside an effect on the first run we guarantee that they're attached after binding listeners. Fixes #11138. * give arrow functions stable id, better code gen * optimise normal function expressions too (rare but valid!) --------- Co-authored-by: Rich Harris <rich.harris@vercel.com>pull/11255/head
parent
68a12f0a09
commit
7edba25581
@ -0,0 +1,5 @@
|
||||
---
|
||||
"svelte": patch
|
||||
---
|
||||
|
||||
fix: make sure event attributes run after bindings
|
@ -0,0 +1,21 @@
|
||||
import { test } from '../../test';
|
||||
|
||||
export default test({
|
||||
async test({ assert, target }) {
|
||||
const [i1, i2] = target.querySelectorAll('input');
|
||||
|
||||
i1?.click();
|
||||
await Promise.resolve();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
'true true <input type="checkbox"> false false <input type="checkbox">'
|
||||
);
|
||||
|
||||
i2?.click();
|
||||
await Promise.resolve();
|
||||
assert.htmlEqual(
|
||||
target.innerHTML,
|
||||
'true true <input type="checkbox"> true true <input type="checkbox">'
|
||||
);
|
||||
}
|
||||
});
|
@ -0,0 +1,15 @@
|
||||
<script>
|
||||
let checked_simple = $state(false);
|
||||
let checked_simple_copy = $state(false);
|
||||
|
||||
let checked_rest = $state(false);
|
||||
let checked_rest_copy = $state(false);
|
||||
let rest = $state(() => ({}));
|
||||
</script>
|
||||
|
||||
{checked_simple} {checked_simple_copy}
|
||||
<input type="checkbox" onchange={() => {checked_simple_copy = checked_simple}} bind:checked={checked_simple} />
|
||||
|
||||
{checked_rest} {checked_rest_copy}
|
||||
<!-- {...rest()} in order to force an isolated render effect -->
|
||||
<input type="checkbox" onchange={() => {checked_rest_copy = checked_rest}} {...rest()} bind:checked={checked_rest} />
|
Loading…
Reference in new issue