Skip to content

Can not compile complex {#if} #3447

@Kauto

Description

@Kauto

While using a complex {#if} statement, svelte is compiling to invalid javascript.

<script>
	let item = {
		divider: [1],
		sub: {
			first: '/first',
			second: '/2',
			third: '/3'
	  }
	}
</script>

{#each Object.entries(item.sub) as [subName, path], i}
{#if (item.divider && item.divider.includes(i))}
<div class="divider"></div>
{/if}
<a href="{path}">{subName}</a>
{/each}
Module parse failed: Unexpected token (285:7)
File was processed with these loaders:
 * ./node_modules/svelte-loader/index.js
You may need an additional loader to handle the result of these loaders.
| 
|               p(changed, ctx) {
>                       if () show_if = (ctx.item.divider && ctx.item.divider.includes(ctx.i))
| 
|                       if (show_if) {

To Reproduce
Look at the code produced in this REPL:
https://svelte.dev/repl/8a129823894a48cb944245fb7bc1d6fe?version=3.9.1

you can see the error in the JS-output in line 71.

Expected behavior
Code compiles.

Severity
It was working in old versions, so now I have to downgrade.

Metadata

Metadata

Assignees

No one assigned

    Labels

    Type

    No type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions