Skip to content

Commit

Permalink
fix: mark subtree dynamic for bind with sequence expressions (#14626)
Browse files Browse the repository at this point in the history
  • Loading branch information
paoloricciuti authored Dec 9, 2024
1 parent c1c59e7 commit c66bf17
Show file tree
Hide file tree
Showing 4 changed files with 27 additions and 4 deletions.
5 changes: 5 additions & 0 deletions .changeset/green-pandas-study.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,5 @@
---
'svelte': patch
---

fix: mark subtree dynamic for bind with sequence expressions
Original file line number Diff line number Diff line change
Expand Up @@ -11,6 +11,7 @@ import * as w from '../../../warnings.js';
import { binding_properties } from '../../bindings.js';
import fuzzymatch from '../../1-parse/utils/fuzzymatch.js';
import { is_content_editable_binding, is_svg } from '../../../../utils.js';
import { mark_subtree_dynamic } from './shared/fragment.js';

/**
* @param {AST.BindDirective} node
Expand Down Expand Up @@ -141,6 +142,8 @@ export function BindDirective(node, context) {
e.bind_invalid_expression(node);
}

mark_subtree_dynamic(context.path);

return;
}

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -4,17 +4,23 @@ import { assert_ok } from '../../../suite';

export default test({
async test({ assert, target, logs }) {
const input = target.querySelector('input');

assert_ok(input);
const [input, checkbox] = target.querySelectorAll('input');

input.value = '2';
input.dispatchEvent(new window.Event('input'));

flushSync();

assert.htmlEqual(target.innerHTML, `<button>a: 2</button><input type="value">`);
assert.htmlEqual(
target.innerHTML,
`<button>a: 2</button><input type="value"><div><input type="checkbox" ></div>`
);

assert.deepEqual(logs, ['b', '2', 'a', '2']);

flushSync(() => {
checkbox.click();
});
assert.deepEqual(logs, ['b', '2', 'a', '2', 'check', false]);
}
});
Original file line number Diff line number Diff line change
Expand Up @@ -2,6 +2,7 @@
import Child from './Child.svelte';
let a = $state(0);
let check = $state(true);
</script>

<button onclick={() => a++}>a: {a}</button>
Expand All @@ -14,3 +15,11 @@
}}
/>

<div>
<input type="checkbox"
bind:checked={()=>check,
(v)=>{
console.log('check', v);
check = v;
}} />
</div>

0 comments on commit c66bf17

Please sign in to comment.