diff --git a/src/components/Html/__tests__/__snapshots__/index.js.snap b/src/components/Html/__tests__/__snapshots__/index.js.snap
index 9b811c66a..ef820b1d9 100644
--- a/src/components/Html/__tests__/__snapshots__/index.js.snap
+++ b/src/components/Html/__tests__/__snapshots__/index.js.snap
@@ -1,4 +1,4 @@
-exports[`test should render Html componnent 1`] = `
+exports[`test should render Html component 1`] = `
@@ -21,11 +21,71 @@ exports[`test should render Html componnent 1`] = `
rel="stylesheet" />
-
-
+ ",
+ }
+ }
+ id="phenomic" />
+
+
+
+
+`;
+
+exports[`test should render Html component when glamor available 1`] = `
+
+
+
+
+
+
+
+
+
+
+ ",
+ }
+ }
+ id="phenomic" />
+
+
+ src="test.js" />
`;
diff --git a/src/components/Html/__tests__/index.js b/src/components/Html/__tests__/index.js
index 8d50441b9..dde1db7f8 100644
--- a/src/components/Html/__tests__/index.js
+++ b/src/components/Html/__tests__/index.js
@@ -3,16 +3,42 @@ import { createRenderer } from "react-addons-test-utils"
import Html from "../index.js"
-test("should render Html componnent", () => {
+test("should render Html component", () => {
const renderer = createRenderer()
renderer.render(
/* eslint-disable react/jsx-no-bind */
}
- renderScript={ () => }
+ js={ [ "test.js" ] }
+ renderBody={ () => "" }
+ renderScript={ () => }
/>
)
expect(renderer.getRenderOutput()).toMatchSnapshot()
})
+
+test("should render Html component when glamor available", () => {
+ jest.mock(
+ "glamor/server",
+ () => ({
+ renderStatic: (render) => ({
+ html: render(),
+ css: ".stuff {}",
+ ids: [ { id: "s" } ],
+ }),
+ }),
+ { virtual: true }
+ )
+ const renderer = createRenderer()
+ renderer.render(
+ /* eslint-disable react/jsx-no-bind */
+ "" }
+ renderScript={ () => }
+ />
+ )
+ expect(renderer.getRenderOutput()).toMatchSnapshot()
+ jest.unmock("glamor/server", { virtual: true })
+})
diff --git a/src/components/Html/index.js b/src/components/Html/index.js
index db209f42b..d261218c4 100644
--- a/src/components/Html/index.js
+++ b/src/components/Html/index.js
@@ -24,12 +24,52 @@ const defaultMeta = [
]
const Html = (props: Props) => {
+
// Inject default html metas before
// Those need to be rendered somehow otherwise Helmet won't consider those
renderToString(
+ )
+
+ // Glamor integration
+ // https://github.com/threepointone/glamor/blob/master/docs/server.md
+ let glamorRenderStatic
+ try {
+ // $FlowFixMe just ignore glamor as we don't have it as a dep
+ glamorRenderStatic = require("glamor/server").renderStatic
+ }
+ catch (e) {
+ // skip glamor if not working
+ }
+
+ // render body
+ let body
+ if (glamorRenderStatic) {
+ const glamorResult = glamorRenderStatic(() => props.renderBody())
+
+ console.log({ glamorResult })
+ renderToString(
+
+ )
+ body = glamorResult.html
+ }
+
+ body = body || props.renderBody()
+
+ renderToString(
+ ({ rel: "stylesheet", href: file })),
] }
@@ -39,8 +79,6 @@ const Html = (props: Props) => {
/>
)
- // render body
- const body = props.renderBody()
// rewind html metas
const head = Helmet.rewind()
@@ -51,10 +89,11 @@ const Html = (props: Props) => {
{ head.base.toComponent() }
{ head.title.toComponent() }
{ head.meta.toComponent() }
+ { head.style.toComponent() }
{ head.link.toComponent() }
- { body }
+
{ props.renderScript() }
{ head.script.toComponent() }
diff --git a/src/static/url-as-html.js b/src/static/url-as-html.js
index 126cc6cd1..a75d4986e 100644
--- a/src/static/url-as-html.js
+++ b/src/static/url-as-html.js
@@ -64,22 +64,16 @@ export default function(
/* eslint-disable react/no-multi-comp */
- const renderBody = () => {
- const body = render(
-
-
-
-
-
- )
-
- return (
-
- )
- }
+ const renderBody = () => render(
+
+
+
+
+
+ )
const renderScript = () => {
if (options.clientScripts) {