const tag using .reduce inside each block with a nested each block bugging out very weridly

[SarcevicAntonio]

Describe the bug

I got some weird behavior using the const tag inside an each block which also contains another each block.

I'm trying to use a data structure like this:

const data = [
	{
		items: [{ val: 1 }, { val: 1 }],
	},
];

Straight forward enough.

Now I want to display the sum of each object's item.vals inside the data array and then also display each item.val.

Something like this works (REPL)

{#each data as obj}
	sum: {obj.items.reduce((acc,item)=> acc + item.val,0)}
	{#each obj.items as {val}}
		<div>val: {val}</div>
	{/each}
{/each}

Now let's say I need to sum multiple times and I want to use the const tag (REPL)

{#each data as obj}
	{@const sum = obj.items.reduce((acc,item)=> acc + item.val,0)}
	sum: {sum}
	{#each obj.items as {val}}
		<div>val: {val}</div>
	{/each}
{/each}

By adding the const tag Svelte errors out with Cannot read properties of undefined (reading '5').

Removing the inner each block resolves the error.

I also tried not deconstructing inside the nested each (REPL)

{#each data as obj}
	{@const sum = obj.items.reduce((acc,item)=> acc + item.val,0)}
	sum: {sum}
	{#each obj.items as item}
		<div>item.val: {item.val}</div>
	{/each}
{/each}

This produces different errors:

• inside the REPL: Assigning to rvalue (Note that you need plugins to import files that are not JavaScript)
• inside SvelteKit: 500 Invalid destructuring assignment target SyntaxError: Invalid destructuring assignment target

And now the best part: if I rename item inside the nested block, it works again (REPL)

{#each data as obj}
	{@const sum = obj.items.reduce((acc,item)=> acc + item.val,0)}
	sum: {sum}
	{#each obj.items as itm}
		<div>item.val: {itm.val}</div>
	{/each}
{/each}

This is terrifying and makes me want to not use the const tag again, which is sad because It's a pretty neat feature.

Reproduction

same as linked above

• Working, by not using const tag
• Broken, by using cons tag
• Broken, now not deconstructed, produces other error
• Working, not naming each items as item

Logs

"by using const tag" in SvelteKit:

[date].svelte? [sm]:9 Uncaught (in promise) TypeError: Cannot read properties of undefined (reading '5')
    at [date].svelte? [sm]:9:60
    at Array.reduce (<anonymous>)
    at get_each_context ([date].svelte? [sm]:9:26)
    at create_fragment ([date].svelte? [sm]:8:7)
    at init (index.mjs:1877:37)
    at new U5Bdateu5D ([date].svelte? [sm]:4:32)
    at createProxiedComponent (svelte-hooks.js:266:9)
    at new ProxyComponent (proxy.js:239:20)
    at new Proxy<[date]> (proxy.js:346:11)
    at Array.create_else_block (root.svelte? [sm]:43:40)

"by using const tag" in REPL: (only on initial visit of REPL)

index.da61f847.js:60 Error: Could not load https://unpkg.com/[email protected]/internal/index.mjs (imported by ./App.svelte): 
    at R (index.da61f847.js:21:834)
    at tn (index.da61f847.js:51:3364)
    at index.da61f847.js:51:21283
    at async index.da61f847.js:51:8510
    at async Zu.work (index.da61f847.js:51:2752)

"now not deconstructed" in REPL: (no log in SvelteKit shown, only 500 error above)

index.da61f847.js:60 Error: Assigning to rvalue (Note that you need plugins to import files that are not JavaScript)
    at R (index.da61f847.js:21:834)
    at re.error (index.da61f847.js:28:123491)
    at re.tryParse (index.da61f847.js:28:131909)
    at re.setSource (index.da61f847.js:28:129343)
    at ic.addModuleSource (index.da61f847.js:51:9316)

System Info

System:
    OS: macOS 12.2.1
    CPU: (8) arm64 Apple M1 Pro
    Memory: 1.18 GB / 16.00 GB
    Shell: 5.8 - /bin/zsh
  Binaries:
    Node: 16.14.0 - ~/.nvm/versions/node/v16.14.0/bin/node
    npm: 8.3.1 - ~/.nvm/versions/node/v16.14.0/bin/npm
  Browsers:
    Chrome: 100.0.4896.75
    Firefox: 98.0.1
    Safari: 15.3

Severity

annoyance

[dimfeld]

Your REPL that creates the error Cannot read properties of undefined (reading '5'). seems to be a slightly different manifestation of #7423. Underlying cause appears to be the same, looking at the generated code.

The rest are something else as far as I can tell.

[gtm-nayan]

#7222 was supposed to fix this I think, but has fallen into the depths of the issue tracker.