diff --git a/CHANGELOG.md b/CHANGELOG.md index 426c35b84fb6..4df49ecc77a7 100644 --- a/CHANGELOG.md +++ b/CHANGELOG.md @@ -1,5 +1,9 @@ # Svelte changelog +## Unreleased + +* Ignore whitespace in `{#each}` blocks when containing elements with `animate:` ([#5477](https://github.com/sveltejs/svelte/pull/5477)) + ## 3.46.2 * Export `FlipParams` interface from `svelte/animate` ([#7103](https://github.com/sveltejs/svelte/issues/7103)) diff --git a/src/compiler/compile/nodes/EachBlock.ts b/src/compiler/compile/nodes/EachBlock.ts index e1e3107d92c5..bb78845dd927 100644 --- a/src/compiler/compile/nodes/EachBlock.ts +++ b/src/compiler/compile/nodes/EachBlock.ts @@ -9,6 +9,7 @@ import { Node } from 'estree'; import Component from '../Component'; import { TemplateNode } from '../../interfaces'; import compiler_errors from '../compiler_errors'; +import { INode } from './interfaces'; import get_const_tags from './shared/get_const_tags'; export default class EachBlock extends AbstractBlock { @@ -62,6 +63,8 @@ export default class EachBlock extends AbstractBlock { ([this.const_tags, this.children] = get_const_tags(info.children, component, this, this)); if (this.has_animation) { + this.children = this.children.filter(child => !isEmptyNode(child)); + if (this.children.length !== 1) { const child = this.children.find(child => !!(child as Element).animation); component.error((child as Element).animation, compiler_errors.invalid_animation_sole); @@ -76,3 +79,7 @@ export default class EachBlock extends AbstractBlock { : null; } } + +function isEmptyNode(node: INode) { + return node.type === 'Text' && node.data.trim() === ''; +} diff --git a/test/validator/samples/animation-each-with-const/errors.json b/test/validator/samples/animation-each-with-const/errors.json new file mode 100644 index 000000000000..0637a088a01e --- /dev/null +++ b/test/validator/samples/animation-each-with-const/errors.json @@ -0,0 +1 @@ +[] \ No newline at end of file diff --git a/test/validator/samples/animation-each-with-const/input.svelte b/test/validator/samples/animation-each-with-const/input.svelte new file mode 100644 index 000000000000..1e236de76f3f --- /dev/null +++ b/test/validator/samples/animation-each-with-const/input.svelte @@ -0,0 +1,10 @@ + + +