mirror of https://github.com/sveltejs/svelte
Fixes: https://github.com/sveltejs/svelte/issues/6016 Fixes: https://github.com/sveltejs/svelte/issues/3290pull/6858/head
parent
2c8e77bf90
commit
7206a24919
@ -0,0 +1,30 @@
|
||||
<script>
|
||||
import { onMount, beforeUpdate, afterUpdate } from 'svelte';
|
||||
import order from './order.js';
|
||||
|
||||
let i;
|
||||
export let index;
|
||||
export let id;
|
||||
export let name;
|
||||
|
||||
function logRender () {
|
||||
order.push(`${index}: render`);
|
||||
return index;
|
||||
}
|
||||
|
||||
beforeUpdate(() => {
|
||||
order.push(`${index}: beforeUpdate`);
|
||||
});
|
||||
|
||||
afterUpdate(() => {
|
||||
order.push(`${index}: afterUpdate`);
|
||||
});
|
||||
|
||||
onMount(() => {
|
||||
order.push(`${index}: onMount`);
|
||||
});
|
||||
</script>
|
||||
|
||||
<li bind:this={i}>
|
||||
{logRender()}
|
||||
</li>
|
||||
@ -0,0 +1,49 @@
|
||||
import order from './order.js';
|
||||
|
||||
export default {
|
||||
skip_if_ssr: true,
|
||||
before_test() {
|
||||
order.length = 0;
|
||||
},
|
||||
test({ assert, compileOptions }) {
|
||||
if (compileOptions.hydratable) {
|
||||
assert.deepEqual(order, [
|
||||
'0: beforeUpdate',
|
||||
'0: render',
|
||||
'1: beforeUpdate',
|
||||
'1: render',
|
||||
'2: beforeUpdate',
|
||||
'2: render',
|
||||
'3: beforeUpdate',
|
||||
'3: render',
|
||||
'1: onMount',
|
||||
'1: afterUpdate',
|
||||
'2: onMount',
|
||||
'2: afterUpdate',
|
||||
'3: onMount',
|
||||
'3: afterUpdate',
|
||||
'0: onMount',
|
||||
'0: afterUpdate'
|
||||
]);
|
||||
} else {
|
||||
assert.deepEqual(order, [
|
||||
'0: beforeUpdate',
|
||||
'0: render',
|
||||
'1: beforeUpdate',
|
||||
'2: beforeUpdate',
|
||||
'3: beforeUpdate',
|
||||
'1: render',
|
||||
'2: render',
|
||||
'3: render',
|
||||
'1: onMount',
|
||||
'1: afterUpdate',
|
||||
'2: onMount',
|
||||
'2: afterUpdate',
|
||||
'3: onMount',
|
||||
'3: afterUpdate',
|
||||
'0: onMount',
|
||||
'0: afterUpdate'
|
||||
]);
|
||||
}
|
||||
}
|
||||
};
|
||||
@ -0,0 +1,34 @@
|
||||
<script>
|
||||
import { onMount, beforeUpdate, afterUpdate } from 'svelte';
|
||||
import order from './order.js';
|
||||
import Item from './Item.svelte';
|
||||
|
||||
const parentIndex = 0;
|
||||
let ul;
|
||||
let ulW;
|
||||
function logRender () {
|
||||
order.push(`${parentIndex}: render`);
|
||||
return parentIndex;
|
||||
}
|
||||
|
||||
beforeUpdate(() => {
|
||||
order.push(`${parentIndex}: beforeUpdate`);
|
||||
});
|
||||
|
||||
afterUpdate(() => {
|
||||
order.push(`${parentIndex}: afterUpdate`);
|
||||
});
|
||||
|
||||
onMount(() => {
|
||||
order.push(`${parentIndex}: onMount`);
|
||||
})
|
||||
</script>
|
||||
|
||||
{logRender()}
|
||||
<ul bind:this={ul} bind:clientWidth={ulW}>
|
||||
{#each [1,2,3] as index}
|
||||
<Item {index} />
|
||||
{/each}
|
||||
</ul>
|
||||
|
||||
|
||||
@ -0,0 +1 @@
|
||||
export default [];
|
||||
Loading…
Reference in new issue