mirror of https://github.com/sveltejs/svelte
parent
7b289e95f1
commit
2ec0a850fc
@ -0,0 +1,90 @@
|
||||
import { SsrGenerator } from './index';
|
||||
import { Node } from '../../interfaces';
|
||||
|
||||
function noop () {}
|
||||
|
||||
function isElseIf(node: Node) {
|
||||
return (
|
||||
node && node.children.length === 1 && node.children[0].type === 'IfBlock'
|
||||
);
|
||||
}
|
||||
|
||||
const preprocessors = {
|
||||
MustacheTag: noop,
|
||||
RawMustacheTag: noop,
|
||||
Text: noop,
|
||||
|
||||
IfBlock: (
|
||||
generator: SsrGenerator,
|
||||
node: Node,
|
||||
elementStack: Node[]
|
||||
) => {
|
||||
function attachBlocks(node: Node) {
|
||||
preprocessChildren(generator, node, elementStack);
|
||||
|
||||
if (isElseIf(node.else)) {
|
||||
attachBlocks(node.else.children[0]);
|
||||
} else if (node.else) {
|
||||
preprocessChildren(
|
||||
generator,
|
||||
node.else,
|
||||
elementStack
|
||||
);
|
||||
}
|
||||
}
|
||||
|
||||
attachBlocks(node);
|
||||
},
|
||||
|
||||
EachBlock: (
|
||||
generator: SsrGenerator,
|
||||
node: Node,
|
||||
elementStack: Node[]
|
||||
) => {
|
||||
preprocessChildren(generator, node, elementStack);
|
||||
|
||||
if (node.else) {
|
||||
preprocessChildren(
|
||||
generator,
|
||||
node.else,
|
||||
elementStack
|
||||
);
|
||||
}
|
||||
},
|
||||
|
||||
Element: (
|
||||
generator: SsrGenerator,
|
||||
node: Node,
|
||||
elementStack: Node[]
|
||||
) => {
|
||||
const isComponent =
|
||||
generator.components.has(node.name) || node.name === ':Self';
|
||||
|
||||
if (!isComponent) {
|
||||
generator.applyCss(node, elementStack);
|
||||
}
|
||||
|
||||
if (node.children.length) {
|
||||
if (isComponent) {
|
||||
preprocessChildren(generator, node, elementStack);
|
||||
} else {
|
||||
preprocessChildren(generator, node, elementStack.concat(node));
|
||||
}
|
||||
}
|
||||
},
|
||||
};
|
||||
|
||||
function preprocessChildren(
|
||||
generator: SsrGenerator,
|
||||
node: Node,
|
||||
elementStack: Node[]
|
||||
) {
|
||||
node.children.forEach((child: Node, i: number) => {
|
||||
const preprocessor = preprocessors[child.type];
|
||||
if (preprocessor) preprocessor(generator, child, elementStack);
|
||||
});
|
||||
}
|
||||
|
||||
export default function preprocess(generator: SsrGenerator, html: Node) {
|
||||
preprocessChildren(generator, html, []);
|
||||
}
|
@ -1,4 +1,4 @@
|
||||
|
||||
[data-foo][svelte-2966013849] {
|
||||
[autoplay][svelte-240005720] {
|
||||
color: red;
|
||||
}
|
||||
|
@ -1,2 +1,2 @@
|
||||
<div><p svelte-2966013849="" data-foo="true">this is styled</p>
|
||||
<p data-bar="true">this is unstyled</p></div>
|
||||
<div><video svelte-240005720 autoplay></video>
|
||||
<video></video></div>
|
@ -1,10 +1,10 @@
|
||||
<div>
|
||||
<p data-foo>this is styled</p>
|
||||
<p data-bar>this is unstyled</p>
|
||||
<video autoplay></video>
|
||||
<video></video>
|
||||
</div>
|
||||
|
||||
<style>
|
||||
[data-foo] {
|
||||
[autoplay] {
|
||||
color: red;
|
||||
}
|
||||
</style>
|
Loading…
Reference in new issue