mirror of https://github.com/sveltejs/svelte
[fix] hydration append issue (#6602)
parent
c25789a25e
commit
100561c336
@ -0,0 +1,19 @@
|
|||||||
|
export default {
|
||||||
|
html: `
|
||||||
|
<div>
|
||||||
|
<div><span class="name">item 1</span><span>something</span></div>
|
||||||
|
<div><span class="name">item 2</span><span>something</span></div>
|
||||||
|
<div><span class="name">item 3</span><span>something</span></div>
|
||||||
|
</div>
|
||||||
|
`,
|
||||||
|
test({ assert, component, target }) {
|
||||||
|
component.sortById = false;
|
||||||
|
assert.htmlEqual( target.innerHTML, `
|
||||||
|
<div>
|
||||||
|
<div><span class="name">item 3</span><span>something</span></div>
|
||||||
|
<div><span class="name">item 2</span><span>something</span></div>
|
||||||
|
<div><span class="name">item 1</span><span>something</span></div>
|
||||||
|
</div>
|
||||||
|
`);
|
||||||
|
}
|
||||||
|
};
|
@ -0,0 +1,23 @@
|
|||||||
|
<script>
|
||||||
|
export let sortById = true;
|
||||||
|
let items = [
|
||||||
|
{ id: 1, name: "item 1", value: 3 },
|
||||||
|
{ id: 2, name: "item 2", value: 2 },
|
||||||
|
{ id: 3, name: "item 3", value: 1 },
|
||||||
|
];
|
||||||
|
|
||||||
|
$: items = items.sort((a, b) => { return sortById ? a.id - b.id : a.value - b.value; });
|
||||||
|
</script>
|
||||||
|
|
||||||
|
<div>
|
||||||
|
{#each items as item (item.id)}
|
||||||
|
<div>
|
||||||
|
{#if item.name}
|
||||||
|
<span class="name">
|
||||||
|
{item.name}
|
||||||
|
</span>
|
||||||
|
{/if}
|
||||||
|
<span>something</span>
|
||||||
|
</div>
|
||||||
|
{/each}
|
||||||
|
</div>
|
Loading…
Reference in new issue