Merge pull request #353 from sveltejs/gh-109

[WIP] Node 4 compatibility

.eslintignore

@@ -1,2 +1,3 @@
 src/shared
 shared.js
+test/test.js

.travis.yml

@@ -1,5 +1,6 @@
 language: node_js
 node_js:
+  - "4"
   - "6"
   - "node"
 env:

mocha.coverage.opts

@@ -2,4 +2,4 @@
 --require reify
  --recursive
 ./**/__test__.js
-test/*.js
+test/*/index.js

mocha.opts

@@ -1,4 +1 @@
---require reify
---recursive
-./**/__test__.js
-test/*.js
+test/test.js

package.json

@@ -44,9 +44,17 @@
   },
   "devDependencies": {
     "acorn": "^4.0.4",
+    "babel": "^6.23.0",
+    "babel-core": "^6.23.1",
     "babel-plugin-istanbul": "^3.0.0",
-    "babel-plugin-transform-es2015-modules-commonjs": "^6.18.0",
-    "babel-register": "^6.18.0",
+    "babel-plugin-transform-es2015-arrow-functions": "^6.22.0",
+    "babel-plugin-transform-es2015-block-scoping": "^6.23.0",
+    "babel-plugin-transform-es2015-destructuring": "^6.23.0",
+    "babel-plugin-transform-es2015-modules-commonjs": "^6.23.0",
+    "babel-plugin-transform-es2015-parameters": "^6.23.0",
+    "babel-plugin-transform-es2015-spread": "^6.22.0",
+    "babel-preset-env": "^1.2.1",
+    "babel-register": "^6.23.0",
     "codecov": "^1.0.1",
     "console-group": "^0.3.2",
     "css-tree": "^1.0.0-alpha16",
@@ -54,6 +62,7 @@
     "eslint-plugin-import": "^2.2.0",
     "estree-walker": "^0.3.0",
     "fuzzyset.js": "0.0.1",
+    "glob": "^7.1.1",
     "jsdom": "^9.9.1",
     "locate-character": "^2.0.0",
     "mocha": "^3.2.0",
@@ -78,6 +87,11 @@
   },
   "babel": {
     "plugins": [
+      "transform-es2015-arrow-functions",
+      "transform-es2015-block-scoping",
+      "transform-es2015-spread",
+      "transform-es2015-parameters",
+      "transform-es2015-destructuring",
       "transform-es2015-modules-commonjs"
     ]
   }

rollup/rollup.config.main.js

@@ -1,6 +1,7 @@
 import nodeResolve from 'rollup-plugin-node-resolve';
 import commonjs from 'rollup-plugin-commonjs';
 import json from 'rollup-plugin-json';
+import buble from 'rollup-plugin-buble';
 
 export default {
 	entry: 'src/index.js',
@@ -11,7 +12,14 @@ export default {
 	plugins: [
 		nodeResolve({ jsnext: true, module: true }),
 		commonjs(),
-		json()
+		json(),
+		buble({
+			include: 'src/**',
+			exclude: 'src/shared/**',
+			transforms: {
+				dangerousTaggedTemplateString: true
+			}
+		})
 	],
 	external: [ 'magic-string' ],
 	globals: {

rollup/rollup.config.ssr.js

@@ -1,6 +1,7 @@
 import * as path from 'path';
 import nodeResolve from 'rollup-plugin-node-resolve';
 import commonjs from 'rollup-plugin-commonjs';
+import buble from 'rollup-plugin-buble';
 
 export default {
 	entry: 'src/server-side-rendering/register.js',
@@ -10,7 +11,14 @@ export default {
 	],
 	plugins: [
 		nodeResolve({ jsnext: true, module: true }),
-		commonjs()
+		commonjs(),
+		buble({
+			include: 'src/**',
+			exclude: 'src/shared/**',
+			transforms: {
+				dangerousTaggedTemplateString: true
+			}
+		})
 	],
 	external: [ path.resolve( 'src/index.js' ), 'fs', 'path', 'magic-string' ],
 	paths: {

src/generators/dom/visitors/Component.js

@@ -16,7 +16,7 @@ export default {
 			namespace: generator.current.namespace,
 			isComponent: true,
 
-			allUsedContexts: new Set(),
+			allUsedContexts: [],
 
 			init: new CodeBuilder(),
 			update: new CodeBuilder()
@@ -28,10 +28,8 @@ export default {
 
 		addComponentAttributes( generator, node, local );
 
-		if ( local.allUsedContexts.size ) {
-			const contextNames = [...local.allUsedContexts];
-
-			const initialProps = contextNames.map( contextName => {
+		if ( local.allUsedContexts.length ) {
+			const initialProps = local.allUsedContexts.map( contextName => {
 				if ( contextName === 'root' ) return `root: root`;
 
 				const listName = generator.current.listNames[ contextName ];
@@ -40,7 +38,7 @@ export default {
 				return `${listName}: ${listName},\n${indexName}: ${indexName}`;
 			}).join( ',\n' );
 
-			const updates = contextNames.map( contextName => {
+			const updates = local.allUsedContexts.map( contextName => {
 				if ( contextName === 'root' ) return `${name}._context.root = root;`;
 
 				const listName = generator.current.listNames[ contextName ];

src/generators/dom/visitors/Element.js

@@ -17,7 +17,7 @@ export default {
 			namespace: node.name === 'svg' ? 'http://www.w3.org/2000/svg' : generator.current.namespace,
 			isComponent: false,
 
-			allUsedContexts: new Set(),
+			allUsedContexts: [],
 
 			init: new CodeBuilder(),
 			update: new CodeBuilder()
@@ -27,10 +27,8 @@ export default {
 
 		addElementAttributes( generator, node, local );
 
-		if ( local.allUsedContexts.size ) {
-			const contextNames = [...local.allUsedContexts];
-
-			const initialProps = contextNames.map( contextName => {
+		if ( local.allUsedContexts.length ) {
+			const initialProps = local.allUsedContexts.map( contextName => {
 				if ( contextName === 'root' ) return `root: root`;
 
 				const listName = generator.current.listNames[ contextName ];
@@ -39,7 +37,7 @@ export default {
 				return `${listName}: ${listName},\n${indexName}: ${indexName}`;
 			}).join( ',\n' );
 
-			const updates = contextNames.map( contextName => {
+			const updates = local.allUsedContexts.map( contextName => {
 				if ( contextName === 'root' ) return `${name}.__svelte.root = root;`;
 
 				const listName = generator.current.listNames[ contextName ];

src/generators/dom/visitors/attributes/addComponentAttributes.js

@@ -82,18 +82,18 @@ export default function addComponentAttributes ( generator, node, local ) {
 			generator.addSourcemapLocations( attribute.expression );
 			generator.code.prependRight( attribute.expression.start, 'component.' );
 
-			const usedContexts = new Set();
+			const usedContexts = [];
 			attribute.expression.arguments.forEach( arg => {
 				const { contexts } = generator.contextualise( arg, true, true );
 
 				contexts.forEach( context => {
-					usedContexts.add( context );
-					local.allUsedContexts.add( context );
+					if ( !~usedContexts.indexOf( context ) ) usedContexts.push( context );
+					if ( !~local.allUsedContexts.indexOf( context ) ) local.allUsedContexts.push( context );
 				});
 			});
 
 			// TODO hoist event handlers? can do `this.__component.method(...)`
-			const declarations = [...usedContexts].map( name => {
+			const declarations = usedContexts.map( name => {
 				if ( name === 'root' ) return 'var root = this._context.root;';
 
 				const listName = generator.current.listNames[ name ];

src/generators/dom/visitors/attributes/addElementAttributes.js

@@ -155,18 +155,18 @@ export default function addElementAttributes ( generator, node, local ) {
 				generator.code.prependRight( attribute.expression.start, 'component.' );
 			}
 
-			const usedContexts = new Set();
+			const usedContexts = [];
 			attribute.expression.arguments.forEach( arg => {
 				const { contexts } = generator.contextualise( arg, true );
 
 				contexts.forEach( context => {
-					usedContexts.add( context );
-					local.allUsedContexts.add( context );
+					if ( !~usedContexts.indexOf( context ) ) usedContexts.push( context );
+					if ( !~local.allUsedContexts.indexOf( context ) ) local.allUsedContexts.push( context );
 				});
 			});
 
 			// TODO hoist event handlers? can do `this.__component.method(...)`
-			const declarations = [...usedContexts].map( name => {
+			const declarations = usedContexts.map( name => {
 				if ( name === 'root' ) return 'var root = this.__svelte.root;';
 
 				const listName = generator.current.listNames[ name ];

src/generators/dom/visitors/attributes/binding/index.js

@@ -8,7 +8,9 @@ export default function createBinding ( generator, node, attribute, current, loc
 	const deep = parts.length > 1;
 	const contextual = parts[0] in current.contexts;
 
-	if ( contextual ) local.allUsedContexts.add( parts[0] );
+	if ( contextual && !~local.allUsedContexts.indexOf( parts[0] ) ) {
+		local.allUsedContexts.push( parts[0] );
+	}
 
 	if ( local.isComponent ) {
 		let obj;
@@ -174,11 +176,11 @@ export default function createBinding ( generator, node, attribute, current, loc
 
 		node.initialUpdate = updateElement;
 
-		local.update.addLine(
-			`if ( !${local.name}_updating ) {
+		local.update.addLine( deindent`
+			if ( !${local.name}_updating ) {
 				${updateElement}
-			}`
-		);
+			}
+		` );
 
 		generator.current.builders.teardown.addLine( deindent`
 			${generator.helper( 'removeEventListener' )}( ${local.name}, '${eventName}', ${handler} );

src/parse/read/script.js

@@ -1,28 +1,14 @@
-import { parse, tokenizer } from 'acorn';
+import { parse } from 'acorn';
 import spaces from '../../utils/spaces.js';
 
+const scriptClosingTag = '<\/script>';
+
 export default function readScript ( parser, start, attributes ) {
 	const scriptStart = parser.index;
-	let scriptEnd = null;
-
-	for ( const token of tokenizer( parser.remaining() ) ) {
-		parser.index = scriptStart + token.end;
-		parser.allowWhitespace();
-
-		scriptEnd = parser.index;
-
-		if ( parser.eat( '/script>' ) ) {
-			// this happens with trailing comments!
-			scriptEnd -= 1;
-			break;
-		}
-
-		if ( parser.eat( '<\/script>' ) ) {
-			break;
-		}
-	}
+	const scriptEnd = parser.template.indexOf( scriptClosingTag, scriptStart );
 
 	const source = spaces( scriptStart ) + parser.template.slice( scriptStart, scriptEnd );
+	parser.index = scriptEnd + scriptClosingTag.length;
 
 	let ast;
 
@@ -38,7 +24,6 @@ export default function readScript ( parser, start, attributes ) {
 	if ( !ast.body.length ) return null;
 
 	ast.start = scriptStart;
-
 	return {
 		start,
 		end: parser.index,

test/create/index.js

@@ -1,6 +1,6 @@
-import deindent from '../src/utils/deindent.js';
+import deindent from '../../src/utils/deindent.js';
 import assert from 'assert';
-import { svelte } from './helpers.js';
+import { svelte } from '../helpers.js';
 
 describe( 'create', () => {
 	it( 'should return a component constructor', () => {

test/formats/index.js

@@ -1,6 +1,6 @@
-import deindent from '../src/utils/deindent.js';
+import deindent from '../../src/utils/deindent.js';
 import assert from 'assert';
-import { svelte, env, setupHtmlEqual } from './helpers.js';
+import { svelte, env, setupHtmlEqual } from '../helpers.js';
 
 function testAmd ( code, expectedId, dependencies, html ) {
 	const fn = new Function( 'define', code );

test/generator/index.js

@@ -1,10 +1,11 @@
-import spaces from '../src/utils/spaces.js';
+import spaces from '../../src/utils/spaces.js';
 import assert from 'assert';
 import * as path from 'path';
 import * as fs from 'fs';
 import * as acorn from 'acorn';
+import * as babel from 'babel-core';
 
-import { addLineNumbers, loadConfig, svelte, env, setupHtmlEqual } from './helpers.js';
+import { addLineNumbers, loadConfig, svelte, env, setupHtmlEqual } from '../helpers.js';
 
 let showCompiledCode = false;
 let compileOptions = null;
@@ -14,12 +15,18 @@ function getName ( filename ) {
 	return base[0].toUpperCase() + base.slice( 1 );
 }
 
+const nodeVersionMatch = /^v(\d)/.exec( process.version );
+const legacy = +nodeVersionMatch[1] < 6;
+const babelrc = require( '../../package.json' ).babel;
+
 require.extensions[ '.html' ] = function ( module, filename ) {
 	const options = Object.assign({ filename, name: getName( filename ) }, compileOptions );
-	const { code } = svelte.compile( fs.readFileSync( filename, 'utf-8' ), options );
+	let { code } = svelte.compile( fs.readFileSync( filename, 'utf-8' ), options );
 
 	if ( showCompiledCode ) console.log( addLineNumbers( code ) ); // eslint-disable-line no-console
 
+	if ( legacy ) code = babel.transform( code, babelrc ).code;
+
 	return module._compile( code, filename );
 };
 
@@ -29,7 +36,7 @@ describe( 'generate', () => {
 	function runTest ( dir, shared ) {
 		if ( dir[0] === '.' ) return;
 
-		const config = loadConfig( `./generator/${dir}/_config.js` );
+		const config = loadConfig( `./generator/samples/${dir}/_config.js` );
 
 		if ( config.solo && process.env.CI ) {
 			throw new Error( 'Forgot to remove `solo: true` from test' );
@@ -44,7 +51,7 @@ describe( 'generate', () => {
 			compileOptions.dev = config.dev;
 
 			try {
-				const source = fs.readFileSync( `test/generator/${dir}/main.html`, 'utf-8' );
+				const source = fs.readFileSync( `test/generator/samples/${dir}/main.html`, 'utf-8' );
 				compiled = svelte.compile( source, compileOptions );
 			} catch ( err ) {
 				if ( config.compileError ) {
@@ -76,7 +83,7 @@ describe( 'generate', () => {
 			let SvelteComponent;
 
 			try {
-				SvelteComponent = require( `./generator/${dir}/main.html` ).default;
+				SvelteComponent = require( `./samples/${dir}/main.html` ).default;
 			} catch ( err ) {
 				if ( !config.show ) console.log( addLineNumbers( code ) ); // eslint-disable-line no-console
 				throw err;
@@ -126,13 +133,13 @@ describe( 'generate', () => {
 	}
 
 	describe( 'inline helpers', () => {
-		fs.readdirSync( 'test/generator' ).forEach( dir => {
+		fs.readdirSync( 'test/generator/samples' ).forEach( dir => {
 			runTest( dir, null );
 		});
 	});
 
 	describe( 'shared helpers', () => {
-		fs.readdirSync( 'test/generator' ).forEach( dir => {
+		fs.readdirSync( 'test/generator/samples' ).forEach( dir => {
 			runTest( dir, path.resolve( 'shared.js' ) );
 		});
 	});