msb-public
/
svelte
mirror of https://github.com/sveltejs/svelte
1
0
Code Issues Projects Releases Wiki Activity

fix: check each_blocks is empty on mount (#7505)

Browse Source 
fixes #8282
pull/8335/head
4eb0da 2 years ago committed by GitHub
parent 474a13ad90
commit 9edd2df0d3
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
17 changed files with 277 additions and 11 deletions
Show Stats Download Patch File Download Diff File

4
src/compiler/compile/render_dom/wrappers/EachBlock.ts
Unescape View File

@ -448,8 +448,10 @@ export default class EachBlockWrapper extends Wrapper {
block.chunks.mount.push(b`
for (let #i = 0; #i < ${view_length}; #i += 1) {
if (${iterations}[#i]) {
${iterations}[#i].m(${initial_mount_node}, ${initial_anchor_node});
}
}
`);
const dynamic = this.block.has_update_method;
@ -542,8 +544,10 @@ export default class EachBlockWrapper extends Wrapper {
block.chunks.mount.push(b`
for (let #i = 0; #i < ${view_length}; #i += 1) {
if (${iterations}[#i]) {
${iterations}[#i].m(${initial_mount_node}, ${initial_anchor_node});
}
}
`);
if (this.dependencies.size) {

2
test/js/samples/debug-foo-bar-baz-things/expected.js
Unescape View File

@ -114,8 +114,10 @@ function create_fragment(ctx) {
},
m: function mount(target, anchor) {
for (let i = 0; i < each_blocks.length; i += 1) {
if (each_blocks[i]) {
each_blocks[i].m(target, anchor);
}
}
insert_dev(target, t0, anchor);
insert_dev(target, p, anchor);

2
test/js/samples/debug-foo/expected.js
Unescape View File

@ -108,8 +108,10 @@ function create_fragment(ctx) {
},
m: function mount(target, anchor) {
for (let i = 0; i < each_blocks.length; i += 1) {
if (each_blocks[i]) {
each_blocks[i].m(target, anchor);
}
}
insert_dev(target, t0, anchor);
insert_dev(target, p, anchor);

2
test/js/samples/debug-no-dependencies/expected.js
Unescape View File

@ -86,8 +86,10 @@ function create_fragment(ctx) {
},
m: function mount(target, anchor) {
for (let i = 0; i < each_blocks.length; i += 1) {
if (each_blocks[i]) {
each_blocks[i].m(target, anchor);
}
}
insert_dev(target, each_1_anchor, anchor);
},

2
test/js/samples/deconflict-builtins/expected.js
Unescape View File

@ -63,8 +63,10 @@ function create_fragment(ctx) {
},
m(target, anchor) {
for (let i = 0; i < each_blocks.length; i += 1) {
if (each_blocks[i]) {
each_blocks[i].m(target, anchor);
}
}
insert(target, each_1_anchor, anchor);
},

2
test/js/samples/each-block-array-literal/expected.js
Unescape View File

@ -63,8 +63,10 @@ function create_fragment(ctx) {
},
m(target, anchor) {
for (let i = 0; i < 5; i += 1) {
if (each_blocks[i]) {
each_blocks[i].m(target, anchor);
}
}
insert(target, each_1_anchor, anchor);
},

2
test/js/samples/each-block-changed-check/expected.js
Unescape View File

@ -104,8 +104,10 @@ function create_fragment(ctx) {
},
m(target, anchor) {
for (let i = 0; i < each_blocks.length; i += 1) {
if (each_blocks[i]) {
each_blocks[i].m(target, anchor);
}
}
insert(target, t0, anchor);
insert(target, p, anchor);

2
test/js/samples/each-block-keyed-animated/expected.js
Unescape View File

@ -87,8 +87,10 @@ function create_fragment(ctx) {
},
m(target, anchor) {
for (let i = 0; i < each_blocks.length; i += 1) {
if (each_blocks[i]) {
each_blocks[i].m(target, anchor);
}
}
insert(target, each_1_anchor, anchor);
},

2
test/js/samples/each-block-keyed/expected.js
Unescape View File

@ -72,8 +72,10 @@ function create_fragment(ctx) {
},
m(target, anchor) {
for (let i = 0; i < each_blocks.length; i += 1) {
if (each_blocks[i]) {
each_blocks[i].m(target, anchor);
}
}
insert(target, each_1_anchor, anchor);
},

21
test/runtime/samples/component-binding-each-remount-keyed/Child.svelte
Unescape View File

@ -0,0 +1,21 @@
<script>
import InnerChild from './InnerChild.svelte';
export let id = 1;
export let count;
export let increment;
let list;
$: {
list = [];
for (let i = 0; i < count; ++i) {
list.push(i);
}
}
</script>
<div data-id={id}>
{#each list as item (item)}
<InnerChild val={item} {increment} />
{/each}
</div>

14
test/runtime/samples/component-binding-each-remount-keyed/InnerChild.svelte
Unescape View File

@ -0,0 +1,14 @@
<script>
import { afterUpdate } from 'svelte';
export let val = 1;
export let increment;
afterUpdate(() => {
increment();
});
</script>
<inner>
{val}
</inner>

53
test/runtime/samples/component-binding-each-remount-keyed/_config.js
Unescape View File

@ -0,0 +1,53 @@
export default {
html: `
<div data-id="1">
<inner>0</inner>
<inner>1</inner>
</div>
<div data-id="2">
<inner>0</inner>
<inner>1</inner>
</div>
<div data-id="3">
<inner>0</inner>
<inner>1</inner>
</div>
`,
ssrHtml: `
<div data-id="1">
<inner>0</inner>
<inner>1</inner>
<inner>2</inner>
</div>
<div data-id="2">
<inner>0</inner>
<inner>1</inner>
<inner>2</inner>
</div>
<div data-id="3">
<inner>0</inner>
<inner>1</inner>
<inner>2</inner>
</div>
`,
async test({ assert, component, target }) {
await component.done;
assert.equal(component.getCounter(), 13);
assert.htmlEqual(target.innerHTML, `
<div data-id="3">
<inner>0</inner>
<inner>1</inner>
</div>
<div data-id="2">
<inner>0</inner>
<inner>1</inner>
</div>
<div data-id="1">
<inner>0</inner>
<inner>1</inner>
</div>
`);
}
};

35
test/runtime/samples/component-binding-each-remount-keyed/main.svelte
Unescape View File

@ -0,0 +1,35 @@
<script>
import { onMount } from 'svelte';
import Child from './Child.svelte';
let updateCounter = 0;
let promiseResolve;
export const done = new Promise(resolve => {
promiseResolve = resolve;
});
export const getCounter = () => {
return updateCounter;
};
let vals = [1, 2, 3];
const instances = [];
let count = 3;
const increment = () => {
++updateCounter;
};
onMount(() => {
count = 2;
setTimeout(() => {
vals = vals.reverse();
setTimeout(promiseResolve);
});
});
</script>
{#each vals as val, index (val)}
<Child bind:this={instances[index]} id={val} {count} {increment} />
{/each}

21
test/runtime/samples/component-binding-each-remount-unkeyed/Child.svelte
Unescape View File

@ -0,0 +1,21 @@
<script>
import InnerChild from './InnerChild.svelte';
export let id = 1;
export let count;
export let increment;
let list;
$: {
list = [];
for (let i = 0; i < count; ++i) {
list.push(i);
}
}
</script>
<div data-id={id}>
{#each list as item}
<InnerChild val={item} {increment} />
{/each}
</div>

14
test/runtime/samples/component-binding-each-remount-unkeyed/InnerChild.svelte
Unescape View File

@ -0,0 +1,14 @@
<script>
import { afterUpdate } from 'svelte';
export let val = 1;
export let increment;
afterUpdate(() => {
increment();
});
</script>
<inner>
{val}
</inner>

53
test/runtime/samples/component-binding-each-remount-unkeyed/_config.js
Unescape View File

@ -0,0 +1,53 @@
export default {
html: `
<div data-id="1">
<inner>0</inner>
<inner>1</inner>
</div>
<div data-id="2">
<inner>0</inner>
<inner>1</inner>
</div>
<div data-id="3">
<inner>0</inner>
<inner>1</inner>
</div>
`,
ssrHtml: `
<div data-id="1">
<inner>0</inner>
<inner>1</inner>
<inner>2</inner>
</div>
<div data-id="2">
<inner>0</inner>
<inner>1</inner>
<inner>2</inner>
</div>
<div data-id="3">
<inner>0</inner>
<inner>1</inner>
<inner>2</inner>
</div>
`,
async test({ assert, component, target }) {
await component.done;
assert.equal(component.getCounter(), 13);
assert.htmlEqual(target.innerHTML, `
<div data-id="3">
<inner>0</inner>
<inner>1</inner>
</div>
<div data-id="2">
<inner>0</inner>
<inner>1</inner>
</div>
<div data-id="1">
<inner>0</inner>
<inner>1</inner>
</div>
`);
}
};

35
test/runtime/samples/component-binding-each-remount-unkeyed/main.svelte
Unescape View File

@ -0,0 +1,35 @@
<script>
import { onMount } from 'svelte';
import Child from './Child.svelte';
let updateCounter = 0;
let promiseResolve;
export const done = new Promise(resolve => {
promiseResolve = resolve;
});
export const getCounter = () => {
return updateCounter;
};
let vals = [1, 2, 3];
const instances = [];
let count = 3;
const increment = () => {
++updateCounter;
};
onMount(() => {
count = 2;
setTimeout(() => {
vals = vals.reverse();
setTimeout(promiseResolve);
});
});
</script>
{#each vals as val, index (val)}
<Child bind:this={instances[index]} id={val} {count} {increment} />
{/each}
Write Preview
Loading…
Cancel
Save