Merge pull request #1029 from sveltejs/gh-1028-followup

get store() to work with nested components in SSR compiler

src/generators/server-side-rendering/index.ts

@@ -81,10 +81,8 @@ export default function ssr(
 
 	if (storeProps.length > 0) {
 		const initialize = `_init([${storeProps.map(prop => `"${prop.slice(1)}"`)}])`
-		if (options.store) {
+		if (options.store || templateProperties.store) {
 			initialState.push(`options.store.${initialize}`);
-		} else if (templateProperties.store) {
-			initialState.push(`%store().${initialize}`);
 		}
 	}
 
@@ -116,6 +114,7 @@ export default function ssr(
 			}
 
 			var result = { head: '', addComponent };
+			${templateProperties.store && `options.store = %store();`}
 			var html = ${name}._render(result, state, options);
 
 			var cssCode = Array.from(components).map(c => c.css && c.css.code).filter(Boolean).join('\\n');

test/runtime/index.js

@@ -159,7 +159,7 @@ describe("runtime", () => {
 						target,
 						hydrate,
 						data: config.data,
-					  store: config.store
+						store: (config.store !== true && config.store)
 					}, config.options || {});
 
 					const component = new SvelteComponent(options);

test/runtime/samples/store-root/Nested.html

@@ -0,0 +1 @@
+<p>It's nice to see you, {{$name}}.</p>

test/runtime/samples/store-root/_config.js

@@ -1,9 +1,17 @@
 export default {
-	html: `<h1>Hello world!</h1>`,
+	store: true, // TODO remove this in v2
+
+	html: `
+		<h1>Hello world!</h1>
+		<p>It's nice to see you, world.</p>
+	`,
 
 	test(assert, component, target) {
 		component.store.set({ name: 'everybody' });
 
-		assert.htmlEqual(target.innerHTML, `<h1>Hello everybody!</h1>`);
+		assert.htmlEqual(target.innerHTML, `
+			<h1>Hello everybody!</h1>
+			<p>It's nice to see you, everybody.</p>
+		`);
 	}
 };

test/runtime/samples/store-root/main.html

@@ -1,11 +1,19 @@
 <h1>Hello {{$name}}!</h1>
+<Nested/>
+
 <script>
-import { Store } from '../../../../store.js';
-export default {
-	store () {
-		return new Store({
-			name: 'world'
-		});
-	}
-}
+	import { Store } from '../../../../store.js';
+	import Nested from './Nested.html';
+
+	export default {
+		store () {
+			return new Store({
+				name: 'world'
+			});
+		},
+
+		components: {
+			Nested
+		}
+	};
 </script>

test/server-side-rendering/index.js

@@ -113,7 +113,7 @@ describe("ssr", () => {
 			try {
 				const component = require(`../runtime/samples/${dir}/main.html`);
 				const { html } = component.render(config.data, {
-					store: config.store
+					store: (config.store !== true) && config.store
 				});
 
 				if (config.html) {