0
0
mirror of https://github.com/sveltejs/svelte.git synced 2024-12-01 17:30:59 +01:00

handle @foo and #foo edge cases

This commit is contained in:
Rich Harris 2017-06-25 20:03:17 -04:00
parent acf889d8b5
commit 2fa784ecc3
9 changed files with 30 additions and 30 deletions

View File

@ -254,11 +254,14 @@ export default function dom(
let result = builder
.toString()
.replace(/@(\w+)\b/g, (match: string, name: string) => {
.replace(/(\\)?@(\w*)/g, (match: string, escaped: string, name: string) => {
if (escaped) return match.slice(1);
if (name in shared) {
if (options.dev && `${name}Dev` in shared) name = `${name}Dev`;
usedHelpers.add(name);
}
return generator.alias(name);
});

View File

@ -2,7 +2,6 @@ import deindent from '../../utils/deindent';
import Generator from '../Generator';
import Block from './Block';
import visit from './visit';
import stringify from '../../utils/stringify';
import { removeNode, removeObjectKey } from '../../utils/removeNode';
import { Parsed, Node, CompileOptions } from '../../interfaces';
@ -84,7 +83,7 @@ export default function ssr(
var ${name} = {};
${name}.filename = ${stringify(options.filename)};
${name}.filename = ${JSON.stringify(options.filename)};
${name}.data = function () {
return ${templateProperties.data ? `@template.data()` : `{}`};
@ -124,7 +123,7 @@ export default function ssr(
deindent`
components.push({
filename: ${name}.filename,
css: ${stringify(generator.css)},
css: ${JSON.stringify(generator.css)},
map: null // TODO
});
`}
@ -169,7 +168,7 @@ export default function ssr(
function __escape ( html ) {
return String( html ).replace( /["'&<>]/g, match => escaped[ match ] );
}
`.replace(/@(\w+)/g, (match, name) => generator.alias(name));
`.replace(/(\\)?@(\w*)/g, (match: string, escaped: string, name: string) => escaped ? match.slice(1) : generator.alias(name));
return generator.generate(result, options, { name, format });
}

View File

@ -4,7 +4,6 @@ import { SsrGenerator } from '../index';
import Block from '../Block';
import { Node } from '../../../interfaces';
import getObject from '../../../utils/getObject';
import stringify from '../../../utils/stringify';
import getTailSnippet from '../../../utils/getTailSnippet';
export default function visitComponent(
@ -42,7 +41,7 @@ export default function visitComponent(
} else if (attribute.value.length === 1) {
const chunk = attribute.value[0];
if (chunk.type === 'Text') {
value = isNaN(chunk.data) ? stringify(chunk.data) : chunk.data;
value = isNaN(chunk.data) ? JSON.stringify(chunk.data) : chunk.data;
} else {
const { snippet } = block.contextualise(chunk.expression);
value = snippet;

View File

@ -7,5 +7,5 @@ export default function visitText(
block: Block,
node: Node
) {
generator.append(node.data.replace(/(\${|`|\\)/g, '\\$1'));
generator.append(node.data.replace(/(\${|`|\\)/g, '\\$1').replace(/([^\\])?([@#])/g, '$1\\$2'));
}

View File

@ -0,0 +1,3 @@
export default {
html: `#foo`
};

View File

@ -0,0 +1 @@
#foo

View File

@ -0,0 +1,3 @@
export default {
html: `@foo`
};

View File

@ -0,0 +1 @@
@foo

View File

@ -34,7 +34,7 @@ describe("ssr", () => {
// add .solo to a sample directory name to only run that test, or
// .show to always show the output. or both
const solo = /\.solo/.test(dir);
let show = /\.show/.test(dir);
const show = /\.show/.test(dir);
if (solo && process.env.CI) {
throw new Error("Forgot to remove `solo: true` from test");
@ -42,36 +42,27 @@ describe("ssr", () => {
(solo ? it.only : it)(dir, () => {
dir = path.resolve("test/server-side-rendering/samples", dir);
const component = require(`${dir}/main.html`);
const expectedHtml = tryToReadFile(`${dir}/_expected.html`);
const expectedCss = tryToReadFile(`${dir}/_expected.css`) || "";
const data = tryToLoadJson(`${dir}/data.json`);
let html;
let css;
let error;
try {
html = component.render(data);
css = component.renderCss().css;
} catch (e) {
show = true;
error = e;
}
const component = require(`${dir}/main.html`);
if (show) showOutput(dir, { generate: "ssr" });
if (error) throw error;
const expectedHtml = tryToReadFile(`${dir}/_expected.html`);
const expectedCss = tryToReadFile(`${dir}/_expected.css`) || "";
fs.writeFileSync(`${dir}/_actual.html`, html);
if (css) fs.writeFileSync(`${dir}/_actual.css`, css);
const data = tryToLoadJson(`${dir}/data.json`);
const html = component.render(data);
const css = component.renderCss().css;
fs.writeFileSync(`${dir}/_actual.html`, html);
if (css) fs.writeFileSync(`${dir}/_actual.css`, css);
try {
assert.htmlEqual(html, expectedHtml);
assert.equal(
css.replace(/^\s+/gm, ""),
expectedCss.replace(/^\s+/gm, "")
);
if (show) showOutput(dir, { generate: 'ssr' });
} catch (err) {
showOutput(dir, { generate: 'ssr' });
throw err;