mirror of https://github.com/sveltejs/svelte
clean up event handlers on re-mount (#4493)
parent
7d1e4e82ff
commit
b4b57c39a2
@ -0,0 +1,42 @@
|
|||||||
|
export default {
|
||||||
|
async test({ assert, component, target, window }) {
|
||||||
|
// set first
|
||||||
|
await component.lists.update(() => [
|
||||||
|
{ text: "item1" },
|
||||||
|
{ text: "item2" },
|
||||||
|
{ text: "item3" }
|
||||||
|
]);
|
||||||
|
|
||||||
|
await component.lists.update(() => [
|
||||||
|
{ text: "item3" },
|
||||||
|
{ text: "item2" },
|
||||||
|
{ text: "item1" }
|
||||||
|
]);
|
||||||
|
|
||||||
|
await component.lists.update(() => [
|
||||||
|
{ text: "item1" },
|
||||||
|
{ text: "item2" },
|
||||||
|
{ text: "item3" }
|
||||||
|
]);
|
||||||
|
|
||||||
|
assert.equal(component.updated, 4);
|
||||||
|
|
||||||
|
const [item1, item2] = target.childNodes;
|
||||||
|
const [item1Btn1, item1Btn2] = item1.querySelectorAll('button');
|
||||||
|
const [item2Btn1, item2Btn2] = item2.querySelectorAll('button');
|
||||||
|
|
||||||
|
const clickEvent = new window.MouseEvent('click');
|
||||||
|
|
||||||
|
await item1Btn1.dispatchEvent(clickEvent);
|
||||||
|
assert.equal(component.getNormalCount(), 1);
|
||||||
|
|
||||||
|
await item1Btn2.dispatchEvent(clickEvent);
|
||||||
|
assert.equal(component.getModifierCount(), 1);
|
||||||
|
|
||||||
|
await item2Btn1.dispatchEvent(clickEvent);
|
||||||
|
assert.equal(component.getNormalCount(), 2);
|
||||||
|
|
||||||
|
await item2Btn2.dispatchEvent(clickEvent);
|
||||||
|
assert.equal(component.getModifierCount(), 2);
|
||||||
|
}
|
||||||
|
};
|
@ -0,0 +1,37 @@
|
|||||||
|
<script>
|
||||||
|
import {afterUpdate} from 'svelte'
|
||||||
|
import {writable} from 'svelte/store'
|
||||||
|
|
||||||
|
const normal = writable(0);
|
||||||
|
const modifier = writable(0);
|
||||||
|
export let updated = 0;
|
||||||
|
export const lists = writable([]);
|
||||||
|
|
||||||
|
const click = (e, type) => {
|
||||||
|
if(type === 'normal'){
|
||||||
|
$normal ++;
|
||||||
|
}else{
|
||||||
|
$modifier ++;
|
||||||
|
}
|
||||||
|
}
|
||||||
|
afterUpdate(() => updated++);
|
||||||
|
|
||||||
|
export function getNormalCount() {
|
||||||
|
return $normal;
|
||||||
|
}
|
||||||
|
export function getModifierCount() {
|
||||||
|
return $modifier;
|
||||||
|
}
|
||||||
|
</script>
|
||||||
|
|
||||||
|
{#each $lists as item (item.text)}
|
||||||
|
<div>
|
||||||
|
{item.text}
|
||||||
|
<button on:click={(e)=>click(e,'normal')}>
|
||||||
|
Normal
|
||||||
|
</button>
|
||||||
|
<button on:click|preventDefault={(e)=> click(e,'modifier')}>
|
||||||
|
Modifier
|
||||||
|
</button>
|
||||||
|
</div>
|
||||||
|
{/each}
|
Loading…
Reference in new issue