From fa01cf56f2e363aedc7deb1bd62812907a592348 Mon Sep 17 00:00:00 2001 From: kazuya kawaguchi Date: Tue, 24 Dec 2024 17:06:59 +0900 Subject: [PATCH] fix: support for if and each block --- .../src/ir/svelte.test.ts | 280 ++++++++++++++++-- .../svelte-template-compiler/src/ir/svelte.ts | 22 ++ .../src/style/selector.ts | 24 +- .../src/style/stylesheet.test.ts | 13 +- .../src/style/stylesheet.ts | 1 + .../_config.js | 0 .../expected.css | 0 .../expected.html | 0 .../input.svelte | 0 .../_config.js | 0 .../expected.css | 0 .../expected.html | 0 .../input.svelte | 0 .../_config.js | 0 .../expected.css | 0 .../expected.html | 0 .../input.svelte | 0 .../_config.js | 0 .../expected.css | 0 .../expected.html | 0 .../input.svelte | 0 .../_config.js | 0 .../expected.css | 0 .../expected.html | 0 .../input.svelte | 2 +- .../_config.js | 0 .../expected.css | 0 .../expected.html | 0 .../input.svelte | 0 .../_config.js | 0 .../expected.css | 0 .../expected.html | 0 .../input.svelte | 0 .../_config.js | 0 .../expected.css | 0 .../expected.html | 0 .../input.svelte | 0 .../_config.js | 0 .../expected.css | 0 .../expected.html | 0 .../input.svelte | 0 .../_config.js | 0 .../expected.css | 0 .../expected.html | 0 .../input.svelte | 0 .../_config.js | 0 .../expected.css | 0 .../expected.html | 0 .../input.svelte | 0 49 files changed, 308 insertions(+), 34 deletions(-) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-each-else-nested.skip => general-siblings-combinator-each-else-nested}/_config.js (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-each-else-nested.skip => general-siblings-combinator-each-else-nested}/expected.css (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-each-else-nested.skip => general-siblings-combinator-each-else-nested}/expected.html (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-each-else-nested.skip => general-siblings-combinator-each-else-nested}/input.svelte (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-each-else.skip => general-siblings-combinator-each-else}/_config.js (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-each-else.skip => general-siblings-combinator-each-else}/expected.css (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-each-else.skip => general-siblings-combinator-each-else}/expected.html (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-each-else.skip => general-siblings-combinator-each-else}/input.svelte (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if-not-exhaustive-with-each.skip => general-siblings-combinator-if-not-exhaustive-with-each}/_config.js (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if-not-exhaustive-with-each.skip => general-siblings-combinator-if-not-exhaustive-with-each}/expected.css (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if-not-exhaustive-with-each.skip => general-siblings-combinator-if-not-exhaustive-with-each}/expected.html (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if-not-exhaustive-with-each.skip => general-siblings-combinator-if-not-exhaustive-with-each}/input.svelte (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if-not-exhaustive.skip => general-siblings-combinator-if-not-exhaustive}/_config.js (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if-not-exhaustive.skip => general-siblings-combinator-if-not-exhaustive}/expected.css (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if-not-exhaustive.skip => general-siblings-combinator-if-not-exhaustive}/expected.html (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if-not-exhaustive.skip => general-siblings-combinator-if-not-exhaustive}/input.svelte (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if.skip => general-siblings-combinator-if}/_config.js (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if.skip => general-siblings-combinator-if}/expected.css (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if.skip => general-siblings-combinator-if}/expected.html (100%) rename packages/svelte-template-compiler/test/fixtures/{general-siblings-combinator-if.skip => general-siblings-combinator-if}/input.svelte (96%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-else-nested.skip => siblings-combinator-each-else-nested}/_config.js (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-else-nested.skip => siblings-combinator-each-else-nested}/expected.css (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-else-nested.skip => siblings-combinator-each-else-nested}/expected.html (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-else-nested.skip => siblings-combinator-each-else-nested}/input.svelte (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-else.skip => siblings-combinator-each-else}/_config.js (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-else.skip => siblings-combinator-each-else}/expected.css (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-else.skip => siblings-combinator-each-else}/expected.html (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-else.skip => siblings-combinator-each-else}/input.svelte (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-nested.skip => siblings-combinator-each-nested}/_config.js (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-nested.skip => siblings-combinator-each-nested}/expected.css (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-nested.skip => siblings-combinator-each-nested}/expected.html (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-each-nested.skip => siblings-combinator-each-nested}/input.svelte (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if-not-exhaustive-with-each.skip => siblings-combinator-if-not-exhaustive-with-each}/_config.js (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if-not-exhaustive-with-each.skip => siblings-combinator-if-not-exhaustive-with-each}/expected.css (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if-not-exhaustive-with-each.skip => siblings-combinator-if-not-exhaustive-with-each}/expected.html (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if-not-exhaustive-with-each.skip => siblings-combinator-if-not-exhaustive-with-each}/input.svelte (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if-not-exhaustive.skip => siblings-combinator-if-not-exhaustive}/_config.js (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if-not-exhaustive.skip => siblings-combinator-if-not-exhaustive}/expected.css (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if-not-exhaustive.skip => siblings-combinator-if-not-exhaustive}/expected.html (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if-not-exhaustive.skip => siblings-combinator-if-not-exhaustive}/input.svelte (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if.skip => siblings-combinator-if}/_config.js (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if.skip => siblings-combinator-if}/expected.css (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if.skip => siblings-combinator-if}/expected.html (100%) rename packages/svelte-template-compiler/test/fixtures/{siblings-combinator-if.skip => siblings-combinator-if}/input.svelte (100%) diff --git a/packages/svelte-template-compiler/src/ir/svelte.test.ts b/packages/svelte-template-compiler/src/ir/svelte.test.ts index afc4593..fec7ef8 100644 --- a/packages/svelte-template-compiler/src/ir/svelte.test.ts +++ b/packages/svelte-template-compiler/src/ir/svelte.test.ts @@ -1,9 +1,12 @@ import { parse } from 'svelte/compiler' -import { expect, test } from 'vitest' +import { describe, expect, test } from 'vitest' import { enableStructures } from './svelte.ts' -test('enableStructures', () => { - const code = ` +import type { SvelteElseBlock } from './svelte.ts' + +describe('enableStructures', () => { + test('basic', () => { + const code = ` + +
+

count:

+ {#if count === 1} +

This is count 1

+ {/if} +
+` + const { html } = parse(code) + enableStructures(html) + + // div + const div = (html.children || [])[2] + expect(div.parent).toEqual(html) + expect(div.prev).toBeUndefined() + expect(div.next).toBeUndefined() + // p + const p = div.children![1] + // {#if} + const ifBlock = div.children![3] + expect(p.parent).toEqual(div) + expect(p.prev).toBeUndefined() + expect(p.next).toEqual(ifBlock) + expect(ifBlock.parent).toEqual(div) + expect(ifBlock.prev).toEqual(p) + expect(ifBlock.next).toBeUndefined() + // p inside {#if} + const pInsideIf = ifBlock.children![0] + expect(pInsideIf.parent).toEqual(ifBlock) + expect(pInsideIf.prev).toBeUndefined() + expect(pInsideIf.next).toBeUndefined() + }) + + test('{#if expression}...{:else if expression}...{/if}', () => { + const code = ` + + +
+

count:

+ {#if count === 1} +

This is count 1

+ {:else if count === 2} +

This is count 2

+

Another count 2

+ {/if} +
+` + const { html } = parse(code) + enableStructures(html) + + // div + const div = (html.children || [])[2] + expect(div.parent).toEqual(html) + expect(div.prev).toBeUndefined() + expect(div.next).toBeUndefined() + // p + const p = div.children![1] + // {#if} + const ifBlock = div.children![3] + expect(p.parent).toEqual(div) + expect(p.prev).toBeUndefined() + expect(p.next).toEqual(ifBlock) + expect(ifBlock.parent).toEqual(div) + expect(ifBlock.prev).toEqual(p) + expect(ifBlock.next).toBeUndefined() + // p inside {#if} + const pInsideIf = ifBlock.children![0] + expect(pInsideIf.parent).toEqual(ifBlock) + expect(pInsideIf.prev).toBeUndefined() + expect(pInsideIf.next).toBeUndefined() + // {:else ..} + const elseIfBlock = ifBlock.else as SvelteElseBlock + expect(elseIfBlock.parent).toEqual(ifBlock) + expect(elseIfBlock.prev).toBeUndefined() + expect(elseIfBlock.next).toBeUndefined() + // {... if} + const ifBlock2 = elseIfBlock.children[0] + expect(ifBlock2.parent).toEqual(elseIfBlock) + expect(ifBlock2.prev).toBeUndefined() + expect(ifBlock2.next).toBeUndefined() + // p[0] inside {:else if} + const pInsideElseIf1 = ifBlock2.children![0] + // p[1] inside {:else if} + const pInsideElseIf2 = ifBlock2.children![2] + expect(pInsideElseIf1.parent).toEqual(ifBlock2) + expect(pInsideElseIf1.prev).toBeUndefined() + expect(pInsideElseIf1.next).toEqual(pInsideElseIf2) + expect(pInsideElseIf2.parent).toEqual(ifBlock2) + expect(pInsideElseIf2.prev).toEqual(pInsideElseIf1) + expect(pInsideElseIf2.next).toBeUndefined() + }) + + test('{#if expression}...{:else}...{/if}', () => { + const code = ` + + +
+

count:

+ {#if count === 1} +

This is count 1

+ {:else} +

This is not count

+ {/if} +
+` + const { html } = parse(code) + enableStructures(html) + + // div + const div = (html.children || [])[2] + expect(div.parent).toEqual(html) + expect(div.prev).toBeUndefined() + expect(div.next).toBeUndefined() + // p + const p = div.children![1] + // {#if} + const ifBlock = div.children![3] + expect(p.parent).toEqual(div) + expect(p.prev).toBeUndefined() + expect(p.next).toEqual(ifBlock) + expect(ifBlock.parent).toEqual(div) + expect(ifBlock.prev).toEqual(p) + expect(ifBlock.next).toBeUndefined() + // p inside {#if} + const pInsideIf = ifBlock.children![0] + expect(pInsideIf.parent).toEqual(ifBlock) + expect(pInsideIf.prev).toBeUndefined() + expect(pInsideIf.next).toBeUndefined() + // {:else} + const elseBlock = ifBlock.else as SvelteElseBlock + expect(elseBlock.parent).toEqual(ifBlock) + expect(elseBlock.prev).toBeUndefined() + expect(elseBlock.next).toBeUndefined() + // p inside {:else} + const pInsideElse = elseBlock.children[0] + expect(pInsideElse.parent).toEqual(elseBlock) + expect(pInsideElse.prev).toBeUndefined() + expect(pInsideElse.next).toBeUndefined() + }) + + test('{#each expression as name}...{/each}', () => { + const code = ` + + +
+

Shopping list

+ {#each items as item} +

{item.name} x {item.qty}

+ {/each} +
+` + const { html } = parse(code) + enableStructures(html) + + // div + const div = (html.children || [])[2] + expect(div.parent).toEqual(html) + expect(div.prev).toBeUndefined() + expect(div.next).toBeUndefined() + // h + const h = div.children![1] + // {#each} + const eachBlock = div.children![3] + expect(h.parent).toEqual(div) + expect(h.prev).toBeUndefined() + expect(h.next).toEqual(eachBlock) + expect(eachBlock.parent).toEqual(div) + expect(eachBlock.prev).toEqual(h) + expect(eachBlock.next).toBeUndefined() + // p inside {#each} + const pInsideIf = eachBlock.children![0] + expect(pInsideIf.parent).toEqual(eachBlock) + expect(pInsideIf.prev).toBeUndefined() + }) + + test('{#each expression as name}...{:else}...{/each}', () => { + const code = ` + + +
+

Shopping list

+ {#each items as item} +

{item.name} x {item.qty}

+ {:else} +

No items

+ {/each} +
+` + const { html } = parse(code) + enableStructures(html) + + // div + const div = (html.children || [])[2] + // {#each} + const eachBlock = div.children![3] + // {:else} + const elseBlock = eachBlock.else as SvelteElseBlock + expect(elseBlock.parent).toEqual(eachBlock) + expect(elseBlock.prev).toBeUndefined() + expect(elseBlock.next).toBeUndefined() + // p inside {:else} + const pInsideIf = elseBlock.children[0] + expect(pInsideIf.parent).toEqual(elseBlock) + expect(pInsideIf.prev).toBeUndefined() + }) + + test('{#await expression}...{:then name}...{:catch name}...{/await}', () => {}) + test('{#await expression}...{:then name}...{/await}', () => {}) + test('{#await expression then name}...{/await}', () => {}) + test('{#await expression catch name}...{/await}', () => {}) }) diff --git a/packages/svelte-template-compiler/src/ir/svelte.ts b/packages/svelte-template-compiler/src/ir/svelte.ts index be78bec..331f0e5 100644 --- a/packages/svelte-template-compiler/src/ir/svelte.ts +++ b/packages/svelte-template-compiler/src/ir/svelte.ts @@ -12,6 +12,7 @@ import type { BaseNode as SvelteBaseNode, ComponentTag as SvelteComponentTag, Directive as SvelteDirective, + EachBlock as SvelteEachBlock, Element as SvelteElement, ElseBlock as SvelteElseBlock, IfBlock as SvelteIfBlock, @@ -102,10 +103,18 @@ export function isSvelteEventHandler(node: unknown): node is SvelteBaseExpressio return isObject(node) && 'type' in node && node.type === 'EventHandler' } +export function isSvelteIfBlock(node: unknown): node is SvelteIfBlock { + return isObject(node) && 'type' in node && node.type === 'IfBlock' +} + export function isSvelteElseBlock(node: unknown): node is SvelteElseBlock { return isObject(node) && 'type' in node && node.type === 'ElseBlock' } +export function isSvelteEachBlock(node: unknown): node is SvelteEachBlock { + return isObject(node) && 'type' in node && node.type === 'EachBlock' +} + export function isIfBlockOnTop(node: SvelteIfBlock): boolean { return node.type === 'IfBlock' && !node.elseif } @@ -200,7 +209,15 @@ export type CompatLocationable = { export function enableStructures(node: SvelteTemplateNode): void { let last: SvelteTemplateNode | undefined const children = node.children || [] + if (__DEV__) { + console.log('enableStructures type:', node.type, node.parent?.type) + } + children.forEach(child => { + if (__DEV__) { + console.log('enableStructures child type:', child.type) + } + // ignores if (isSvelteText(child) || isSvelteComponentTag(child)) { return @@ -218,6 +235,11 @@ export function enableStructures(node: SvelteTemplateNode): void { if (child.children) { enableStructures(child) } + + if ((isSvelteIfBlock(child) || isSvelteEachBlock(child)) && isSvelteElseBlock(child.else)) { + child.else.parent = child + enableStructures(child.else) + } }) } diff --git a/packages/svelte-template-compiler/src/style/selector.ts b/packages/svelte-template-compiler/src/style/selector.ts index 4a7c123..00bd1ae 100644 --- a/packages/svelte-template-compiler/src/style/selector.ts +++ b/packages/svelte-template-compiler/src/style/selector.ts @@ -95,7 +95,8 @@ function groupSelectors(selector: CssNode): Block[] { const blocks: Block[] = [block] if (hasChildren(selector)) { - selector.children?.forEach(child => { + selector.children?.forEach((child, _index) => { + // console.log('groupSelectors', child.type, JSON.stringify(child), index) if (isWhiteSpace(child) || isCombinator(child)) { block = new Block(child) blocks.push(block) @@ -110,9 +111,10 @@ function groupSelectors(selector: CssNode): Block[] { export function applySelector( blocks: Block[], - node: SvelteElement | null, + node: SvelteElement | undefined, toEncapsulate: { node: SvelteElement; block: Block }[] ): boolean { + // console.log('applySelector', '-', node?.type, node?.name, JSON.stringify(node?.attributes), blocks.length, '-') const block = blocks.pop() if (!block) { @@ -172,8 +174,7 @@ export function applySelector( return true } - const parent = getElementParent(node) - if (parent && applySelector(blocks, parent, toEncapsulate)) { + if (applySelector(blocks, getElementParent(node), toEncapsulate)) { toEncapsulate.push({ node, block }) return true } @@ -183,6 +184,7 @@ export function applySelector( isCombinator(block.combinator) && (block.combinator.name === '+' || block.combinator.name === '~') ) { + // console.log('applySelector', 'type', node.type, 'combinator', block.combinator.name, JSON.stringify(block)) const [siblings, hasSlotSibling] = getPossibleElementSiblings( node, block.combinator.name === '+' @@ -201,6 +203,7 @@ export function applySelector( } for (const possibleSibling of siblings.keys()) { + // console.log('applySelector possibleSibling', possibleSibling.type, possibleSibling.name) // eslint-disable-next-line unicorn/prefer-spread if (applySelector(blocks.slice(), possibleSibling as SvelteElement, toEncapsulate)) { toEncapsulate.push({ node, block }) @@ -541,6 +544,7 @@ function getPossibleElementSiblings( node: SvelteTemplateNode, adjacentOnly: boolean ): [Map, boolean] { + // console.log('getPossibleElementSiblings', node.type, JSON.stringify(node.attributes), adjacentOnly) const result = new Map() let prev: SvelteTemplateNode | undefined = node @@ -548,6 +552,7 @@ function getPossibleElementSiblings( let slotSiblingFound = false while (([prev, slotSiblingFound] = findPreviousSibling(prev)) && prev) { + // console.log('getPossibleElementSiblings loop', prev?.type) if (isSvelteElement(prev)) { hasSlotSibling = hasSlotSibling || slotSiblingFound @@ -573,6 +578,7 @@ function getPossibleElementSiblings( if (!prev || !adjacentOnly) { let parent: SvelteTemplateNode | undefined = node let skipEachForLastChild = node.type === 'ElseBlock' + // console.log('getPossibleElementSiblings deep', parent?.type, skipEachForLastChild) while ( (parent = parent.parent) && (parent.type === 'EachBlock' || @@ -580,6 +586,7 @@ function getPossibleElementSiblings( parent.type === 'ElseBlock' || parent.type === 'AwaitBlock') ) { + // console.log('getPossibleElementSiblings deep in', parent?.type) const [possibleSiblings, slotSiblingFound] = getPossibleElementSiblings(parent, adjacentOnly) hasSlotSibling = hasSlotSibling || slotSiblingFound addToMap(possibleSiblings, result) @@ -604,7 +611,8 @@ function getPossibleElementSiblings( return [result, hasSlotSibling] } -function findPreviousSibling(node: SvelteTemplateNode): [SvelteTemplateNode, boolean] { +function findPreviousSibling(node: SvelteTemplateNode): [SvelteTemplateNode | undefined, boolean] { + // console.log('findPreviousSibling', node.type) let currentNode: SvelteTemplateNode | undefined = node let hasSlotSibling = false @@ -621,16 +629,19 @@ function findPreviousSibling(node: SvelteTemplateNode): [SvelteTemplateNode, boo while (!currentNode.prev && currentNode.parent && isSvelteSlot(currentNode.parent)) { currentNode = currentNode.parent } + // console.log('findPreviousSibling loop prev', currentNode?.type, currentNode?.prev?.type) currentNode = currentNode.prev } while (currentNode != null && isSvelteSlot(currentNode)) // eslint-disable-line unicorn/no-null - return [currentNode!, hasSlotSibling] + // console.log('findPreviousSibling return', currentNode?.type, hasSlotSibling) + return [currentNode, hasSlotSibling] } function getPossibleLastChild( block: SvelteTemplateNode, adjacentOnly: boolean ): Map { + // console.log('getPossibleLastChild', block.type, adjacentOnly) const result = new Map() const blockChildren = block.children || [] @@ -739,6 +750,7 @@ function loopChild( for (let i = children.length - 1; i >= 0; i--) { const child = children[i] + // console.log('loopChild child.type', child.type) if (isSvelteElement(child)) { result.set(child, NodeExist.Definitely) diff --git a/packages/svelte-template-compiler/src/style/stylesheet.test.ts b/packages/svelte-template-compiler/src/style/stylesheet.test.ts index 40cabfd..5532c2d 100644 --- a/packages/svelte-template-compiler/src/style/stylesheet.test.ts +++ b/packages/svelte-template-compiler/src/style/stylesheet.test.ts @@ -2,7 +2,15 @@ import { promises as fs, constants as FS_CONSTANTS } from 'node:fs' import path from 'node:path' import { parse } from 'svelte/compiler' import { describe, expect, it, test } from 'vitest' -import { enableStructures, findAttrs, isSvelteElement, isSvelteText } from '../ir/index.ts' +import { + enableStructures, + findAttrs, + isSvelteEachBlock, + isSvelteElement, + isSvelteElseBlock, + isSvelteIfBlock, + isSvelteText +} from '../ir/index.ts' import { SvelteStylesheet } from './stylesheet.ts' import type { SvelteAttribute, SvelteElement, SvelteTemplateNode, SvelteText } from '../ir/index.ts' @@ -51,6 +59,9 @@ function walk( walk(child, { enter, leave }) } } + if ((isSvelteIfBlock(node) || isSvelteEachBlock(node)) && isSvelteElseBlock(node.else)) { + walk(node.else, { enter, leave }) + } leave?.(node) } diff --git a/packages/svelte-template-compiler/src/style/stylesheet.ts b/packages/svelte-template-compiler/src/style/stylesheet.ts index b548b8f..003c7a0 100644 --- a/packages/svelte-template-compiler/src/style/stylesheet.ts +++ b/packages/svelte-template-compiler/src/style/stylesheet.ts @@ -291,6 +291,7 @@ function apply( // for Selector const toEncapsulate: { node: SvelteElement; block: Block }[] = [] + // console.log('css.localBlocks', JSON.stringify(css.localBlocks), css.localBlocks.length) // eslint-disable-next-line unicorn/prefer-spread applySelector(css.localBlocks.slice(), node, toEncapsulate) diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested.skip/_config.js b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested/_config.js similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested.skip/_config.js rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested/_config.js diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested.skip/expected.css b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested/expected.css similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested.skip/expected.css rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested/expected.css diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested.skip/expected.html b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested/expected.html similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested.skip/expected.html rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested/expected.html diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested.skip/input.svelte b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested/input.svelte similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested.skip/input.svelte rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else-nested/input.svelte diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else.skip/_config.js b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else/_config.js similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else.skip/_config.js rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else/_config.js diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else.skip/expected.css b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else/expected.css similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else.skip/expected.css rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else/expected.css diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else.skip/expected.html b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else/expected.html similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else.skip/expected.html rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else/expected.html diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else.skip/input.svelte b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else/input.svelte similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else.skip/input.svelte rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-each-else/input.svelte diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each.skip/_config.js b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each/_config.js similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each.skip/_config.js rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each/_config.js diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each.skip/expected.css b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each/expected.css similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each.skip/expected.css rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each/expected.css diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each.skip/expected.html b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each/expected.html similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each.skip/expected.html rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each/expected.html diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each.skip/input.svelte b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each/input.svelte similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each.skip/input.svelte rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive-with-each/input.svelte diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive.skip/_config.js b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive/_config.js similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive.skip/_config.js rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive/_config.js diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive.skip/expected.css b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive/expected.css similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive.skip/expected.css rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive/expected.css diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive.skip/expected.html b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive/expected.html similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive.skip/expected.html rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive/expected.html diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive.skip/input.svelte b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive/input.svelte similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive.skip/input.svelte rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if-not-exhaustive/input.svelte diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if.skip/_config.js b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if/_config.js similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if.skip/_config.js rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if/_config.js diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if.skip/expected.css b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if/expected.css similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if.skip/expected.css rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if/expected.css diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if.skip/expected.html b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if/expected.html similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if.skip/expected.html rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if/expected.html diff --git a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if.skip/input.svelte b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if/input.svelte similarity index 96% rename from packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if.skip/input.svelte rename to packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if/input.svelte index fca5499..c208d31 100644 --- a/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if.skip/input.svelte +++ b/packages/svelte-template-compiler/test/fixtures/general-siblings-combinator-if/input.svelte @@ -28,4 +28,4 @@
{/if} -
\ No newline at end of file +
diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested.skip/_config.js b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested/_config.js similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested.skip/_config.js rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested/_config.js diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested.skip/expected.css b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested/expected.css similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested.skip/expected.css rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested/expected.css diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested.skip/expected.html b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested/expected.html similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested.skip/expected.html rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested/expected.html diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested.skip/input.svelte b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested/input.svelte similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested.skip/input.svelte rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else-nested/input.svelte diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else.skip/_config.js b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else/_config.js similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else.skip/_config.js rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else/_config.js diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else.skip/expected.css b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else/expected.css similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else.skip/expected.css rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else/expected.css diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else.skip/expected.html b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else/expected.html similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else.skip/expected.html rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else/expected.html diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else.skip/input.svelte b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else/input.svelte similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else.skip/input.svelte rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-else/input.svelte diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested.skip/_config.js b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested/_config.js similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested.skip/_config.js rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested/_config.js diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested.skip/expected.css b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested/expected.css similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested.skip/expected.css rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested/expected.css diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested.skip/expected.html b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested/expected.html similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested.skip/expected.html rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested/expected.html diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested.skip/input.svelte b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested/input.svelte similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested.skip/input.svelte rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-each-nested/input.svelte diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each.skip/_config.js b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each/_config.js similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each.skip/_config.js rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each/_config.js diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each.skip/expected.css b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each/expected.css similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each.skip/expected.css rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each/expected.css diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each.skip/expected.html b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each/expected.html similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each.skip/expected.html rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each/expected.html diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each.skip/input.svelte b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each/input.svelte similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each.skip/input.svelte rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive-with-each/input.svelte diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive.skip/_config.js b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive/_config.js similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive.skip/_config.js rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive/_config.js diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive.skip/expected.css b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive/expected.css similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive.skip/expected.css rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive/expected.css diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive.skip/expected.html b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive/expected.html similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive.skip/expected.html rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive/expected.html diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive.skip/input.svelte b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive/input.svelte similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive.skip/input.svelte rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if-not-exhaustive/input.svelte diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if.skip/_config.js b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if/_config.js similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if.skip/_config.js rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if/_config.js diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if.skip/expected.css b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if/expected.css similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if.skip/expected.css rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if/expected.css diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if.skip/expected.html b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if/expected.html similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if.skip/expected.html rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if/expected.html diff --git a/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if.skip/input.svelte b/packages/svelte-template-compiler/test/fixtures/siblings-combinator-if/input.svelte similarity index 100% rename from packages/svelte-template-compiler/test/fixtures/siblings-combinator-if.skip/input.svelte rename to packages/svelte-template-compiler/test/fixtures/siblings-combinator-if/input.svelte