mirror of https://github.com/sveltejs/svelte
[fix] allow invalidating variables from @const declared function (#7858)
parent
5eb1ff9946
commit
2f61907ec1
@ -0,0 +1,34 @@
|
||||
export default {
|
||||
html: `
|
||||
<div>[Y] A <button>Toggle</button></div>
|
||||
<div>[N] B <button>Toggle</button></div>
|
||||
<div>[N] C <button>Toggle</button></div>
|
||||
`,
|
||||
async test({ component, target, assert, window }) {
|
||||
const [btn1, btn2, btn3] = target.querySelectorAll('button');
|
||||
await btn1.dispatchEvent(new window.MouseEvent('click'));
|
||||
await btn2.dispatchEvent(new window.MouseEvent('click'));
|
||||
|
||||
assert.htmlEqual(target.innerHTML, `
|
||||
<div>[N] A <button>Toggle</button></div>
|
||||
<div>[Y] B <button>Toggle</button></div>
|
||||
<div>[N] C <button>Toggle</button></div>
|
||||
`);
|
||||
|
||||
await btn2.dispatchEvent(new window.MouseEvent('click'));
|
||||
|
||||
assert.htmlEqual(target.innerHTML, `
|
||||
<div>[N] A <button>Toggle</button></div>
|
||||
<div>[N] B <button>Toggle</button></div>
|
||||
<div>[N] C <button>Toggle</button></div>
|
||||
`);
|
||||
|
||||
await btn3.dispatchEvent(new window.MouseEvent('click'));
|
||||
|
||||
assert.htmlEqual(target.innerHTML, `
|
||||
<div>[N] A <button>Toggle</button></div>
|
||||
<div>[N] B <button>Toggle</button></div>
|
||||
<div>[Y] C <button>Toggle</button></div>
|
||||
`);
|
||||
}
|
||||
};
|
@ -0,0 +1,16 @@
|
||||
<script>
|
||||
let items = [
|
||||
{ name: 'A', selected: true },
|
||||
{ name: 'B', selected: false },
|
||||
{ name: 'C', selected: false },
|
||||
]
|
||||
</script>
|
||||
|
||||
{#each items as item}
|
||||
{@const toggle = () => item.selected = !item.selected}
|
||||
<div>
|
||||
{item.selected ? '[Y]' : '[N]'}
|
||||
{item.name}
|
||||
<button on:click={toggle}>Toggle</button>
|
||||
</div>
|
||||
{/each}
|
Loading…
Reference in new issue