Merge pull request #276 from sveltejs/gh-274

handle default parameters in computed values

Author: Rich-Harris

src/generators/Generator.js

@@ -246,7 +246,7 @@ export default class Generator {
 					const key = prop.key.name;
 					const value = prop.value;
 
-					const deps = value.params.map( param => param.name );
+					const deps = value.params.map( param => param.type === 'AssignmentPattern' ? param.left.name : param.name );
 					dependencies.set( key, deps );
 				});
 

src/generators/dom/index.js

@@ -185,19 +185,19 @@ export default function dom ( parsed, source, options, names ) {
 
 		computations.forEach( ({ key, deps }) => {
 			builder.addBlock( deindent`
-				if ( ${deps.map( dep => `( '${dep}' in newState && typeof state.${dep} === 'object' || state.${dep} !== oldState.${dep} )` ).join( ' || ' )} ) {
+				if ( isInitial || ${deps.map( dep => `( '${dep}' in newState && typeof state.${dep} === 'object' || state.${dep} !== oldState.${dep} )` ).join( ' || ' )} ) {
 					state.${key} = newState.${key} = template.computed.${key}( ${deps.map( dep => `state.${dep}` ).join( ', ' )} );
 				}
 			` );
 		});
 
 		builders.main.addBlock( deindent`
-			function applyComputations ( state, newState, oldState ) {
+			function applyComputations ( state, newState, oldState, isInitial ) {
 				${builder}
 			}
 		` );
 
-		builders._set.addLine( `applyComputations( this._state, newState, oldState )` );
+		builders._set.addLine( `applyComputations( this._state, newState, oldState, false )` );
 	}
 
 	// TODO is the `if` necessary?
@@ -277,7 +277,7 @@ export default function dom ( parsed, source, options, names ) {
 		function ${name} ( options ) {
 			options = options || {};
 			${generator.usesRefs ? `\nthis.refs = {}` : ``}
-			this._state = ${initialState};${templateProperties.computed ? `\napplyComputations( this._state, this._state, {} );` : ``}
+			this._state = ${initialState};${templateProperties.computed ? `\napplyComputations( this._state, this._state, {}, true );` : ``}
 
 			this._observers = {
 				pre: Object.create( null ),

test/generator/computed-values-default/_config.js

@@ -0,0 +1,9 @@
+export default {
+	html: '<p>2</p>',
+
+	test ( assert, component, target ) {
+		component.set({ a: 2 });
+		assert.equal( target.innerHTML, '<p>4</p>' );
+		component.teardown();
+	}
+};

test/generator/computed-values-default/main.html

@@ -0,0 +1,9 @@
+<p>{{foo}}</p>
+
+<script>
+	export default {
+		computed: {
+			foo: ( a = 1 ) => a * 2
+		}
+	};
+</script>

test/generator/computed-values/_config.js

@@ -5,5 +5,6 @@ export default {
 		assert.equal( component.get( 'c' ), 5 );
 		assert.equal( component.get( 'cSquared' ), 25 );
 		assert.equal( target.innerHTML, '<p>3 + 2 = 5</p>\n<p>5 * 5 = 25</p>' );
+		component.teardown();
 	}
 };