From 286e4350d4c2c99f3cc4aca458e6244c96a9678e Mon Sep 17 00:00:00 2001 From: Rich Harris Date: Wed, 13 Dec 2017 09:52:04 -0500 Subject: [PATCH] generate title in SSR compiler --- .../visitors/Document.ts | 19 ++++++++++++++++--- .../server-side-rendering/visitors/Element.ts | 16 +--------------- .../shared/stringifyAttributeValue.ts | 17 +++++++++++++++++ test/server-side-rendering/index.js | 9 ++++++++- .../samples/document-title/_expected.html | 0 .../samples/document-title/data.json | 3 +++ .../samples/document-title/main.html | 1 + .../samples/document-title/title.txt | 1 + 8 files changed, 47 insertions(+), 19 deletions(-) create mode 100644 src/generators/server-side-rendering/visitors/shared/stringifyAttributeValue.ts create mode 100644 test/server-side-rendering/samples/document-title/_expected.html create mode 100644 test/server-side-rendering/samples/document-title/data.json create mode 100644 test/server-side-rendering/samples/document-title/main.html create mode 100644 test/server-side-rendering/samples/document-title/title.txt diff --git a/src/generators/server-side-rendering/visitors/Document.ts b/src/generators/server-side-rendering/visitors/Document.ts index b0b3826033..de2c35fbf7 100644 --- a/src/generators/server-side-rendering/visitors/Document.ts +++ b/src/generators/server-side-rendering/visitors/Document.ts @@ -1,3 +1,16 @@ -export default function visitDocument() { - // noop -} +import { SsrGenerator } from '../index'; +import Block from '../Block'; +import { Node } from '../../../interfaces'; +import stringifyAttributeValue from './shared/stringifyAttributeValue'; + +export default function visitDocument( + generator: SsrGenerator, + block: Block, + node: Node +) { + const title = node.attributes.find(attribute => attribute.type === 'Attribute' && attribute.name === 'title'); + + if (title) { + generator.append('${(__result.title = `' + stringifyAttributeValue(block, title.value) + '`, "")}'); + } +} \ No newline at end of file diff --git a/src/generators/server-side-rendering/visitors/Element.ts b/src/generators/server-side-rendering/visitors/Element.ts index 731f73b5fa..a1645d0860 100644 --- a/src/generators/server-side-rendering/visitors/Element.ts +++ b/src/generators/server-side-rendering/visitors/Element.ts @@ -5,22 +5,8 @@ import visit from '../visit'; import { SsrGenerator } from '../index'; import Element from '../../nodes/Element'; import Block from '../Block'; -import { escape } from '../../../utils/stringify'; import { Node } from '../../../interfaces'; - -function stringifyAttributeValue(block: Block, chunks: Node[]) { - return chunks - .map((chunk: Node) => { - if (chunk.type === 'Text') { - return escape(chunk.data).replace(/"/g, '"'); - } - - block.contextualise(chunk.expression); - const { snippet } = chunk.metadata; - return '${' + snippet + '}'; - }) - .join(''); -} +import stringifyAttributeValue from './shared/stringifyAttributeValue'; export default function visitElement( generator: SsrGenerator, diff --git a/src/generators/server-side-rendering/visitors/shared/stringifyAttributeValue.ts b/src/generators/server-side-rendering/visitors/shared/stringifyAttributeValue.ts new file mode 100644 index 0000000000..22eb0eff76 --- /dev/null +++ b/src/generators/server-side-rendering/visitors/shared/stringifyAttributeValue.ts @@ -0,0 +1,17 @@ +import Block from '../../Block'; +import { escape } from '../../../../utils/stringify'; +import { Node } from '../../../../interfaces'; + +export default function stringifyAttributeValue(block: Block, chunks: Node[]) { + return chunks + .map((chunk: Node) => { + if (chunk.type === 'Text') { + return escape(chunk.data).replace(/"/g, '"'); + } + + block.contextualise(chunk.expression); + const { snippet } = chunk.metadata; + return '${' + snippet + '}'; + }) + .join(''); +} \ No newline at end of file diff --git a/test/server-side-rendering/index.js b/test/server-side-rendering/index.js index b721fe35f9..2ad256ac99 100644 --- a/test/server-side-rendering/index.js +++ b/test/server-side-rendering/index.js @@ -59,7 +59,7 @@ describe("ssr", () => { const data = tryToLoadJson(`${dir}/data.json`); - const { html, css } = component.render(data); + const { html, css, title } = component.render(data); fs.writeFileSync(`${dir}/_actual.html`, html); if (css.code) fs.writeFileSync(`${dir}/_actual.css`, css.code); @@ -70,6 +70,13 @@ describe("ssr", () => { expectedCss.replace(/^\s+/gm, "") ); + if (fs.existsSync(`${dir}/title.txt`)) { + assert.equal( + title, + fs.readFileSync(`${dir}/title.txt`, 'utf-8') + ); + } + if (show) showOutput(dir, { generate: 'ssr' }); } catch (err) { showOutput(dir, { generate: 'ssr' }); diff --git a/test/server-side-rendering/samples/document-title/_expected.html b/test/server-side-rendering/samples/document-title/_expected.html new file mode 100644 index 0000000000..e69de29bb2 diff --git a/test/server-side-rendering/samples/document-title/data.json b/test/server-side-rendering/samples/document-title/data.json new file mode 100644 index 0000000000..eab238e816 --- /dev/null +++ b/test/server-side-rendering/samples/document-title/data.json @@ -0,0 +1,3 @@ +{ + "adjective": "custom" +} \ No newline at end of file diff --git a/test/server-side-rendering/samples/document-title/main.html b/test/server-side-rendering/samples/document-title/main.html new file mode 100644 index 0000000000..e049742dbc --- /dev/null +++ b/test/server-side-rendering/samples/document-title/main.html @@ -0,0 +1 @@ +<:Document title='a {{adjective}} title'/> diff --git a/test/server-side-rendering/samples/document-title/title.txt b/test/server-side-rendering/samples/document-title/title.txt new file mode 100644 index 0000000000..ee4f8353b2 --- /dev/null +++ b/test/server-side-rendering/samples/document-title/title.txt @@ -0,0 +1 @@ +a custom title \ No newline at end of file