implement Dev mode validation of {#each} block argument - disallow Sets, Maps, nonArrayLikes

[swyxio]

closes #4408

Implemented two tests:

dev-warning-each-block-require-arraylike:

<script>
	const foo = new Set([1,2,3])
</script>

{#each foo.values() as item}
	<div>{item}</div>
{/each}

gets you the error: Svelte needs an array-like value for the {#each} block. You can spread your iterable into an array instead, e.g. [...iterable]

dev-warning-each-block-no-sets-maps:

<script>
	const foo = new Set([1,2,3])
</script>

{#each foo as item}
	<div>{item}</div>
{/each}

gets you the error: Svelte does not allow Sets or Maps in an {#each} block. Use [...arg.values()] instead.

I'm not sure what other info to provide, happy to take input on what the wording of the error should be

[swyxio]

I, uh, also blogged about it in case you want this content somewhere

[swyxio]

I should also note that i went for two messages instead of one message because i wanted to make it abundantly clear that Svelte has considered allowing the {#each} block for sets, maps, and nonarraylike iterables and has rejected the idea to the point of specifically building in dev errors to say as much. the two messages/tests capture the two main ways in which Svelte devs will shoot themselves in the foot before finding out about this.

[antony]

I like this. At some point it might be nice to provide support for Sets and Maps in an {#each}, as it immediately seems like something that would be supported. This closes the gap until this functionality can be looked at.