Merge pull request #253 from sveltejs/universal-tests

[WIP] run tests with SSR compiler, where possible

Author: Rich-Harris

src/generators/server-side-rendering/visitors/YieldTag.js

@@ -1,5 +1,5 @@
 export default {
 	enter ( generator ) {
-		generator.append( `\${options.yield()}` );
+		generator.append( `\${options && options.yield ? options.yield() : ''}` );
 	}
 };

test/generate.js

@@ -4,7 +4,7 @@ import * as path from 'path';
 import * as fs from 'fs';
 import * as acorn from 'acorn';
 
-import { svelte, env, setupHtmlEqual } from './helpers.js';
+import { addLineNumbers, loadConfig, svelte, env, setupHtmlEqual } from './helpers.js';
 
 let showCompiledCode = false;
 let compileOptions = null;
@@ -18,36 +18,13 @@ require.extensions[ '.html' ] = function ( module, filename ) {
 	return module._compile( code, filename );
 };
 
-function addLineNumbers ( code ) {
-	return code.split( '\n' ).map( ( line, i ) => {
-		i = String( i + 1 );
-		while ( i.length < 3 ) i = ` ${i}`;
-
-		return `${i}: ${line.replace( /^\t+/, match => match.split( '\t' ).join( '    ' ) )}`;
-	}).join( '\n' );
-}
-
-function loadConfig ( dir ) {
-	try {
-		const resolved = require.resolve( `./generator/${dir}/_config.js` );
-		delete require.cache[ resolved ];
-		return require( resolved ).default;
-	} catch ( err ) {
-		if ( err.code === 'E_NOT_FOUND' ) {
-			return {};
-		}
-
-		throw err;
-	}
-}
-
 describe( 'generate', () => {
 	before( setupHtmlEqual );
 
 	function runTest ( dir, shared ) {
 		if ( dir[0] === '.' ) return;
 
-		const config = loadConfig( dir );
+		const config = loadConfig( `./generator/${dir}/_config.js` );
 
 		if ( config.solo && process.env.CI ) {
 			throw new Error( 'Forgot to remove `solo: true` from test' );

test/generator/component-binding-nested/_config.js

@@ -1,4 +1,6 @@
 export default {
+	'skip-ssr': true, // TODO delete this line, once binding works
+
 	data: {
 		x: 'initial'
 	},

test/generator/component-binding/_config.js

@@ -1,4 +1,6 @@
 export default {
+	'skip-ssr': true, // TODO delete this line, once binding works
+
 	html: `
 		<button>+1</button>
 		<p>count: 0</p>

test/generator/component-yield/_config.js

@@ -1,3 +1,3 @@
 export default {
-  html: '<p>Hello</p>'
-}
+	html: '<p>Hello</p>'
+};

test/generator/component-yield/main.html

@@ -1,15 +1,16 @@
 <p>
-  Hello
-  {{#if test}}
-    {{yield}}
-  {{/if}}
+	Hello
+	{{#if test}}
+		{{yield}}
+	{{/if}}
 </p>
+
 <script>
-  export default {
-    data(){
-      return {
-        test: true
-      }
-    }
-  }
+	export default {
+		data () {
+			return {
+				test: true
+			};
+		}
+	};
 </script>

test/generator/onrender-chain/_config.js

@@ -1,4 +1,6 @@
 export default {
+	'skip-ssr': true,
+
 	html: `
 		<span>3</span><span>2</span><span>1</span>
 	`,

test/generator/onrender-fires-when-ready-nested/_config.js

@@ -1,3 +1,5 @@
 export default {
+	'skip-ssr': true, // uses onrender
+
 	html: `<div><p>true</p>\n<p>true</p></div>`
 };

test/generator/onrender-fires-when-ready/_config.js

@@ -1,4 +1,6 @@
 export default {
+	'skip-ssr': true, // uses onrender
+
 	html: `<div><p>true</p></div>`,
 
 	test ( assert, component, target ) {

test/generator/raw-mustaches/_config.js

@@ -1,8 +1,12 @@
 const ns = '<noscript></noscript>';
+
 export default {
+	'skip-ssr': true,
+
 	data: {
 		raw: '<span><em>raw html!!!\\o/</span></em>'
 	},
+
 	html: `before${ns}<span><em>raw html!!!\\o/</span></em>${ns}after`,
 
 	test ( assert, component, target ) {

test/generator/set-in-observe/_config.js

@@ -1,4 +1,6 @@
 export default {
+	'skip-ssr': true, // uses onrender
+
 	html: `
 		<p>1</p>
 		<p>2</p>

test/generator/set-in-onrender/_config.js

@@ -1,3 +1,5 @@
 export default {
+	'skip-ssr': true, // uses onrender
+
 	html: '<p>2</p>'
 };

test/generator/text-node-top-level/_config.js test/generator/single-text-node/_config.js

@@ -1,4 +1,6 @@
 export default {
+	'skip-ssr': true,
+
 	data: {
 		x: 0,
 		y: 0,

test/generator/text-node-top-level/main.html test/generator/single-text-node/main.html

@@ -114,3 +114,26 @@ export function setupHtmlEqual () {
 		};
 	});
 }
+
+export function loadConfig ( file ) {
+	try {
+		const resolved = require.resolve( file );
+		delete require.cache[ resolved ];
+		return require( resolved ).default;
+	} catch ( err ) {
+		if ( err.code === 'E_NOT_FOUND' ) {
+			return {};
+		}
+
+		throw err;
+	}
+}
+
+export function addLineNumbers ( code ) {
+	return code.split( '\n' ).map( ( line, i ) => {
+		i = String( i + 1 );
+		while ( i.length < 3 ) i = ` ${i}`;
+
+		return `${i}: ${line.replace( /^\t+/, match => match.split( '\t' ).join( '    ' ) )}`;
+	}).join( '\n' );
+}

test/generator/svg-xmlns/_config.js

@@ -0,0 +1 @@
+before<span><em>raw html!!!\o/</span></em>after

test/helpers.js

@@ -0,0 +1 @@
+before<span><em>raw html!!!\o/</span></em>after

test/server-side-rendering/raw-mustaches/_actual.html

@@ -0,0 +1,3 @@
+{
+	"raw": "<span><em>raw html!!!\\o/</span></em>"
+}

test/server-side-rendering/raw-mustaches/_expected.html

@@ -0,0 +1 @@
+before{{{raw}}}after

test/server-side-rendering/raw-mustaches/data.json

@@ -1,7 +1,7 @@
 import assert from 'assert';
 import * as fs from 'fs';
 
-import { exists, setupHtmlEqual, tryToLoadJson } from './helpers.js';
+import { addLineNumbers, exists, loadConfig, setupHtmlEqual, svelte, tryToLoadJson } from './helpers.js';
 
 function tryToReadFile ( file ) {
 	try {
@@ -47,4 +47,47 @@ describe( 'ssr', () => {
 			assert.equal( css.replace( /^\s+/gm, '' ), expectedCss.replace( /^\s+/gm, '' ) );
 		});
 	});
+
+	// duplicate client-side tests, as far as possible
+	fs.readdirSync( 'test/generator' ).forEach( dir => {
+		if ( dir[0] === '.' ) return;
+
+		const config = loadConfig( `./generator/${dir}/_config.js` );
+
+		if ( config.solo && process.env.CI ) {
+			throw new Error( 'Forgot to remove `solo: true` from test' );
+		}
+
+		if ( config['skip-ssr'] ) return;
+
+		( config.skip ? it.skip : config.solo ? it.only : it )( dir, () => {
+			let compiled;
+
+			try {
+				const source = fs.readFileSync( `test/generator/${dir}/main.html`, 'utf-8' );
+				compiled = svelte.compile( source, { generate: 'ssr' });
+			} catch ( err ) {
+				if ( config.compileError ) {
+					config.compileError( err );
+					return;
+				} else {
+					throw err;
+				}
+			}
+
+			const component = require( `./generator/${dir}/main.html` );
+			let html;
+
+			try {
+				html = component.render( config.data );
+
+				if ( config.html ) {
+					assert.htmlEqual( html, config.html );
+				}
+			} catch ( err ) {
+				console.log( addLineNumbers( compiled.code ) ); // eslint-disable-line no-console
+				throw err;
+			}
+		});
+	});
 });