Skip to content

Commit

Permalink
chore(rendered-content): nested html under rendered-content
Browse files Browse the repository at this point in the history
to make room for additional content from custom rendering functions

BREAKING CHANGE: the shape of rendered content has changed from a string to an object. the previous
string content is now provided as an `html` property of the object
  • Loading branch information
travi committed Dec 14, 2018
1 parent a532754 commit 7ff3fae
Show file tree
Hide file tree
Showing 4 changed files with 14 additions and 12 deletions.
2 changes: 1 addition & 1 deletion example/layout.mustache
Original file line number Diff line number Diff line change
Expand Up @@ -5,7 +5,7 @@
<meta name="viewport" content="width=device-width, initial-scale=1" />
</head>
<body>
<div id="wrap"><div>{{{ renderedContent }}}</div></div>
<div id="wrap"><div>{{{ renderedContent.html }}}</div></div>
<script src="https://cdn.polyfill.io/v2/polyfill.min.js"> </script>
</body>
</html>
12 changes: 7 additions & 5 deletions src/router-wrapper.js
Original file line number Diff line number Diff line change
Expand Up @@ -27,11 +27,13 @@ export default async function renderThroughReactRouter(request, h, {routes, resp
return respond(h, {
store,
status,
renderedContent: renderToString((
<Root request={request} store={store}>
<RouterContext {...renderProps} />
</Root>
))
renderedContent: {
html: renderToString((
<Root request={request} store={store}>
<RouterContext {...renderProps} />
</Root>
))
}
});
}
} catch (e) {
Expand Down
6 changes: 3 additions & 3 deletions test/integration/features/step_definitions/render-steps.js
Original file line number Diff line number Diff line change
Expand Up @@ -2,18 +2,18 @@ import {OK} from 'http-status-codes';
import {assert} from 'chai';
import {When, Then} from 'cucumber';

When('a request is made for an existing route', function () {
When(/^a request is made for an existing route$/, function () {
return this.makeRequest({url: '/existing-route'});
});

Then('the route is rendered successfully', function (callback) {
Then(/^the route is rendered successfully$/, function (callback) {
assert.equal(this.serverResponse.statusCode, OK);
assert.equal(this.serverResponse.headers['content-type'], 'text/html; charset=utf-8');

callback();
});

Then('asynchronously fetched data is included in the page', function (callback) {
Then(/^asynchronously fetched data is included in the page$/, function (callback) {
assert.include(this.serverResponse.payload, this.dataPoint);

callback();
Expand Down
6 changes: 3 additions & 3 deletions test/unit/router-wrapper-test.js
Original file line number Diff line number Diff line change
Expand Up @@ -38,14 +38,14 @@ suite('router-wrapper', () => {
const status = any.integer();
const context = any.simpleObject();
const rootComponent = any.simpleObject();
const renderedContent = any.string();
const html = any.string();
const response = any.string();
routeMatcher.default.withArgs(url, routes).resolves({renderProps, status});
dataFetcher.default.withArgs({renderProps, store, status}).resolves({renderProps, status});
React.createElement.withArgs(RouterContext, sinon.match(renderProps)).returns(context);
React.createElement.withArgs(Root, {request, store}).returns(rootComponent);
domServer.renderToString.withArgs(rootComponent).returns(renderedContent);
respond.withArgs(reply, {renderedContent, store, status}).returns(response);
domServer.renderToString.withArgs(rootComponent).returns(html);
respond.withArgs(reply, {renderedContent: {html}, store, status}).returns(response);

return assert.becomes(renderThroughReactRouter(request, reply, {routes, respond, Root, store}), response);
});
Expand Down

0 comments on commit 7ff3fae

Please sign in to comment.