Add support for intercepting different file extensions, other than .html, in ssr.

Proposal for sveltejs#939

Author: esarbanis

src/server-side-rendering/register.js

@@ -6,12 +6,29 @@ function capitalise(name) {
 	return name[0].toUpperCase() + name.slice(1);
 }
 
-require.extensions['.html'] = function(module, filename) {
-	const { code } = compile(fs.readFileSync(filename, 'utf-8'), {
-		filename,
-		name: capitalise(path.basename(filename).replace(/\.html$/, '')),
-		generate: 'ssr'
-	});
+export default function register(options) {
+	const { extensions } = options;
+	if (extensions) {
+		_deregister('.html');
+		extensions.forEach(_register);
+	}
+}
+
+function _deregister(extension) {
+	delete require.extensions[extension];
+}
+
+function _register(extension) {
+	require.extensions[extension] = function(module, filename) {
+		const {code} = compile(fs.readFileSync(filename, 'utf-8'), {
+			filename,
+			name: capitalise(path.basename(filename)
+				.replace(new RegExp(`${extension.replace('.', '\\.')}$`), '')),
+			generate: 'ssr',
+		});
+
+		return module._compile(code, filename);
+	};
+}
 
-	return module._compile(code, filename);
-};
+_register('.html');

test/server-side-rendering/index.js

@@ -21,7 +21,9 @@ function tryToReadFile(file) {
 
 describe("ssr", () => {
 	before(() => {
-		require("../../ssr/register");
+		require("../../ssr/register")({
+			extensions: ['.svelte', '.html']
+		});
 
 		return setupHtmlEqual();
 	});
@@ -41,7 +43,15 @@ describe("ssr", () => {
 		(solo ? it.only : it)(dir, () => {
 			dir = path.resolve("test/server-side-rendering/samples", dir);
 			try {
-				const component = require(`${dir}/main.html`);
+				let component;
+
+				const mainHtmlFile = `${dir}/main.html`;
+				const mainSvelteFile = `${dir}/main.svelte`;
+				if (fs.existsSync(mainHtmlFile)) {
+					component = require(mainHtmlFile);
+				} else if (fs.existsSync(mainSvelteFile)) {
+					component = require(mainSvelteFile);
+				}
 
 				const expectedHtml = tryToReadFile(`${dir}/_expected.html`);
 				const expectedCss = tryToReadFile(`${dir}/_expected.css`) || "";

test/server-side-rendering/samples/component-with-different-extension/Widget.svelte

@@ -0,0 +1 @@
+<p>i am a widget</p>

test/server-side-rendering/samples/component-with-different-extension/_expected.html

@@ -0,0 +1 @@
+<div><p>i am a widget</p></div>

test/server-side-rendering/samples/component-with-different-extension/main.svelte

@@ -0,0 +1,11 @@
+<div>
+	<Widget/>
+</div>
+
+<script>
+	import Widget from './Widget.svelte';
+
+	export default {
+		components: { Widget }
+	};
+</script>