From 11e5bed1753b066b5ac85e3baa2b15f4730607f0 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Mon, 31 Dec 2018 13:35:17 -0500
Subject: [PATCH 01/23] add svelte/motion, implement tween function

---
 motion.mjs | 149 +++++++++++++++++++++++++++++++++++++++++++++++++++++
 1 file changed, 149 insertions(+)
 create mode 100644 motion.mjs

diff --git a/motion.mjs b/motion.mjs
new file mode 100644
index 0000000000..943e63e4cd
--- /dev/null
+++ b/motion.mjs
@@ -0,0 +1,149 @@
+import { writable } from './store';
+import { assign } from './internal';
+import { linear } from './easing';
+
+const tasks = new Set();
+let running = false;
+
+function run_tasks() {
+	tasks.forEach(task => {
+		if (!task[0]()) {
+			tasks.delete(task);
+			task[1]();
+		}
+	});
+
+	running = tasks.size > 0;
+	if (running) requestAnimationFrame(run_tasks);
+}
+
+function add_task(fn) {
+	let task;
+
+	if (!running) {
+		running = true;
+		requestAnimationFrame(run_tasks);
+	}
+
+	return {
+		promise: new Promise(fulfil => {
+			tasks.add(task = [fn, fulfil]);
+		}),
+		abort() {
+			tasks.delete(task);
+		}
+	};
+}
+
+function is_date(obj) {
+	return Object.prototype.toString.call(obj) === '[object Date]';
+}
+
+function get_interpolator(a, b) {
+	if (a === b || a !== a) return () => a;
+
+	const type = typeof a;
+
+	if (type !== typeof b || Array.isArray(a) !== Array.isArray(b)) {
+		throw new Error('Cannot interpolate values of different type');
+	}
+
+	if (Array.isArray(a)) {
+		const arr = b.map((bi, i) => {
+			return get_interpolator(a[i], bi);
+		});
+
+		return t => arr.map(fn => fn(t));
+	}
+
+	if (type === 'object') {
+		if (!a || !b) throw new Error('Object cannot be null');
+
+		if (is_date(a) && is_date(b)) {
+			a = a.getTime();
+			b = b.getTime();
+			const delta = b - a;
+			return t => new Date(a + t * delta);
+		}
+
+		const keys = Object.keys(b);
+		const interpolators = {};
+
+		keys.forEach(key => {
+			interpolators[key] = get_interpolator(a[key], b[key]);
+		});
+
+		return t => {
+			const result = {};
+			keys.forEach(key => {
+				result[key] = interpolators[key](t);
+			});
+			return result;
+		};
+	}
+
+	if (type === 'number') {
+		const delta = b - a;
+		return t => a + t * delta;
+	}
+
+	throw new Error(`Cannot interpolate ${type} values`);
+}
+
+export function tween(value, defaults = {}) {
+	const store = writable(value);
+
+	let task;
+	let target_value = value;
+
+	function set(new_value, opts) {
+		target_value = new_value;
+
+		let previous_task = task;
+		let started = false;
+
+		let {
+			delay = 0,
+			duration = 400,
+			easing = linear,
+			interpolate = get_interpolator
+		} = assign(assign({}, defaults), opts);
+
+		const start = window.performance.now() + delay;
+		let fn;
+
+		task = add_task(() => {
+			const time = window.performance.now();
+			if (time < start) return true;
+
+			if (!started) {
+				fn = interpolate(value, new_value);
+				if (typeof duration === 'function') duration = duration(value, new_value);
+				started = true;
+			}
+
+			if (previous_task) {
+				previous_task.abort();
+				previous_task = null;
+			}
+
+			const elapsed = time - start;
+
+			if (elapsed > duration) {
+				store.set(value = new_value);
+				return false;
+			}
+
+			store.set(value = fn(easing(elapsed / duration)));
+			return true;
+		});
+
+		return task.promise;
+	}
+
+	return {
+		set,
+		update: fn => set(fn(target_value, value)),
+		subscribe: store.subscribe
+	};
+}
\ No newline at end of file

From 9c6d81945d0db2f2b6b005e129e6523545f7f18f Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Mon, 31 Dec 2018 13:36:04 -0500
Subject: [PATCH 02/23] add motion.js

---
 .gitignore       | 1 +
 rollup.config.js | 2 +-
 2 files changed, 2 insertions(+), 1 deletion(-)

diff --git a/.gitignore b/.gitignore
index 71c1dad10b..380e562b06 100644
--- a/.gitignore
+++ b/.gitignore
@@ -8,6 +8,7 @@ node_modules
 /internal.*
 /store.js
 /easing.js
+/motion.js
 /transition.js
 /scratch/
 /coverage/
diff --git a/rollup.config.js b/rollup.config.js
index 7e1947ec4e..f0546fceb2 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -68,7 +68,7 @@ export default [
 	},
 
 	// runtime API
-	...['index', 'store', 'easing', 'transition'].map(name => ({
+	...['index', 'store', 'easing', 'motion', 'transition'].map(name => ({
 		input: `${name}.mjs`,
 		output: {
 			file: `${name}.js`,

From e195bb2b57dc11c17679a9d9da3b766c0ad0e8d4 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Mon, 31 Dec 2018 13:36:47 -0500
Subject: [PATCH 03/23] rename to tweened

---
 motion.mjs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/motion.mjs b/motion.mjs
index 943e63e4cd..07791a6883 100644
--- a/motion.mjs
+++ b/motion.mjs
@@ -90,7 +90,7 @@ function get_interpolator(a, b) {
 	throw new Error(`Cannot interpolate ${type} values`);
 }
 
-export function tween(value, defaults = {}) {
+export function tweened(value, defaults = {}) {
 	const store = writable(value);
 
 	let task;

From 203e6ae8c37699169a76450392d028dd5befd052 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Mon, 31 Dec 2018 16:43:08 -0500
Subject: [PATCH 04/23] implement spring

---
 motion.mjs | 156 ++++++++++++++++++++++++++++++++++++++++++++++++++++-
 1 file changed, 155 insertions(+), 1 deletion(-)

diff --git a/motion.mjs b/motion.mjs
index 07791a6883..3ac9f99167 100644
--- a/motion.mjs
+++ b/motion.mjs
@@ -143,7 +143,161 @@ export function tweened(value, defaults = {}) {
 
 	return {
 		set,
-		update: fn => set(fn(target_value, value)),
+		update: (fn, opts) => set(fn(target_value, value), opts),
 		subscribe: store.subscribe
 	};
+}
+
+function get_initial_velocity(value) {
+	if (typeof value === 'number' || is_date(value)) return 0;
+
+	if (Array.isArray(value)) return value.map(get_initial_velocity);
+
+	if (value && typeof value === 'object') {
+		const velocities = {};
+		for (const k in value) velocities[k] = get_initial_velocity(value[k]);
+		return velocities;
+	}
+
+	throw new Error(`Cannot spring ${typeof value} values`);
+}
+
+function get_threshold(value, target_value, precision) {
+	if (typeof value === 'number' || is_date(value)) return precision * Math.abs((target_value - value));
+
+	if (Array.isArray(value)) return value.map((v, i) => get_threshold(v, target_value[i], precision));
+
+	if (value && typeof value === 'object') {
+		const threshold = {};
+		for (const k in value) threshold[k] = get_threshold(value[k], target_value[k], precision);
+		return threshold;
+	}
+
+	throw new Error(`Cannot spring ${typeof value} values`);
+}
+
+function tick_spring(velocity, current_value, target_value, stiffness, damping, multiplier, threshold) {
+	let settled = true;
+	let value;
+
+	if (typeof current_value === 'number' || is_date(current_value)) {
+		const delta = target_value - current_value;
+		const spring = stiffness * delta;
+		const damper = damping * velocity;
+
+		const acceleration = spring - damper;
+
+		velocity += acceleration;
+		const d = velocity * multiplier;
+
+		if (is_date(current_value)) {
+			value = new Date(current_value.getTime() + d);
+		} else {
+			value = current_value + d;
+		}
+
+		if (Math.abs(d) > threshold) settled = false;
+	}
+
+	else if (Array.isArray(current_value)) {
+		value = current_value.map((v, i) => {
+			const result = tick_spring(
+				velocity[i],
+				v,
+				target_value[i],
+				stiffness,
+				damping,
+				multiplier,
+				threshold[i]
+			);
+
+			velocity[i] = result.velocity;
+			if (!result.settled) settled = false;
+			return result.value;
+		});
+	}
+
+	else if (typeof current_value === 'object') {
+		value = {};
+		for (const k in current_value) {
+			const result = tick_spring(
+				velocity[k],
+				current_value[k],
+				target_value[k],
+				stiffness,
+				damping,
+				multiplier,
+				threshold[k]
+			);
+
+			velocity[k] = result.velocity;
+			if (!result.settled) settled = false;
+			value[k] = result.value;
+		}
+	}
+
+	else {
+		throw new Error(`Cannot spring ${typeof value} values`);
+	}
+
+	return { velocity, value, settled };
+}
+
+export function spring(value, opts = {}) {
+	const store = writable(value);
+
+	const { stiffness = 0.15, damping = 0.8 } = opts;
+	const velocity = get_initial_velocity(value);
+
+	let task;
+	let target_value = value;
+	let last_time;
+	let settled;
+	let threshold;
+
+	function set(new_value) {
+		target_value = new_value;
+		threshold = get_threshold(value, target_value, 0.000001); // TODO make precision configurable?
+
+		if (!task) {
+			last_time = window.performance.now();
+			settled = false;
+
+			task = add_task(() => {
+				const time = window.performance.now();
+
+				({ value, settled } = tick_spring(
+					velocity,
+					value,
+					target_value,
+					spring.stiffness,
+					spring.damping,
+					(time - last_time) * 60 / 1000,
+					threshold
+				));
+
+				last_time = time;
+
+				if (settled) {
+					value = target_value;
+					task = null;
+				}
+
+				store.set(value);
+				return !settled;
+			});
+		}
+
+		return task.promise;
+	}
+
+	const spring = {
+		set,
+		update: (fn, opts) => set(fn(target_value, value), opts),
+		subscribe: store.subscribe,
+		stiffness,
+		damping
+	};
+
+	return spring;
 }
\ No newline at end of file

From ff076293838754285653490c6195cceb1ab16bb9 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Mon, 31 Dec 2018 16:47:35 -0500
Subject: [PATCH 05/23] remove unused opts

---
 motion.mjs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/motion.mjs b/motion.mjs
index 3ac9f99167..395c678366 100644
--- a/motion.mjs
+++ b/motion.mjs
@@ -293,7 +293,7 @@ export function spring(value, opts = {}) {
 
 	const spring = {
 		set,
-		update: (fn, opts) => set(fn(target_value, value), opts),
+		update: fn => set(fn(target_value, value)),
 		subscribe: store.subscribe,
 		stiffness,
 		damping

From 65dc6d693bf0aad1561fe933dab8d20476cc1eae Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Mon, 31 Dec 2018 17:13:36 -0500
Subject: [PATCH 06/23] move tweened and spring into separate modules

---
 .gitignore                         |   2 +-
 rollup.config.js                   |  18 ++++
 src/motion/index.js                |   2 +
 motion.mjs => src/motion/spring.js | 151 +----------------------------
 src/motion/tweened.js              | 113 +++++++++++++++++++++
 src/motion/utils.js                |  36 +++++++
 6 files changed, 172 insertions(+), 150 deletions(-)
 create mode 100644 src/motion/index.js
 rename motion.mjs => src/motion/spring.js (54%)
 create mode 100644 src/motion/tweened.js
 create mode 100644 src/motion/utils.js

diff --git a/.gitignore b/.gitignore
index 380e562b06..a999190ceb 100644
--- a/.gitignore
+++ b/.gitignore
@@ -8,7 +8,7 @@ node_modules
 /internal.*
 /store.js
 /easing.js
-/motion.js
+/motion.*
 /transition.js
 /scratch/
 /coverage/
diff --git a/rollup.config.js b/rollup.config.js
index f0546fceb2..9ba2b667ea 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -67,6 +67,24 @@ export default [
 		]
 	},
 
+	/* motion.[m]js */
+	{
+		input: 'src/motion/index.js',
+		output: [
+			{
+				file: 'motion.mjs',
+				format: 'esm',
+				paths: id => id.replace('svelte', '.')
+			},
+			{
+				file: 'motion.js',
+				format: 'cjs',
+				paths: id => id.replace('svelte', '.')
+			}
+		],
+		external: id => id.startsWith('svelte/')
+	},
+
 	// runtime API
 	...['index', 'store', 'easing', 'motion', 'transition'].map(name => ({
 		input: `${name}.mjs`,
diff --git a/src/motion/index.js b/src/motion/index.js
new file mode 100644
index 0000000000..e0e9bcf1ae
--- /dev/null
+++ b/src/motion/index.js
@@ -0,0 +1,2 @@
+export * from './spring.js';
+export * from './tweened.js';
\ No newline at end of file
diff --git a/motion.mjs b/src/motion/spring.js
similarity index 54%
rename from motion.mjs
rename to src/motion/spring.js
index 395c678366..ebac993f06 100644
--- a/motion.mjs
+++ b/src/motion/spring.js
@@ -1,152 +1,5 @@
-import { writable } from './store';
-import { assign } from './internal';
-import { linear } from './easing';
-
-const tasks = new Set();
-let running = false;
-
-function run_tasks() {
-	tasks.forEach(task => {
-		if (!task[0]()) {
-			tasks.delete(task);
-			task[1]();
-		}
-	});
-
-	running = tasks.size > 0;
-	if (running) requestAnimationFrame(run_tasks);
-}
-
-function add_task(fn) {
-	let task;
-
-	if (!running) {
-		running = true;
-		requestAnimationFrame(run_tasks);
-	}
-
-	return {
-		promise: new Promise(fulfil => {
-			tasks.add(task = [fn, fulfil]);
-		}),
-		abort() {
-			tasks.delete(task);
-		}
-	};
-}
-
-function is_date(obj) {
-	return Object.prototype.toString.call(obj) === '[object Date]';
-}
-
-function get_interpolator(a, b) {
-	if (a === b || a !== a) return () => a;
-
-	const type = typeof a;
-
-	if (type !== typeof b || Array.isArray(a) !== Array.isArray(b)) {
-		throw new Error('Cannot interpolate values of different type');
-	}
-
-	if (Array.isArray(a)) {
-		const arr = b.map((bi, i) => {
-			return get_interpolator(a[i], bi);
-		});
-
-		return t => arr.map(fn => fn(t));
-	}
-
-	if (type === 'object') {
-		if (!a || !b) throw new Error('Object cannot be null');
-
-		if (is_date(a) && is_date(b)) {
-			a = a.getTime();
-			b = b.getTime();
-			const delta = b - a;
-			return t => new Date(a + t * delta);
-		}
-
-		const keys = Object.keys(b);
-		const interpolators = {};
-
-		keys.forEach(key => {
-			interpolators[key] = get_interpolator(a[key], b[key]);
-		});
-
-		return t => {
-			const result = {};
-			keys.forEach(key => {
-				result[key] = interpolators[key](t);
-			});
-			return result;
-		};
-	}
-
-	if (type === 'number') {
-		const delta = b - a;
-		return t => a + t * delta;
-	}
-
-	throw new Error(`Cannot interpolate ${type} values`);
-}
-
-export function tweened(value, defaults = {}) {
-	const store = writable(value);
-
-	let task;
-	let target_value = value;
-
-	function set(new_value, opts) {
-		target_value = new_value;
-
-		let previous_task = task;
-		let started = false;
-
-		let {
-			delay = 0,
-			duration = 400,
-			easing = linear,
-			interpolate = get_interpolator
-		} = assign(assign({}, defaults), opts);
-
-		const start = window.performance.now() + delay;
-		let fn;
-
-		task = add_task(() => {
-			const time = window.performance.now();
-			if (time < start) return true;
-
-			if (!started) {
-				fn = interpolate(value, new_value);
-				if (typeof duration === 'function') duration = duration(value, new_value);
-				started = true;
-			}
-
-			if (previous_task) {
-				previous_task.abort();
-				previous_task = null;
-			}
-
-			const elapsed = time - start;
-
-			if (elapsed > duration) {
-				store.set(value = new_value);
-				return false;
-			}
-
-			store.set(value = fn(easing(elapsed / duration)));
-			return true;
-		});
-
-		return task.promise;
-	}
-
-	return {
-		set,
-		update: (fn, opts) => set(fn(target_value, value), opts),
-		subscribe: store.subscribe
-	};
-}
+import { writable } from 'svelte/store';
+import { add_task, is_date } from './utils.js';
 
 function get_initial_velocity(value) {
 	if (typeof value === 'number' || is_date(value)) return 0;
diff --git a/src/motion/tweened.js b/src/motion/tweened.js
new file mode 100644
index 0000000000..020378408c
--- /dev/null
+++ b/src/motion/tweened.js
@@ -0,0 +1,113 @@
+import { writable } from 'svelte/store';
+import { assign } from 'svelte/internal';
+import { linear } from 'svelte/easing';
+import { add_task, is_date } from './utils.js';
+
+function get_interpolator(a, b) {
+	if (a === b || a !== a) return () => a;
+
+	const type = typeof a;
+
+	if (type !== typeof b || Array.isArray(a) !== Array.isArray(b)) {
+		throw new Error('Cannot interpolate values of different type');
+	}
+
+	if (Array.isArray(a)) {
+		const arr = b.map((bi, i) => {
+			return get_interpolator(a[i], bi);
+		});
+
+		return t => arr.map(fn => fn(t));
+	}
+
+	if (type === 'object') {
+		if (!a || !b) throw new Error('Object cannot be null');
+
+		if (is_date(a) && is_date(b)) {
+			a = a.getTime();
+			b = b.getTime();
+			const delta = b - a;
+			return t => new Date(a + t * delta);
+		}
+
+		const keys = Object.keys(b);
+		const interpolators = {};
+
+		keys.forEach(key => {
+			interpolators[key] = get_interpolator(a[key], b[key]);
+		});
+
+		return t => {
+			const result = {};
+			keys.forEach(key => {
+				result[key] = interpolators[key](t);
+			});
+			return result;
+		};
+	}
+
+	if (type === 'number') {
+		const delta = b - a;
+		return t => a + t * delta;
+	}
+
+	throw new Error(`Cannot interpolate ${type} values`);
+}
+
+export function tweened(value, defaults = {}) {
+	const store = writable(value);
+
+	let task;
+	let target_value = value;
+
+	function set(new_value, opts) {
+		target_value = new_value;
+
+		let previous_task = task;
+		let started = false;
+
+		let {
+			delay = 0,
+			duration = 400,
+			easing = linear,
+			interpolate = get_interpolator
+		} = assign(assign({}, defaults), opts);
+
+		const start = window.performance.now() + delay;
+		let fn;
+
+		task = add_task(() => {
+			const time = window.performance.now();
+			if (time < start) return true;
+
+			if (!started) {
+				fn = interpolate(value, new_value);
+				if (typeof duration === 'function') duration = duration(value, new_value);
+				started = true;
+			}
+
+			if (previous_task) {
+				previous_task.abort();
+				previous_task = null;
+			}
+
+			const elapsed = time - start;
+
+			if (elapsed > duration) {
+				store.set(value = new_value);
+				return false;
+			}
+
+			store.set(value = fn(easing(elapsed / duration)));
+			return true;
+		});
+
+		return task.promise;
+	}
+
+	return {
+		set,
+		update: (fn, opts) => set(fn(target_value, value), opts),
+		subscribe: store.subscribe
+	};
+}
\ No newline at end of file
diff --git a/src/motion/utils.js b/src/motion/utils.js
new file mode 100644
index 0000000000..986cec3ef4
--- /dev/null
+++ b/src/motion/utils.js
@@ -0,0 +1,36 @@
+const tasks = new Set();
+let running = false;
+
+function run_tasks() {
+	tasks.forEach(task => {
+		if (!task[0]()) {
+			tasks.delete(task);
+			task[1]();
+		}
+	});
+
+	running = tasks.size > 0;
+	if (running) requestAnimationFrame(run_tasks);
+}
+
+export function add_task(fn) {
+	let task;
+
+	if (!running) {
+		running = true;
+		requestAnimationFrame(run_tasks);
+	}
+
+	return {
+		promise: new Promise(fulfil => {
+			tasks.add(task = [fn, fulfil]);
+		}),
+		abort() {
+			tasks.delete(task);
+		}
+	};
+}
+
+export function is_date(obj) {
+	return Object.prototype.toString.call(obj) === '[object Date]';
+}
\ No newline at end of file

From d58996534dd46be80311df0f8e2b5cb2266a2da9 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Mon, 31 Dec 2018 17:45:07 -0500
Subject: [PATCH 07/23] start centralising rAF stuff

---
 src/internal/animations.js  | 31 +++++++++++++++-
 src/internal/index.js       |  1 +
 src/internal/loop.js        | 38 +++++++++++++++++++
 src/internal/transitions.js | 74 +++++++++++++++----------------------
 src/motion/spring.js        |  5 ++-
 src/motion/tweened.js       |  6 +--
 src/motion/utils.js         | 33 -----------------
 test/runtime/index.js       |  3 +-
 8 files changed, 107 insertions(+), 84 deletions(-)
 create mode 100644 src/internal/loop.js

diff --git a/src/internal/animations.js b/src/internal/animations.js
index 355c0254e7..031bacc920 100644
--- a/src/internal/animations.js
+++ b/src/internal/animations.js
@@ -1,4 +1,5 @@
 import { transitionManager, linear, generateRule, hash } from './transitions.js';
+import { loop } from './loop.js';
 
 export function wrapAnimation(node, from, fn, params) {
 	if (!from) return;
@@ -68,7 +69,35 @@ export function wrapAnimation(node, from, fn, params) {
 		}
 	};
 
-	transitionManager.add(animation);
+	// transitionManager.add(animation);
+
+	transitionManager.active += 1;
+
+	const { abort, promise } = loop(() => {
+		const now = window.performance.now();
+
+		if (animation.program && now >= animation.program.end) {
+			animation.done();
+		}
+
+		if (animation.pending && now >= animation.pending.start) {
+			animation.start(animation.pending);
+		}
+
+		if (animation.running) {
+			animation.update(now);
+			return true;
+		}
+	});
+
+	promise.then(() => {
+		transitionManager.active -= 1;
+		if (!transitionManager.active) {
+			let i = transitionManager.stylesheet.cssRules.length;
+			while (i--) transitionManager.stylesheet.deleteRule(i);
+			transitionManager.activeRules = {};
+		}
+	});
 
 	if (info.tick) info.tick(0, 1);
 
diff --git a/src/internal/index.js b/src/internal/index.js
index 6b134b677d..f3654f6b77 100644
--- a/src/internal/index.js
+++ b/src/internal/index.js
@@ -3,6 +3,7 @@ export * from './await-block.js';
 export * from './dom.js';
 export * from './keyed-each.js';
 export * from './lifecycle.js';
+export * from './loop.js';
 export * from './scheduler.js';
 export * from './spread.js';
 export * from './ssr.js';
diff --git a/src/internal/loop.js b/src/internal/loop.js
new file mode 100644
index 0000000000..602a910cba
--- /dev/null
+++ b/src/internal/loop.js
@@ -0,0 +1,38 @@
+const tasks = new Set();
+let running = false;
+
+function run_tasks() {
+	tasks.forEach(task => {
+		if (!task[0]()) {
+			tasks.delete(task);
+			task[1]();
+		}
+	});
+
+	running = tasks.size > 0;
+	if (running) requestAnimationFrame(run_tasks);
+}
+
+export function clear_loops() {
+	// for testing...
+	tasks.forEach(task => tasks.delete(task));
+	running = false;
+}
+
+export function loop(fn) {
+	let task;
+
+	if (!running) {
+		running = true;
+		requestAnimationFrame(run_tasks);
+	}
+
+	return {
+		promise: new Promise(fulfil => {
+			tasks.add(task = [fn, fulfil]);
+		}),
+		abort() {
+			tasks.delete(task);
+		}
+	};
+}
\ No newline at end of file
diff --git a/src/internal/transitions.js b/src/internal/transitions.js
index 98418556a0..f90fa3d590 100644
--- a/src/internal/transitions.js
+++ b/src/internal/transitions.js
@@ -1,5 +1,6 @@
 import { createElement } from './dom.js';
 import { noop, run } from './utils.js';
+import { loop } from './loop.js';
 
 export function linear(t) {
 	return t;
@@ -83,8 +84,35 @@ export function wrapTransition(component, node, fn, params, intro) {
 			}
 
 			if (!this.running) {
+				transitionManager.active += 1;
+
 				this.running = true;
-				transitionManager.add(this);
+				// transitionManager.add(this);
+				const { abort, promise } = loop(() => {
+					const now = window.performance.now();
+
+					if (this.program && now >= this.program.end) {
+						this.done();
+					}
+
+					if (this.pending && now >= this.pending.start) {
+						this.start(this.pending);
+					}
+
+					if (this.running) {
+						this.update(now);
+						return true;
+					}
+				});
+
+				promise.then(() => {
+					transitionManager.active -= 1;
+					if (!transitionManager.active) {
+						let i = transitionManager.stylesheet.cssRules.length;
+						while (i--) transitionManager.stylesheet.deleteRule(i);
+						transitionManager.activeRules = {};
+					}
+				});
 			}
 		},
 
@@ -173,6 +201,7 @@ export function groupOutros() {
 }
 
 export var transitionManager = {
+	active: 0,
 	running: false,
 	transitions: [],
 	bound: null,
@@ -180,15 +209,6 @@ export var transitionManager = {
 	activeRules: {},
 	promise: null,
 
-	add(transition) {
-		this.transitions.push(transition);
-
-		if (!this.running) {
-			this.running = true;
-			requestAnimationFrame(this.bound || (this.bound = this.next.bind(this)));
-		}
-	},
-
 	addRule(rule, name) {
 		if (!this.stylesheet) {
 			const style = createElement('style');
@@ -202,40 +222,6 @@ export var transitionManager = {
 		}
 	},
 
-	next() {
-		this.running = false;
-
-		const now = window.performance.now();
-		let i = this.transitions.length;
-
-		while (i--) {
-			const transition = this.transitions[i];
-
-			if (transition.program && now >= transition.program.end) {
-				transition.done();
-			}
-
-			if (transition.pending && now >= transition.pending.start) {
-				transition.start(transition.pending);
-			}
-
-			if (transition.running) {
-				transition.update(now);
-				this.running = true;
-			} else if (!transition.pending) {
-				this.transitions.splice(i, 1);
-			}
-		}
-
-		if (this.running) {
-			requestAnimationFrame(this.bound);
-		} else if (this.stylesheet) {
-			let i = this.stylesheet.cssRules.length;
-			while (i--) this.stylesheet.deleteRule(i);
-			this.activeRules = {};
-		}
-	},
-
 	deleteRule(node, name) {
 		node.style.animation = node.style.animation
 			.split(', ')
diff --git a/src/motion/spring.js b/src/motion/spring.js
index ebac993f06..7d68377bd0 100644
--- a/src/motion/spring.js
+++ b/src/motion/spring.js
@@ -1,5 +1,6 @@
 import { writable } from 'svelte/store';
-import { add_task, is_date } from './utils.js';
+import { loop } from 'svelte/internal';
+import { is_date } from './utils.js';
 
 function get_initial_velocity(value) {
 	if (typeof value === 'number' || is_date(value)) return 0;
@@ -116,7 +117,7 @@ export function spring(value, opts = {}) {
 			last_time = window.performance.now();
 			settled = false;
 
-			task = add_task(() => {
+			task = loop(() => {
 				const time = window.performance.now();
 
 				({ value, settled } = tick_spring(
diff --git a/src/motion/tweened.js b/src/motion/tweened.js
index 020378408c..21ff8f70c7 100644
--- a/src/motion/tweened.js
+++ b/src/motion/tweened.js
@@ -1,7 +1,7 @@
 import { writable } from 'svelte/store';
-import { assign } from 'svelte/internal';
+import { assign, loop } from 'svelte/internal';
 import { linear } from 'svelte/easing';
-import { add_task, is_date } from './utils.js';
+import { is_date } from './utils.js';
 
 function get_interpolator(a, b) {
 	if (a === b || a !== a) return () => a;
@@ -76,7 +76,7 @@ export function tweened(value, defaults = {}) {
 		const start = window.performance.now() + delay;
 		let fn;
 
-		task = add_task(() => {
+		task = loop(() => {
 			const time = window.performance.now();
 			if (time < start) return true;
 
diff --git a/src/motion/utils.js b/src/motion/utils.js
index 986cec3ef4..97a764bf46 100644
--- a/src/motion/utils.js
+++ b/src/motion/utils.js
@@ -1,36 +1,3 @@
-const tasks = new Set();
-let running = false;
-
-function run_tasks() {
-	tasks.forEach(task => {
-		if (!task[0]()) {
-			tasks.delete(task);
-			task[1]();
-		}
-	});
-
-	running = tasks.size > 0;
-	if (running) requestAnimationFrame(run_tasks);
-}
-
-export function add_task(fn) {
-	let task;
-
-	if (!running) {
-		running = true;
-		requestAnimationFrame(run_tasks);
-	}
-
-	return {
-		promise: new Promise(fulfil => {
-			tasks.add(task = [fn, fulfil]);
-		}),
-		abort() {
-			tasks.delete(task);
-		}
-	};
-}
-
 export function is_date(obj) {
 	return Object.prototype.toString.call(obj) === '[object Date]';
 }
\ No newline at end of file
diff --git a/test/runtime/index.js b/test/runtime/index.js
index 88e2d0fe84..5569b444d1 100644
--- a/test/runtime/index.js
+++ b/test/runtime/index.js
@@ -3,7 +3,7 @@ import * as path from "path";
 import * as fs from "fs";
 import { rollup } from 'rollup';
 import * as virtual from 'rollup-plugin-virtual';
-import { transitionManager } from "../../internal.js";
+import { transitionManager, clear_loops } from "../../internal.js";
 
 import {
 	showOutput,
@@ -96,6 +96,7 @@ describe("runtime", () => {
 					// set of hacks to support transition tests
 					transitionManager.running = false;
 					transitionManager.transitions = [];
+					clear_loops();
 
 					const raf = {
 						time: 0,

From f746031f96e77e14f9251a8660b5ab3c8970e500 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Mon, 31 Dec 2018 19:56:50 -0500
Subject: [PATCH 08/23] tweak some config etc

---
 easing.mjs       |  6 ++----
 rollup.config.js | 38 ++++++++++++--------------------------
 2 files changed, 14 insertions(+), 30 deletions(-)

diff --git a/easing.mjs b/easing.mjs
index 855713b03d..23579da891 100644
--- a/easing.mjs
+++ b/easing.mjs
@@ -3,6 +3,8 @@ Adapted from https://github.com/mattdesl
 Distributed under MIT License https://github.com/mattdesl/eases/blob/master/LICENSE.md
 */
 
+import { identity as linear } from 'svelte/internal';
+
 export function backInOut(t) {
 	var s = 1.70158 * 1.525;
 	if ((t *= 2) < 1) return 0.5 * (t * t * ((s + 1) * t - s));
@@ -112,10 +114,6 @@ export function expoOut(t) {
 	return t === 1.0 ? t : 1.0 - Math.pow(2.0, -10.0 * t);
 }
 
-export function linear(t) {
-	return t;
-}
-
 export function quadInOut(t) {
 	t /= 0.5;
 	if (t < 1) return 0.5 * t * t;
diff --git a/rollup.config.js b/rollup.config.js
index 9ba2b667ea..6f15775016 100644
--- a/rollup.config.js
+++ b/rollup.config.js
@@ -52,45 +52,31 @@ export default [
 		experimentalCodeSplitting: true
 	},
 
-	/* internal.[m]js */
-	{
-		input: 'src/internal/index.js',
+	/* internal.[m]js, motion.mjs */
+	...['internal', 'motion'].map(name => ({
+		input: `src/${name}/index.js`,
 		output: [
 			{
-				file: 'internal.mjs',
-				format: 'esm'
-			},
-			{
-				file: 'internal.js',
-				format: 'cjs'
-			}
-		]
-	},
-
-	/* motion.[m]js */
-	{
-		input: 'src/motion/index.js',
-		output: [
-			{
-				file: 'motion.mjs',
+				file: `${name}.mjs`,
 				format: 'esm',
-				paths: id => id.replace('svelte', '.')
+				paths: id => id.startsWith('svelte/') && id.replace('svelte', '.')
 			},
 			{
-				file: 'motion.js',
+				file: `${name}.js`,
 				format: 'cjs',
-				paths: id => id.replace('svelte', '.')
+				paths: id => id.startsWith('svelte/') && id.replace('svelte', '.')
 			}
 		],
 		external: id => id.startsWith('svelte/')
-	},
+	})),
 
-	// runtime API
-	...['index', 'store', 'easing', 'motion', 'transition'].map(name => ({
+	// everything else
+	...['index', 'store', 'easing', 'transition'].map(name => ({
 		input: `${name}.mjs`,
 		output: {
 			file: `${name}.js`,
-			format: 'cjs'
+			format: 'cjs',
+			paths: id => id.startsWith('svelte/') && id.replace('svelte', '.')
 		},
 		external: id => id !== `${name}.mjs`
 	}))

From 8d1afbb3d4916353ff674f14f053c4cee07ef1b4 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Mon, 31 Dec 2018 20:06:19 -0500
Subject: [PATCH 09/23] shuffle things around a bit

---
 src/internal/animations.js    | 23 +++--------
 src/internal/style_manager.js | 50 +++++++++++++++++++++++
 src/internal/transitions.js   | 74 ++++++-----------------------------
 3 files changed, 68 insertions(+), 79 deletions(-)
 create mode 100644 src/internal/style_manager.js

diff --git a/src/internal/animations.js b/src/internal/animations.js
index 031bacc920..bcefc9c069 100644
--- a/src/internal/animations.js
+++ b/src/internal/animations.js
@@ -1,5 +1,7 @@
-import { transitionManager, linear, generateRule, hash } from './transitions.js';
+import { identity as linear } from './utils.js';
+import { hash } from './transitions.js';
 import { loop } from './loop.js';
+import { add_rule, delete_rule, generate_rule } from './style_manager.js';
 
 export function wrapAnimation(node, from, fn, params) {
 	if (!from) return;
@@ -36,10 +38,10 @@ export function wrapAnimation(node, from, fn, params) {
 			if (info.css) {
 				if (delay) node.style.cssText = cssText;
 
-				const rule = generateRule(program, ease, info.css);
+				const rule = generate_rule(program, ease, info.css);
 				program.name = `__svelte_${hash(rule)}`;
 
-				transitionManager.addRule(rule, program.name);
+				add_rule(rule, program.name);
 
 				node.style.animation = (node.style.animation || '')
 					.split(', ')
@@ -64,15 +66,11 @@ export function wrapAnimation(node, from, fn, params) {
 		},
 
 		stop() {
-			if (info.css) transitionManager.deleteRule(node, program.name);
+			if (info.css) delete_rule(node, program.name);
 			animation.running = false;
 		}
 	};
 
-	// transitionManager.add(animation);
-
-	transitionManager.active += 1;
-
 	const { abort, promise } = loop(() => {
 		const now = window.performance.now();
 
@@ -90,15 +88,6 @@ export function wrapAnimation(node, from, fn, params) {
 		}
 	});
 
-	promise.then(() => {
-		transitionManager.active -= 1;
-		if (!transitionManager.active) {
-			let i = transitionManager.stylesheet.cssRules.length;
-			while (i--) transitionManager.stylesheet.deleteRule(i);
-			transitionManager.activeRules = {};
-		}
-	});
-
 	if (info.tick) info.tick(0, 1);
 
 	if (delay) {
diff --git a/src/internal/style_manager.js b/src/internal/style_manager.js
new file mode 100644
index 0000000000..f444b216d6
--- /dev/null
+++ b/src/internal/style_manager.js
@@ -0,0 +1,50 @@
+import { createElement } from './dom.js';
+
+let stylesheet;
+let active = 0;
+let current_rules = {};
+
+export function add_rule(rule, name) {
+	if (!stylesheet) {
+		const style = createElement('style');
+		document.head.appendChild(style);
+		stylesheet = style.sheet;
+	}
+
+	active += 1;
+	console.log(`adding rule`, active);
+
+	if (!current_rules[name]) {
+		current_rules[name] = true;
+		stylesheet.insertRule(`@keyframes ${name} ${rule}`, stylesheet.cssRules.length);
+	}
+}
+
+export function delete_rule(node, name) {
+	node.style.animation = node.style.animation
+		.split(', ')
+		.filter(anim => anim && anim.indexOf(name) === -1)
+		.join(', ');
+
+	console.trace(`removing rule`, active - 1);
+	if (--active <= 0) clear_rules();
+}
+
+export function generate_rule({ a, b, delta, duration }, ease, fn) {
+	const step = 16.666 / duration;
+	let keyframes = '{\n';
+
+	for (let p = 0; p <= 1; p += step) {
+		const t = a + delta * ease(p);
+		keyframes += p * 100 + `%{${fn(t, 1 - t)}}\n`;
+	}
+
+	return keyframes + `100% {${fn(b, 1 - b)}}\n}`;
+}
+
+export function clear_rules() {
+	let i = stylesheet.cssRules.length;
+	console.log(`clearing ${i} rules`);
+	while (i--) stylesheet.deleteRule(i);
+	current_rules = {};
+}
\ No newline at end of file
diff --git a/src/internal/transitions.js b/src/internal/transitions.js
index f90fa3d590..b7f3be163d 100644
--- a/src/internal/transitions.js
+++ b/src/internal/transitions.js
@@ -1,22 +1,6 @@
-import { createElement } from './dom.js';
-import { noop, run } from './utils.js';
+import { identity as linear, noop, run } from './utils.js';
 import { loop } from './loop.js';
-
-export function linear(t) {
-	return t;
-}
-
-export function generateRule({ a, b, delta, duration }, ease, fn) {
-	const step = 16.666 / duration;
-	let keyframes = '{\n';
-
-	for (let p = 0; p <= 1; p += step) {
-		const t = a + delta * ease(p);
-		keyframes += p * 100 + `%{${fn(t, 1 - t)}}\n`;
-	}
-
-	return keyframes + `100% {${fn(b, 1 - b)}}\n}`;
-}
+import { add_rule, delete_rule, generate_rule } from './style_manager.js';
 
 // https://github.com/darkskyapp/string-hash/blob/master/index.js
 export function hash(str) {
@@ -84,10 +68,8 @@ export function wrapTransition(component, node, fn, params, intro) {
 			}
 
 			if (!this.running) {
-				transitionManager.active += 1;
-
 				this.running = true;
-				// transitionManager.add(this);
+
 				const { abort, promise } = loop(() => {
 					const now = window.performance.now();
 
@@ -104,15 +86,6 @@ export function wrapTransition(component, node, fn, params, intro) {
 						return true;
 					}
 				});
-
-				promise.then(() => {
-					transitionManager.active -= 1;
-					if (!transitionManager.active) {
-						let i = transitionManager.stylesheet.cssRules.length;
-						while (i--) transitionManager.stylesheet.deleteRule(i);
-						transitionManager.activeRules = {};
-					}
-				});
 			}
 		},
 
@@ -127,8 +100,8 @@ export function wrapTransition(component, node, fn, params, intro) {
 			if (obj.css) {
 				if (obj.delay) node.style.cssText = cssText;
 
-				const rule = generateRule(program, ease, obj.css);
-				transitionManager.addRule(rule, program.name = '__svelte_' + hash(rule));
+				const rule = generate_rule(program, ease, obj.css);
+				add_rule(rule, program.name = '__svelte_' + hash(rule));
 
 				node.style.animation = (node.style.animation || '')
 					.split(', ')
@@ -152,6 +125,8 @@ export function wrapTransition(component, node, fn, params, intro) {
 
 		done() {
 			const program = this.program;
+			this.program = null;
+
 			this.t = program.b;
 
 			if (obj.tick) obj.tick(this.t, 1 - this.t);
@@ -161,23 +136,24 @@ export function wrapTransition(component, node, fn, params, intro) {
 			if (!program.b && !program.invalidated) {
 				program.group.callbacks.push(() => {
 					program.callback();
-					if (obj.css) transitionManager.deleteRule(node, program.name);
+					if (obj.css) delete_rule(node, program.name);
 				});
 
 				if (--program.group.remaining === 0) {
 					program.group.callbacks.forEach(run);
 				}
 			} else {
-				if (obj.css) transitionManager.deleteRule(node, program.name);
+				if (obj.css) delete_rule(node, program.name);
 			}
 
 			this.running = !!this.pending;
 		},
 
 		abort(reset) {
+			if (reset && obj.tick) obj.tick(1, 0);
+
 			if (this.program) {
-				if (reset && obj.tick) obj.tick(1, 0);
-				if (obj.css) transitionManager.deleteRule(node, this.program.name);
+				if (obj.css) delete_rule(node, this.program.name);
 				this.program = this.pending = null;
 				this.running = false;
 			}
@@ -201,34 +177,8 @@ export function groupOutros() {
 }
 
 export var transitionManager = {
-	active: 0,
-	running: false,
-	transitions: [],
-	bound: null,
-	stylesheet: null,
-	activeRules: {},
 	promise: null,
 
-	addRule(rule, name) {
-		if (!this.stylesheet) {
-			const style = createElement('style');
-			document.head.appendChild(style);
-			transitionManager.stylesheet = style.sheet;
-		}
-
-		if (!this.activeRules[name]) {
-			this.activeRules[name] = true;
-			this.stylesheet.insertRule(`@keyframes ${name} ${rule}`, this.stylesheet.cssRules.length);
-		}
-	},
-
-	deleteRule(node, name) {
-		node.style.animation = node.style.animation
-			.split(', ')
-			.filter(anim => anim && anim.indexOf(name) === -1)
-			.join(', ');
-	},
-
 	wait() {
 		if (!transitionManager.promise) {
 			transitionManager.promise = Promise.resolve();

From 15b054f6a7b3fa1765ec4c642925827afa56e55f Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Mon, 31 Dec 2018 20:15:22 -0500
Subject: [PATCH 10/23] refactor some stuff

---
 src/internal/animations.js    |  8 ++----
 src/internal/style_manager.js | 48 ++++++++++++++++++++---------------
 src/internal/transitions.js   | 14 ++--------
 3 files changed, 31 insertions(+), 39 deletions(-)

diff --git a/src/internal/animations.js b/src/internal/animations.js
index bcefc9c069..2936b67f81 100644
--- a/src/internal/animations.js
+++ b/src/internal/animations.js
@@ -1,7 +1,6 @@
 import { identity as linear } from './utils.js';
-import { hash } from './transitions.js';
 import { loop } from './loop.js';
-import { add_rule, delete_rule, generate_rule } from './style_manager.js';
+import { create_rule, delete_rule } from './style_manager.js';
 
 export function wrapAnimation(node, from, fn, params) {
 	if (!from) return;
@@ -38,10 +37,7 @@ export function wrapAnimation(node, from, fn, params) {
 			if (info.css) {
 				if (delay) node.style.cssText = cssText;
 
-				const rule = generate_rule(program, ease, info.css);
-				program.name = `__svelte_${hash(rule)}`;
-
-				add_rule(rule, program.name);
+				program.name = create_rule(program, ease, info.css);
 
 				node.style.animation = (node.style.animation || '')
 					.split(', ')
diff --git a/src/internal/style_manager.js b/src/internal/style_manager.js
index f444b216d6..6af5c091ed 100644
--- a/src/internal/style_manager.js
+++ b/src/internal/style_manager.js
@@ -4,20 +4,40 @@ let stylesheet;
 let active = 0;
 let current_rules = {};
 
-export function add_rule(rule, name) {
-	if (!stylesheet) {
-		const style = createElement('style');
-		document.head.appendChild(style);
-		stylesheet = style.sheet;
+// https://github.com/darkskyapp/string-hash/blob/master/index.js
+function hash(str) {
+	let hash = 5381;
+	let i = str.length;
+
+	while (i--) hash = ((hash << 5) - hash) ^ str.charCodeAt(i);
+	return hash >>> 0;
+}
+
+export function create_rule({ a, b, delta, duration }, ease, fn) {
+	const step = 16.666 / duration;
+	let keyframes = '{\n';
+
+	for (let p = 0; p <= 1; p += step) {
+		const t = a + delta * ease(p);
+		keyframes += p * 100 + `%{${fn(t, 1 - t)}}\n`;
 	}
 
-	active += 1;
-	console.log(`adding rule`, active);
+	const rule = keyframes + `100% {${fn(b, 1 - b)}}\n}`;
+	const name = `__svelte_${hash(rule)}`;
 
 	if (!current_rules[name]) {
+		if (!stylesheet) {
+			const style = createElement('style');
+			document.head.appendChild(style);
+			stylesheet = style.sheet;
+		}
+
 		current_rules[name] = true;
 		stylesheet.insertRule(`@keyframes ${name} ${rule}`, stylesheet.cssRules.length);
 	}
+
+	active += 1;
+	return name;
 }
 
 export function delete_rule(node, name) {
@@ -26,25 +46,11 @@ export function delete_rule(node, name) {
 		.filter(anim => anim && anim.indexOf(name) === -1)
 		.join(', ');
 
-	console.trace(`removing rule`, active - 1);
 	if (--active <= 0) clear_rules();
 }
 
-export function generate_rule({ a, b, delta, duration }, ease, fn) {
-	const step = 16.666 / duration;
-	let keyframes = '{\n';
-
-	for (let p = 0; p <= 1; p += step) {
-		const t = a + delta * ease(p);
-		keyframes += p * 100 + `%{${fn(t, 1 - t)}}\n`;
-	}
-
-	return keyframes + `100% {${fn(b, 1 - b)}}\n}`;
-}
-
 export function clear_rules() {
 	let i = stylesheet.cssRules.length;
-	console.log(`clearing ${i} rules`);
 	while (i--) stylesheet.deleteRule(i);
 	current_rules = {};
 }
\ No newline at end of file
diff --git a/src/internal/transitions.js b/src/internal/transitions.js
index b7f3be163d..9495e20fdc 100644
--- a/src/internal/transitions.js
+++ b/src/internal/transitions.js
@@ -1,15 +1,6 @@
 import { identity as linear, noop, run } from './utils.js';
 import { loop } from './loop.js';
-import { add_rule, delete_rule, generate_rule } from './style_manager.js';
-
-// https://github.com/darkskyapp/string-hash/blob/master/index.js
-export function hash(str) {
-	let hash = 5381;
-	let i = str.length;
-
-	while (i--) hash = ((hash << 5) - hash) ^ str.charCodeAt(i);
-	return hash >>> 0;
-}
+import { create_rule, delete_rule } from './style_manager.js';
 
 export function wrapTransition(component, node, fn, params, intro) {
 	let obj = fn.call(component, node, params);
@@ -100,8 +91,7 @@ export function wrapTransition(component, node, fn, params, intro) {
 			if (obj.css) {
 				if (obj.delay) node.style.cssText = cssText;
 
-				const rule = generate_rule(program, ease, obj.css);
-				add_rule(rule, program.name = '__svelte_' + hash(rule));
+				program.name = create_rule(program, ease, obj.css);
 
 				node.style.animation = (node.style.animation || '')
 					.split(', ')

From 4f5f187cbe3f9b115cf24a4b144d771d446d50dc Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Mon, 31 Dec 2018 20:17:18 -0500
Subject: [PATCH 11/23] fix easing.mjs

---
 easing.mjs | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/easing.mjs b/easing.mjs
index 23579da891..759c1046e5 100644
--- a/easing.mjs
+++ b/easing.mjs
@@ -3,7 +3,7 @@ Adapted from https://github.com/mattdesl
 Distributed under MIT License https://github.com/mattdesl/eases/blob/master/LICENSE.md
 */
 
-import { identity as linear } from 'svelte/internal';
+export { identity as linear } from './internal';
 
 export function backInOut(t) {
 	var s = 1.70158 * 1.525;

From 35aee272d64e40e7e369555f4246d41192e62f70 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 02:14:59 -0500
Subject: [PATCH 12/23] start simplifying animations

---
 src/internal/animations.js  | 86 +++++++++++++++++--------------------
 src/internal/loop.js        |  2 +-
 src/internal/transitions.js |  4 +-
 3 files changed, 42 insertions(+), 50 deletions(-)

diff --git a/src/internal/animations.js b/src/internal/animations.js
index 2936b67f81..b8ed7407ef 100644
--- a/src/internal/animations.js
+++ b/src/internal/animations.js
@@ -13,8 +13,8 @@ export function wrapAnimation(node, from, fn, params) {
 	const duration = 'duration' in info ? info.duration : 300;
 	const delay = 'delay' in info ? info.delay : 0;
 	const ease = info.easing || linear;
-	const start = window.performance.now() + delay;
-	const end = start + duration;
+	const start_time = window.performance.now() + delay;
+	const end = start_time + duration;
 
 	const program = {
 		a: 0,
@@ -22,66 +22,59 @@ export function wrapAnimation(node, from, fn, params) {
 		b: 1,
 		delta: 1,
 		duration,
-		start,
+		start: start_time,
 		end
 	};
 
 	const cssText = node.style.cssText;
 
-	const animation = {
-		pending: delay ? program : null,
-		program: delay ? null : program,
-		running: true,
+	function start() {
+		if (info.css) {
+			if (delay) node.style.cssText = cssText;
 
-		start() {
-			if (info.css) {
-				if (delay) node.style.cssText = cssText;
+			program.name = create_rule(program, ease, info.css);
 
-				program.name = create_rule(program, ease, info.css);
-
-				node.style.animation = (node.style.animation || '')
-					.split(', ')
-					.filter(anim => anim && (program.delta < 0 || !/__svelte/.test(anim)))
-					.concat(`${program.name} ${program.duration}ms linear 1 forwards`)
-					.join(', ');
-			}
+			node.style.animation = (node.style.animation || '')
+				.split(', ')
+				.filter(anim => anim && (program.delta < 0 || !/__svelte/.test(anim)))
+				.concat(`${program.name} ${program.duration}ms linear 1 forwards`)
+				.join(', ');
+		}
 
-			animation.program = program;
-			animation.pending = null;
-		},
+		running_program = program;
+		pending_program = null;
+	}
 
-		update: now => {
-			const p = now - program.start;
-			const t = program.a + program.delta * ease(p / program.duration);
-			if (info.tick) info.tick(t, 1 - t);
-		},
+	let running = true;
+	let pending_program = delay ? program : null;
+	let running_program = delay ? null : program;
 
-		done() {
-			if (info.tick) info.tick(1, 0);
-			animation.stop();
-		},
+	function stop() {
+		if (info.css) delete_rule(node, program.name);
+		running = false;
+	}
 
-		stop() {
-			if (info.css) delete_rule(node, program.name);
-			animation.running = false;
+	const { abort, promise } = loop(now => {
+		if (pending_program && now >= pending_program.start) {
+			start();
 		}
-	};
-
-	const { abort, promise } = loop(() => {
-		const now = window.performance.now();
 
-		if (animation.program && now >= animation.program.end) {
-			animation.done();
+		if (running_program && now >= running_program.end) {
+			if (info.tick) info.tick(1, 0);
+			stop();
 		}
 
-		if (animation.pending && now >= animation.pending.start) {
-			animation.start(animation.pending);
+		if (!running) {
+			return false;
 		}
 
-		if (animation.running) {
-			animation.update(now);
-			return true;
+		if (running_program) {
+			const p = now - program.start;
+			const t = program.a + program.delta * ease(p / program.duration);
+			if (info.tick) info.tick(t, 1 - t);
 		}
+
+		return true;
 	});
 
 	if (info.tick) info.tick(0, 1);
@@ -89,10 +82,11 @@ export function wrapAnimation(node, from, fn, params) {
 	if (delay) {
 		if (info.css) node.style.cssText += info.css(0, 1);
 	} else {
-		animation.start();
+		start();
 	}
 
-	return animation;
+	// TODO just return the function
+	return { stop };
 }
 
 export function fixPosition(node) {
diff --git a/src/internal/loop.js b/src/internal/loop.js
index 602a910cba..fd75f9b1a6 100644
--- a/src/internal/loop.js
+++ b/src/internal/loop.js
@@ -3,7 +3,7 @@ let running = false;
 
 function run_tasks() {
 	tasks.forEach(task => {
-		if (!task[0]()) {
+		if (!task[0](window.performance.now())) {
 			tasks.delete(task);
 			task[1]();
 		}
diff --git a/src/internal/transitions.js b/src/internal/transitions.js
index 9495e20fdc..839801ee4b 100644
--- a/src/internal/transitions.js
+++ b/src/internal/transitions.js
@@ -61,9 +61,7 @@ export function wrapTransition(component, node, fn, params, intro) {
 			if (!this.running) {
 				this.running = true;
 
-				const { abort, promise } = loop(() => {
-					const now = window.performance.now();
-
+				const { abort, promise } = loop(now => {
 					if (this.program && now >= this.program.end) {
 						this.done();
 					}

From 84d501b5fb1e5a9740d1fa59c812c8ce87d6e9d7 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 02:16:55 -0500
Subject: [PATCH 13/23] minor tidy up

---
 src/motion/spring.js  | 8 +++-----
 src/motion/tweened.js | 7 +++----
 2 files changed, 6 insertions(+), 9 deletions(-)

diff --git a/src/motion/spring.js b/src/motion/spring.js
index 7d68377bd0..1b5413db63 100644
--- a/src/motion/spring.js
+++ b/src/motion/spring.js
@@ -117,20 +117,18 @@ export function spring(value, opts = {}) {
 			last_time = window.performance.now();
 			settled = false;
 
-			task = loop(() => {
-				const time = window.performance.now();
-
+			task = loop(now=> {
 				({ value, settled } = tick_spring(
 					velocity,
 					value,
 					target_value,
 					spring.stiffness,
 					spring.damping,
-					(time - last_time) * 60 / 1000,
+					(now - last_time) * 60 / 1000,
 					threshold
 				));
 
-				last_time = time;
+				last_time = now;
 
 				if (settled) {
 					value = target_value;
diff --git a/src/motion/tweened.js b/src/motion/tweened.js
index 21ff8f70c7..49f1217a4e 100644
--- a/src/motion/tweened.js
+++ b/src/motion/tweened.js
@@ -76,9 +76,8 @@ export function tweened(value, defaults = {}) {
 		const start = window.performance.now() + delay;
 		let fn;
 
-		task = loop(() => {
-			const time = window.performance.now();
-			if (time < start) return true;
+		task = loop(now => {
+			if (now < start) return true;
 
 			if (!started) {
 				fn = interpolate(value, new_value);
@@ -91,7 +90,7 @@ export function tweened(value, defaults = {}) {
 				previous_task = null;
 			}
 
-			const elapsed = time - start;
+			const elapsed = now - start;
 
 			if (elapsed > duration) {
 				store.set(value = new_value);

From 6dbac071f518147f0fb0f92c12578eceada4d760 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 02:37:42 -0500
Subject: [PATCH 14/23] simplify

---
 src/internal/animations.js | 65 ++++++++++++++++----------------------
 1 file changed, 28 insertions(+), 37 deletions(-)

diff --git a/src/internal/animations.js b/src/internal/animations.js
index b8ed7407ef..7e6b112fd0 100644
--- a/src/internal/animations.js
+++ b/src/internal/animations.js
@@ -1,4 +1,4 @@
-import { identity as linear } from './utils.js';
+import { identity as linear, noop } from './utils.js';
 import { loop } from './loop.js';
 import { create_rule, delete_rule } from './style_manager.js';
 
@@ -8,59 +8,50 @@ export function wrapAnimation(node, from, fn, params) {
 	const to = node.getBoundingClientRect();
 	if (from.left === to.left && from.right === to.right && from.top === to.top && from.bottom === to.bottom) return;
 
-	const info = fn(node, { from, to }, params);
+	const {
+		delay = 0,
+		duration = 300,
+		easing = linear,
+		start: start_time = window.performance.now() + delay,
+		end = start_time + duration,
+		tick = noop,
+		css
+	} = fn(node, { from, to }, params);
 
-	const duration = 'duration' in info ? info.duration : 300;
-	const delay = 'delay' in info ? info.delay : 0;
-	const ease = info.easing || linear;
-	const start_time = window.performance.now() + delay;
-	const end = start_time + duration;
-
-	const program = {
-		a: 0,
-		t: 0,
-		b: 1,
-		delta: 1,
-		duration,
-		start: start_time,
-		end
-	};
+	let running = true;
+	let started = false;
+	let name;
 
 	const cssText = node.style.cssText;
 
 	function start() {
-		if (info.css) {
+		if (css) {
 			if (delay) node.style.cssText = cssText;
 
-			program.name = create_rule(program, ease, info.css);
+			name = create_rule({ a: 0, b: 1, delta: 1, duration }, easing, css);
 
 			node.style.animation = (node.style.animation || '')
 				.split(', ')
-				.filter(anim => anim && (program.delta < 0 || !/__svelte/.test(anim)))
-				.concat(`${program.name} ${program.duration}ms linear 1 forwards`)
+				.filter(anim => anim && !/__svelte/.test(anim))
+				.concat(`${name} ${duration}ms linear 1 forwards`)
 				.join(', ');
 		}
 
-		running_program = program;
-		pending_program = null;
+		started = true;
 	}
 
-	let running = true;
-	let pending_program = delay ? program : null;
-	let running_program = delay ? null : program;
-
 	function stop() {
-		if (info.css) delete_rule(node, program.name);
+		if (css) delete_rule(node, name);
 		running = false;
 	}
 
 	const { abort, promise } = loop(now => {
-		if (pending_program && now >= pending_program.start) {
+		if (!started && now >= start_time) {
 			start();
 		}
 
-		if (running_program && now >= running_program.end) {
-			if (info.tick) info.tick(1, 0);
+		if (started && now >= end) {
+			tick(1, 0);
 			stop();
 		}
 
@@ -68,19 +59,19 @@ export function wrapAnimation(node, from, fn, params) {
 			return false;
 		}
 
-		if (running_program) {
-			const p = now - program.start;
-			const t = program.a + program.delta * ease(p / program.duration);
-			if (info.tick) info.tick(t, 1 - t);
+		if (started) {
+			const p = now - start_time;
+			const t = 0 + 1 * easing(p / duration);
+			tick(t, 1 - t);
 		}
 
 		return true;
 	});
 
-	if (info.tick) info.tick(0, 1);
+	tick(0, 1);
 
 	if (delay) {
-		if (info.css) node.style.cssText += info.css(0, 1);
+		if (css) node.style.cssText += css(0, 1);
 	} else {
 		start();
 	}

From 7fbb71a7886245a9564ce7a82d64e3b35c0a9c37 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 11:37:10 -0500
Subject: [PATCH 15/23] tidy up

---
 src/compile/render-dom/wrappers/Element/index.ts | 12 ++++++------
 src/internal/animations.js                       | 11 +++++------
 src/internal/keyed-each.js                       | 15 ---------------
 3 files changed, 11 insertions(+), 27 deletions(-)

diff --git a/src/compile/render-dom/wrappers/Element/index.ts b/src/compile/render-dom/wrappers/Element/index.ts
index 1178eca4ab..8883587929 100644
--- a/src/compile/render-dom/wrappers/Element/index.ts
+++ b/src/compile/render-dom/wrappers/Element/index.ts
@@ -666,18 +666,18 @@ export default class ElementWrapper extends Wrapper {
 		const { component } = this.renderer;
 
 		const rect = block.getUniqueName('rect');
-		const animation = block.getUniqueName('animation');
+		const stop_animation = block.getUniqueName('stop_animation');
 
 		block.addVariable(rect);
-		block.addVariable(animation);
+		block.addVariable(stop_animation, '@noop');
 
 		block.builders.measure.addBlock(deindent`
 			${rect} = ${this.var}.getBoundingClientRect();
 		`);
 
 		block.builders.fix.addBlock(deindent`
-			@fixPosition(${this.var});
-			if (${animation}) ${animation}.stop();
+			@fix_position(${this.var});
+			${stop_animation}();
 		`);
 
 		const params = this.node.animation.expression ? this.node.animation.expression.render() : '{}';
@@ -685,8 +685,8 @@ export default class ElementWrapper extends Wrapper {
 		const name = component.qualify(this.node.animation.name);
 
 		block.builders.animate.addBlock(deindent`
-			if (${animation}) ${animation}.stop();
-			${animation} = @wrapAnimation(${this.var}, ${rect}, ${name}, ${params});
+			${stop_animation}();
+			${stop_animation} = @animate(${this.var}, ${rect}, ${name}, ${params});
 		`);
 	}
 
diff --git a/src/internal/animations.js b/src/internal/animations.js
index 7e6b112fd0..fcbfba7521 100644
--- a/src/internal/animations.js
+++ b/src/internal/animations.js
@@ -2,7 +2,7 @@ import { identity as linear, noop } from './utils.js';
 import { loop } from './loop.js';
 import { create_rule, delete_rule } from './style_manager.js';
 
-export function wrapAnimation(node, from, fn, params) {
+export function animate(node, from, fn, params) {
 	if (!from) return;
 
 	const to = node.getBoundingClientRect();
@@ -68,19 +68,18 @@ export function wrapAnimation(node, from, fn, params) {
 		return true;
 	});
 
-	tick(0, 1);
-
 	if (delay) {
 		if (css) node.style.cssText += css(0, 1);
 	} else {
 		start();
 	}
 
-	// TODO just return the function
-	return { stop };
+	tick(0, 1);
+
+	return stop;
 }
 
-export function fixPosition(node) {
+export function fix_position(node) {
 	const style = getComputedStyle(node);
 
 	if (style.position !== 'absolute' && style.position !== 'fixed') {
diff --git a/src/internal/keyed-each.js b/src/internal/keyed-each.js
index d3afde60fb..745ead6ff2 100644
--- a/src/internal/keyed-each.js
+++ b/src/internal/keyed-each.js
@@ -105,19 +105,4 @@ export function measure(blocks) {
 	let i = blocks.length;
 	while (i--) rects[blocks[i].key] = blocks[i].node.getBoundingClientRect();
 	return rects;
-}
-
-export function animate(blocks, rects, fn, params) {
-	let i = blocks.length;
-	while (i--) {
-		const block = blocks[i];
-		const from = rects[block.key];
-
-		if (!from) continue;
-		const to = block.node.getBoundingClientRect();
-
-		if (from.left === to.left && from.right === to.right && from.top === to.top && from.bottom === to.bottom) continue;
-
-
-	}
 }
\ No newline at end of file

From a7370ce02409ab9e8c88832795841e4e5cdbf5fa Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 11:37:25 -0500
Subject: [PATCH 16/23] fix test

---
 .../js/samples/each-block-keyed-animated/expected.js | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/test/js/samples/each-block-keyed-animated/expected.js b/test/js/samples/each-block-keyed-animated/expected.js
index 9c9bbff7f9..66db899b65 100644
--- a/test/js/samples/each-block-keyed-animated/expected.js
+++ b/test/js/samples/each-block-keyed-animated/expected.js
@@ -1,5 +1,5 @@
 /* generated by Svelte vX.Y.Z */
-import { SvelteComponent as SvelteComponent_1, append, blankObject, createComment, createElement, createText, detachNode, fixAndOutroAndDestroyBlock, fixPosition, flush, init, insert, run, safe_not_equal, setData, updateKeyedEach, wrapAnimation } from "svelte/internal";
+import { SvelteComponent as SvelteComponent_1, animate, append, blankObject, createComment, createElement, createText, detachNode, fixAndOutroAndDestroyBlock, fix_position, flush, init, insert, noop, run, safe_not_equal, setData, updateKeyedEach } from "svelte/internal";
 
 function get_each_context(ctx, list, i) {
 	const child_ctx = Object.create(ctx);
@@ -9,7 +9,7 @@ function get_each_context(ctx, list, i) {
 
 // (19:0) {#each things as thing (thing.id)}
 function create_each_block(component, key_1, ctx) {
-	var div, text_value = ctx.thing.name, text, rect, animation;
+	var div, text_value = ctx.thing.name, text, rect, stop_animation = noop;
 
 	return {
 		key: key_1,
@@ -38,13 +38,13 @@ function create_each_block(component, key_1, ctx) {
 		},
 
 		f() {
-			fixPosition(div);
-			if (animation) animation.stop();
+			fix_position(div);
+			stop_animation();
 		},
 
 		a() {
-			if (animation) animation.stop();
-			animation = wrapAnimation(div, rect, foo, {});
+			stop_animation();
+			stop_animation = animate(div, rect, foo, {});
 		},
 
 		d(detach) {

From e56c5653a74aa51342d8c41a2214055a2a302516 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 12:28:08 -0500
Subject: [PATCH 17/23] start refactoring transitions

---
 src/compile/render-dom/wrappers/EachBlock.ts  |   4 +-
 src/compile/render-dom/wrappers/IfBlock.ts    |   4 +-
 .../wrappers/InlineComponent/index.ts         |   2 +-
 src/internal/await-block.js                   |   4 +-
 src/internal/transitions.js                   | 258 +++++++++---------
 test/runtime/index.js                         |   6 +-
 6 files changed, 137 insertions(+), 141 deletions(-)

diff --git a/src/compile/render-dom/wrappers/EachBlock.ts b/src/compile/render-dom/wrappers/EachBlock.ts
index 603920070d..397a5629a7 100644
--- a/src/compile/render-dom/wrappers/EachBlock.ts
+++ b/src/compile/render-dom/wrappers/EachBlock.ts
@@ -341,7 +341,7 @@ export default class EachBlockWrapper extends Wrapper {
 		block.builders.update.addBlock(deindent`
 			const ${this.vars.each_block_value} = ${snippet};
 
-			${this.block.hasOutros && `@groupOutros();`}
+			${this.block.hasOutros && `@group_outros();`}
 			${this.node.hasAnimation && `for (let #i = 0; #i < ${blocks}.length; #i += 1) ${blocks}[#i].r();`}
 			${blocks} = @updateKeyedEach(${blocks}, #component, changed, ${get_key}, ${dynamic ? '1' : '0'}, ctx, ${this.vars.each_block_value}, ${lookup}, ${updateMountNode}, ${destroy}, ${create_each_block}, "${mountOrIntro}", ${anchor}, ${this.vars.get_each_context});
 			${this.node.hasAnimation && `for (let #i = 0; #i < ${blocks}.length; #i += 1) ${blocks}[#i].a();`}
@@ -466,7 +466,7 @@ export default class EachBlockWrapper extends Wrapper {
 
 			if (this.block.hasOutros) {
 				destroy = deindent`
-					@groupOutros();
+					@group_outros();
 					for (; #i < ${iterations}.length; #i += 1) ${outroBlock}(#i, 1);
 				`;
 			} else {
diff --git a/src/compile/render-dom/wrappers/IfBlock.ts b/src/compile/render-dom/wrappers/IfBlock.ts
index 4e4d3265b3..594f811090 100644
--- a/src/compile/render-dom/wrappers/IfBlock.ts
+++ b/src/compile/render-dom/wrappers/IfBlock.ts
@@ -322,7 +322,7 @@ export default class IfBlockWrapper extends Wrapper {
 		const updateMountNode = this.getUpdateMountNode(anchor);
 
 		const destroyOldBlock = deindent`
-			@groupOutros();
+			@group_outros();
 			${name}.o(function() {
 				${if_blocks}[${previous_block_index}].d(1);
 				${if_blocks}[${previous_block_index}] = null;
@@ -445,7 +445,7 @@ export default class IfBlockWrapper extends Wrapper {
 		// as that will typically result in glitching
 		const exit = branch.block.hasOutroMethod
 			? deindent`
-				@groupOutros();
+				@group_outros();
 				${name}.o(function() {
 					${name}.d(1);
 					${name} = null;
diff --git a/src/compile/render-dom/wrappers/InlineComponent/index.ts b/src/compile/render-dom/wrappers/InlineComponent/index.ts
index 02227b86e3..a5427ef073 100644
--- a/src/compile/render-dom/wrappers/InlineComponent/index.ts
+++ b/src/compile/render-dom/wrappers/InlineComponent/index.ts
@@ -368,7 +368,7 @@ export default class InlineComponentWrapper extends Wrapper {
 			block.builders.update.addBlock(deindent`
 				if (${switch_value} !== (${switch_value} = ${snippet})) {
 					if (${name}) {
-						@groupOutros();
+						@group_outros();
 						const old_component = ${name};
 						old_component.$$.fragment.o(() => {
 							old_component.$destroy();
diff --git a/src/internal/await-block.js b/src/internal/await-block.js
index c579ef2242..5db7c8f1e5 100644
--- a/src/internal/await-block.js
+++ b/src/internal/await-block.js
@@ -1,5 +1,5 @@
 import { assign, run_all, isPromise } from './utils.js';
-import { groupOutros } from './transitions.js';
+import { group_outros } from './transitions.js';
 import { flush } from '../internal/scheduler.js';
 
 export function handlePromise(promise, info) {
@@ -17,7 +17,7 @@ export function handlePromise(promise, info) {
 			if (info.blocks) {
 				info.blocks.forEach((block, i) => {
 					if (i !== index && block) {
-						groupOutros();
+						group_outros();
 						block.o(() => {
 							block.d(1);
 							info.blocks[i] = null;
diff --git a/src/internal/transitions.js b/src/internal/transitions.js
index 839801ee4b..ad3b4d5f70 100644
--- a/src/internal/transitions.js
+++ b/src/internal/transitions.js
@@ -2,179 +2,177 @@ import { identity as linear, noop, run } from './utils.js';
 import { loop } from './loop.js';
 import { create_rule, delete_rule } from './style_manager.js';
 
+let promise;
+
+function wait() {
+	if (!promise) {
+		promise = Promise.resolve();
+		promise.then(() => {
+			promise = null;
+		});
+	}
+
+	return promise;
+}
+
+let outros;
+
+export function group_outros() {
+	outros = {
+		remaining: 0,
+		callbacks: []
+	};
+}
+
 export function wrapTransition(component, node, fn, params, intro) {
-	let obj = fn.call(component, node, params);
+	let config = fn.call(component, node, params);
 	let duration;
 	let ease;
 	let cssText;
 
 	let initialised = false;
 
-	return {
-		t: intro ? 0 : 1,
-		running: false,
-		program: null,
-		pending: null,
+	let t = intro ? 0 : 1;
+	let running = false;
+	let running_program = null;
+	let pending_program = null;
 
-		run(b, callback) {
-			if (typeof obj === 'function') {
-				transitionManager.wait().then(() => {
-					obj = obj();
-					this._run(b, callback);
-				});
-			} else {
-				this._run(b, callback);
-			}
-		},
+	function start(program) {
+		node.dispatchEvent(new window.CustomEvent(`${program.b ? 'intro' : 'outro'}start`));
 
-		_run(b, callback) {
-			duration = obj.duration || 300;
-			ease = obj.easing || linear;
+		program.a = t;
+		program.delta = program.b - program.a;
+		program.duration = duration * Math.abs(program.b - program.a);
+		program.end = program.start + program.duration;
 
-			const program = {
-				start: window.performance.now() + (obj.delay || 0),
-				b,
-				callback: callback || noop
-			};
+		if (config.css) {
+			if (config.delay) node.style.cssText = cssText;
 
-			if (intro && !initialised) {
-				if (obj.css && obj.delay) {
-					cssText = node.style.cssText;
-					node.style.cssText += obj.css(0, 1);
-				}
+			program.name = create_rule(program, ease, config.css);
 
-				if (obj.tick) obj.tick(0, 1);
-				initialised = true;
-			}
+			node.style.animation = (node.style.animation || '')
+				.split(', ')
+				.filter(anim => anim && (program.delta < 0 || !/__svelte/.test(anim)))
+				.concat(`${program.name} ${program.duration}ms linear 1 forwards`)
+				.join(', ');
+		}
 
-			if (!b) {
-				program.group = outros.current;
-				outros.current.remaining += 1;
-			}
+		running_program = program;
+		pending_program = null;
+	}
 
-			if (obj.delay) {
-				this.pending = program;
-			} else {
-				this.start(program);
-			}
+	function update(now) {
+		const program = running_program;
+		if (!program) return;
 
-			if (!this.running) {
-				this.running = true;
+		const p = now - program.start;
+		t = program.a + program.delta * ease(p / program.duration);
+		if (config.tick) config.tick(t, 1 - t);
+	}
 
-				const { abort, promise } = loop(now => {
-					if (this.program && now >= this.program.end) {
-						this.done();
-					}
+	function done() {
+		const program = running_program;
+		running_program = null;
 
-					if (this.pending && now >= this.pending.start) {
-						this.start(this.pending);
-					}
+		t = program.b;
 
-					if (this.running) {
-						this.update(now);
-						return true;
-					}
-				});
-			}
-		},
+		if (config.tick) config.tick(t, 1 - t);
+
+		node.dispatchEvent(new window.CustomEvent(`${program.b ? 'intro' : 'outro'}end`));
 
-		start(program) {
-			node.dispatchEvent(new window.CustomEvent(`${program.b ? 'intro' : 'outro'}start`));
+		if (!program.b && !program.invalidated) {
+			program.group.callbacks.push(() => {
+				program.callback();
+				if (config.css) delete_rule(node, program.name);
+			});
+
+			if (--program.group.remaining === 0) {
+				program.group.callbacks.forEach(run);
+			}
+		} else {
+			if (config.css) delete_rule(node, program.name);
+		}
 
-			program.a = this.t;
-			program.delta = program.b - program.a;
-			program.duration = duration * Math.abs(program.b - program.a);
-			program.end = program.start + program.duration;
+		running = !!pending_program;
+	}
 
-			if (obj.css) {
-				if (obj.delay) node.style.cssText = cssText;
+	function go(b, callback) {
+		duration = config.duration || 300;
+		ease = config.easing || linear;
 
-				program.name = create_rule(program, ease, obj.css);
+		const program = {
+			start: window.performance.now() + (config.delay || 0),
+			b,
+			callback: callback || noop
+		};
 
-				node.style.animation = (node.style.animation || '')
-					.split(', ')
-					.filter(anim => anim && (program.delta < 0 || !/__svelte/.test(anim)))
-					.concat(`${program.name} ${program.duration}ms linear 1 forwards`)
-					.join(', ');
+		if (intro && !initialised) {
+			if (config.css && config.delay) {
+				cssText = node.style.cssText;
+				node.style.cssText += config.css(0, 1);
 			}
 
-			this.program = program;
-			this.pending = null;
-		},
+			if (config.tick) config.tick(0, 1);
+			initialised = true;
+		}
 
-		update(now) {
-			const program = this.program;
-			if (!program) return;
+		if (!b) {
+			program.group = outros;
+			outros.remaining += 1;
+		}
 
-			const p = now - program.start;
-			this.t = program.a + program.delta * ease(p / program.duration);
-			if (obj.tick) obj.tick(this.t, 1 - this.t);
-		},
+		if (config.delay) {
+			pending_program = program;
+		} else {
+			start(program);
+		}
 
-		done() {
-			const program = this.program;
-			this.program = null;
+		if (!running) {
+			running = true;
 
-			this.t = program.b;
+			const { abort, promise } = loop(now => {
+				if (running_program && now >= running_program.end) {
+					done();
+				}
 
-			if (obj.tick) obj.tick(this.t, 1 - this.t);
+				if (pending_program && now >= pending_program.start) {
+					start(pending_program);
+				}
 
-			node.dispatchEvent(new window.CustomEvent(`${program.b ? 'intro' : 'outro'}end`));
+				if (running) {
+					update(now);
+					return true;
+				}
+			});
+		}
+	}
 
-			if (!program.b && !program.invalidated) {
-				program.group.callbacks.push(() => {
-					program.callback();
-					if (obj.css) delete_rule(node, program.name);
+	return {
+		run(b, callback) {
+			if (typeof config === 'function') {
+				wait().then(() => {
+					config = config();
+					go(b, callback);
 				});
-
-				if (--program.group.remaining === 0) {
-					program.group.callbacks.forEach(run);
-				}
 			} else {
-				if (obj.css) delete_rule(node, program.name);
+				go(b, callback);
 			}
-
-			this.running = !!this.pending;
 		},
 
 		abort(reset) {
-			if (reset && obj.tick) obj.tick(1, 0);
+			if (reset && config.tick) config.tick(1, 0);
 
-			if (this.program) {
-				if (obj.css) delete_rule(node, this.program.name);
-				this.program = this.pending = null;
-				this.running = false;
+			if (running_program) {
+				if (config.css) delete_rule(node, running_program.name);
+				running_program = pending_program = null;
+				running = false;
 			}
 		},
 
 		invalidate() {
-			if (this.program) {
-				this.program.invalidated = true;
+			if (running_program) {
+				running_program.invalidated = true;
 			}
 		}
 	};
-}
-
-export let outros = {};
-
-export function groupOutros() {
-	outros.current = {
-		remaining: 0,
-		callbacks: []
-	};
-}
-
-export var transitionManager = {
-	promise: null,
-
-	wait() {
-		if (!transitionManager.promise) {
-			transitionManager.promise = Promise.resolve();
-			transitionManager.promise.then(() => {
-				transitionManager.promise = null;
-			});
-		}
-
-		return transitionManager.promise;
-	}
-};
+}
\ No newline at end of file
diff --git a/test/runtime/index.js b/test/runtime/index.js
index 5569b444d1..334426c424 100644
--- a/test/runtime/index.js
+++ b/test/runtime/index.js
@@ -3,7 +3,7 @@ import * as path from "path";
 import * as fs from "fs";
 import { rollup } from 'rollup';
 import * as virtual from 'rollup-plugin-virtual';
-import { transitionManager, clear_loops } from "../../internal.js";
+import { clear_loops } from "../../internal.js";
 
 import {
 	showOutput,
@@ -93,9 +93,7 @@ describe("runtime", () => {
 
 			return Promise.resolve()
 				.then(() => {
-					// set of hacks to support transition tests
-					transitionManager.running = false;
-					transitionManager.transitions = [];
+					// hack to support transition tests
 					clear_loops();
 
 					const raf = {

From f1bdfd84d812b4ac2b42ea7fef1664c94e68dad7 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 12:53:17 -0500
Subject: [PATCH 18/23] dont call transition functions with component context

---
 src/compile/render-dom/wrappers/Element/index.ts |  8 ++++----
 src/internal/transitions.js                      | 10 +++++-----
 2 files changed, 9 insertions(+), 9 deletions(-)

diff --git a/src/compile/render-dom/wrappers/Element/index.ts b/src/compile/render-dom/wrappers/Element/index.ts
index 8883587929..e08c77dac4 100644
--- a/src/compile/render-dom/wrappers/Element/index.ts
+++ b/src/compile/render-dom/wrappers/Element/index.ts
@@ -595,13 +595,13 @@ export default class ElementWrapper extends Wrapper {
 				if (${name}) ${name}.invalidate();
 
 				@add_render_callback(() => {
-					if (!${name}) ${name} = @wrapTransition(#component, ${this.var}, ${fn}, ${snippet}, true);
+					if (!${name}) ${name} = @create_transition(${this.var}, ${fn}, ${snippet}, true);
 					${name}.run(1);
 				});
 			`);
 
 			block.builders.outro.addBlock(deindent`
-				if (!${name}) ${name} = @wrapTransition(#component, ${this.var}, ${fn}, ${snippet}, false);
+				if (!${name}) ${name} = @create_transition(${this.var}, ${fn}, ${snippet}, false);
 				${name}.run(0, () => {
 					#outrocallback();
 					${name} = null;
@@ -630,7 +630,7 @@ export default class ElementWrapper extends Wrapper {
 
 				block.builders.intro.addConditional(`@intros.enabled`, deindent`
 					@add_render_callback(() => {
-						${introName} = @wrapTransition(#component, ${this.var}, ${fn}, ${snippet}, true);
+						${introName} = @create_transition(${this.var}, ${fn}, ${snippet}, true);
 						${introName}.run(1);
 					});
 				`);
@@ -651,7 +651,7 @@ export default class ElementWrapper extends Wrapper {
 				// TODO hide elements that have outro'd (unless they belong to a still-outroing
 				// group) prior to their removal from the DOM
 				block.builders.outro.addBlock(deindent`
-					${outroName} = @wrapTransition(#component, ${this.var}, ${fn}, ${snippet}, false);
+					${outroName} = @create_transition(${this.var}, ${fn}, ${snippet}, false);
 					${outroName}.run(0, #outrocallback);
 				`);
 
diff --git a/src/internal/transitions.js b/src/internal/transitions.js
index ad3b4d5f70..5aaed5b859 100644
--- a/src/internal/transitions.js
+++ b/src/internal/transitions.js
@@ -24,13 +24,13 @@ export function group_outros() {
 	};
 }
 
-export function wrapTransition(component, node, fn, params, intro) {
-	let config = fn.call(component, node, params);
+export function create_transition(node, fn, params, intro) {
+	let config = fn(node, params);
 	let duration;
 	let ease;
 	let cssText;
 
-	let initialised = false;
+	let ready = false;
 
 	let t = intro ? 0 : 1;
 	let running = false;
@@ -106,14 +106,14 @@ export function wrapTransition(component, node, fn, params, intro) {
 			callback: callback || noop
 		};
 
-		if (intro && !initialised) {
+		if (intro && !ready) {
 			if (config.css && config.delay) {
 				cssText = node.style.cssText;
 				node.style.cssText += config.css(0, 1);
 			}
 
 			if (config.tick) config.tick(0, 1);
-			initialised = true;
+			ready = true;
 		}
 
 		if (!b) {

From e5043327306940c54e99c578bd95d53a842059e9 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 14:16:19 -0500
Subject: [PATCH 19/23] tidy up

---
 src/internal/transitions.js | 55 ++++++++++++++++++-------------------
 1 file changed, 26 insertions(+), 29 deletions(-)

diff --git a/src/internal/transitions.js b/src/internal/transitions.js
index 5aaed5b859..714f82c6a9 100644
--- a/src/internal/transitions.js
+++ b/src/internal/transitions.js
@@ -26,33 +26,31 @@ export function group_outros() {
 
 export function create_transition(node, fn, params, intro) {
 	let config = fn(node, params);
-	let duration;
-	let ease;
 	let cssText;
 
-	let ready = false;
-
+	let ready = !intro;
 	let t = intro ? 0 : 1;
+
 	let running = false;
 	let running_program = null;
 	let pending_program = null;
 
-	function start(program) {
+	function start(program, delay, duration, easing) {
 		node.dispatchEvent(new window.CustomEvent(`${program.b ? 'intro' : 'outro'}start`));
 
 		program.a = t;
-		program.delta = program.b - program.a;
+		program.d = program.b - program.a;
 		program.duration = duration * Math.abs(program.b - program.a);
 		program.end = program.start + program.duration;
 
 		if (config.css) {
-			if (config.delay) node.style.cssText = cssText;
+			if (delay) node.style.cssText = cssText;
 
-			program.name = create_rule(program, ease, config.css);
+			program.name = create_rule(program, easing, config.css);
 
 			node.style.animation = (node.style.animation || '')
 				.split(', ')
-				.filter(anim => anim && (program.delta < 0 || !/__svelte/.test(anim)))
+				.filter(anim => anim && (program.d < 0 || !/__svelte/.test(anim)))
 				.concat(`${program.name} ${program.duration}ms linear 1 forwards`)
 				.join(', ');
 		}
@@ -61,15 +59,6 @@ export function create_transition(node, fn, params, intro) {
 		pending_program = null;
 	}
 
-	function update(now) {
-		const program = running_program;
-		if (!program) return;
-
-		const p = now - program.start;
-		t = program.a + program.delta * ease(p / program.duration);
-		if (config.tick) config.tick(t, 1 - t);
-	}
-
 	function done() {
 		const program = running_program;
 		running_program = null;
@@ -97,17 +86,20 @@ export function create_transition(node, fn, params, intro) {
 	}
 
 	function go(b, callback) {
-		duration = config.duration || 300;
-		ease = config.easing || linear;
+		const {
+			delay = 0,
+			duration = 300,
+			easing = linear
+		} = config;
 
 		const program = {
-			start: window.performance.now() + (config.delay || 0),
+			start: window.performance.now() + delay,
 			b,
-			callback: callback || noop
+			callback
 		};
 
-		if (intro && !ready) {
-			if (config.css && config.delay) {
+		if (!ready) {
+			if (config.css && delay) {
 				cssText = node.style.cssText;
 				node.style.cssText += config.css(0, 1);
 			}
@@ -121,10 +113,10 @@ export function create_transition(node, fn, params, intro) {
 			outros.remaining += 1;
 		}
 
-		if (config.delay) {
+		if (delay) {
 			pending_program = program;
 		} else {
-			start(program);
+			start(program, delay, duration, easing);
 		}
 
 		if (!running) {
@@ -136,11 +128,16 @@ export function create_transition(node, fn, params, intro) {
 				}
 
 				if (pending_program && now >= pending_program.start) {
-					start(pending_program);
+					start(pending_program, delay, duration, easing);
 				}
 
 				if (running) {
-					update(now);
+					if (running_program) {
+						const p = now - running_program.start;
+						t = running_program.a + running_program.d * easing(p / running_program.duration);
+						if (config.tick) config.tick(t, 1 - t);
+					}
+
 					return true;
 				}
 			});
@@ -148,7 +145,7 @@ export function create_transition(node, fn, params, intro) {
 	}
 
 	return {
-		run(b, callback) {
+		run(b, callback = noop) {
 			if (typeof config === 'function') {
 				wait().then(() => {
 					config = config();

From 016bf848007c3e14c9983ad92924a2de2f9dd642 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 14:39:46 -0500
Subject: [PATCH 20/23] dont pass around reference to component

---
 src/compile/render-dom/Block.ts               |  6 ++----
 src/compile/render-dom/index.ts               |  2 +-
 src/compile/render-dom/wrappers/AwaitBlock.ts |  2 +-
 src/compile/render-dom/wrappers/EachBlock.ts  | 18 ++++++++---------
 .../render-dom/wrappers/Element/Binding.ts    |  4 ++--
 src/compile/render-dom/wrappers/IfBlock.ts    | 20 +++++++++----------
 src/compile/render-dom/wrappers/Slot.ts       |  2 +-
 src/internal/Component.js                     |  2 +-
 src/internal/await-block.js                   |  4 ++--
 9 files changed, 29 insertions(+), 31 deletions(-)

diff --git a/src/compile/render-dom/Block.ts b/src/compile/render-dom/Block.ts
index 5a192b55a3..bee2072ef1 100644
--- a/src/compile/render-dom/Block.ts
+++ b/src/compile/render-dom/Block.ts
@@ -104,9 +104,7 @@ export default class Block {
 		this.getUniqueName = this.renderer.component.getUniqueNameMaker();
 		this.variables = new Map();
 
-		this.aliases = new Map()
-			.set('component', this.getUniqueName('component'))
-			.set('ctx', this.getUniqueName('ctx'));
+		this.aliases = new Map().set('ctx', this.getUniqueName('ctx'));
 		if (this.key) this.aliases.set('key', this.getUniqueName('key'));
 
 		this.hasUpdateMethod = false; // determined later
@@ -410,7 +408,7 @@ export default class Block {
 
 		return deindent`
 			${this.comment && `// ${this.comment}`}
-			function ${this.name}(${this.alias('component')}, ${this.key ? `${localKey}, ` : ''}ctx) {
+			function ${this.name}($$, ${this.key ? `${localKey}, ` : ''}ctx) {
 				${this.getContents(localKey)}
 			}
 		`;
diff --git a/src/compile/render-dom/index.ts b/src/compile/render-dom/index.ts
index aee924f0cf..50b0a35206 100644
--- a/src/compile/render-dom/index.ts
+++ b/src/compile/render-dom/index.ts
@@ -238,7 +238,7 @@ export default function dom(
 	if (component.props.length > 0 || component.has_reactive_assignments) args.push('$$props', '$$invalidate');
 
 	builder.addBlock(deindent`
-		function create_fragment(${component.alias('component')}, ctx) {
+		function create_fragment($$, ctx) {
 			${block.getContents()}
 		}
 
diff --git a/src/compile/render-dom/wrappers/AwaitBlock.ts b/src/compile/render-dom/wrappers/AwaitBlock.ts
index c0b719f140..c37bb4b1cf 100644
--- a/src/compile/render-dom/wrappers/AwaitBlock.ts
+++ b/src/compile/render-dom/wrappers/AwaitBlock.ts
@@ -135,7 +135,7 @@ export default class AwaitBlockWrapper extends Wrapper {
 		block.maintainContext = true;
 
 		const infoProps = [
-			block.alias('component') === 'component' ? 'component' : `component: #component`,
+			'$$',
 			'ctx',
 			'current: null',
 			this.pending.block.name && `pending: ${this.pending.block.name}`,
diff --git a/src/compile/render-dom/wrappers/EachBlock.ts b/src/compile/render-dom/wrappers/EachBlock.ts
index 397a5629a7..2b3bd44a01 100644
--- a/src/compile/render-dom/wrappers/EachBlock.ts
+++ b/src/compile/render-dom/wrappers/EachBlock.ts
@@ -216,7 +216,7 @@ export default class EachBlockWrapper extends Wrapper {
 			// TODO neaten this up... will end up with an empty line in the block
 			block.builders.init.addBlock(deindent`
 				if (!${this.vars.each_block_value}.${this.vars.length}) {
-					${each_block_else} = ${this.else.block.name}(#component, ctx);
+					${each_block_else} = ${this.else.block.name}($$, ctx);
 					${each_block_else}.c();
 				}
 			`);
@@ -234,7 +234,7 @@ export default class EachBlockWrapper extends Wrapper {
 					if (!${this.vars.each_block_value}.${this.vars.length} && ${each_block_else}) {
 						${each_block_else}.p(changed, ctx);
 					} else if (!${this.vars.each_block_value}.${this.vars.length}) {
-						${each_block_else} = ${this.else.block.name}(#component, ctx);
+						${each_block_else} = ${this.else.block.name}($$, ctx);
 						${each_block_else}.c();
 						${each_block_else}.${mountOrIntro}(${initialMountNode}, ${this.vars.anchor});
 					} else if (${each_block_else}) {
@@ -250,7 +250,7 @@ export default class EachBlockWrapper extends Wrapper {
 							${each_block_else} = null;
 						}
 					} else if (!${each_block_else}) {
-						${each_block_else} = ${this.else.block.name}(#component, ctx);
+						${each_block_else} = ${this.else.block.name}($$, ctx);
 						${each_block_else}.c();
 						${each_block_else}.${mountOrIntro}(${initialMountNode}, ${this.vars.anchor});
 					}
@@ -307,7 +307,7 @@ export default class EachBlockWrapper extends Wrapper {
 			for (var #i = 0; #i < ${this.vars.each_block_value}.${length}; #i += 1) {
 				let child_ctx = ${this.vars.get_each_context}(ctx, ${this.vars.each_block_value}, #i);
 				let key = ${get_key}(child_ctx);
-				${blocks}[#i] = ${lookup}[key] = ${create_each_block}(#component, key, child_ctx);
+				${blocks}[#i] = ${lookup}[key] = ${create_each_block}($$, key, child_ctx);
 			}
 		`);
 
@@ -343,7 +343,7 @@ export default class EachBlockWrapper extends Wrapper {
 
 			${this.block.hasOutros && `@group_outros();`}
 			${this.node.hasAnimation && `for (let #i = 0; #i < ${blocks}.length; #i += 1) ${blocks}[#i].r();`}
-			${blocks} = @updateKeyedEach(${blocks}, #component, changed, ${get_key}, ${dynamic ? '1' : '0'}, ctx, ${this.vars.each_block_value}, ${lookup}, ${updateMountNode}, ${destroy}, ${create_each_block}, "${mountOrIntro}", ${anchor}, ${this.vars.get_each_context});
+			${blocks} = @updateKeyedEach(${blocks}, $$, changed, ${get_key}, ${dynamic ? '1' : '0'}, ctx, ${this.vars.each_block_value}, ${lookup}, ${updateMountNode}, ${destroy}, ${create_each_block}, "${mountOrIntro}", ${anchor}, ${this.vars.get_each_context});
 			${this.node.hasAnimation && `for (let #i = 0; #i < ${blocks}.length; #i += 1) ${blocks}[#i].a();`}
 		`);
 
@@ -378,7 +378,7 @@ export default class EachBlockWrapper extends Wrapper {
 			var ${iterations} = [];
 
 			for (var #i = 0; #i < ${this.vars.each_block_value}.${length}; #i += 1) {
-				${iterations}[#i] = ${create_each_block}(#component, ${this.vars.get_each_context}(ctx, ${this.vars.each_block_value}, #i));
+				${iterations}[#i] = ${create_each_block}($$, ${this.vars.get_each_context}(ctx, ${this.vars.each_block_value}, #i));
 			}
 		`);
 
@@ -440,7 +440,7 @@ export default class EachBlockWrapper extends Wrapper {
 						if (${iterations}[#i]) {
 							${iterations}[#i].p(changed, child_ctx);
 						} else {
-							${iterations}[#i] = ${create_each_block}(#component, child_ctx);
+							${iterations}[#i] = ${create_each_block}($$, child_ctx);
 							${iterations}[#i].c();
 						}
 						${iterations}[#i].i(${updateMountNode}, ${anchor});
@@ -449,13 +449,13 @@ export default class EachBlockWrapper extends Wrapper {
 						if (${iterations}[#i]) {
 							${iterations}[#i].p(changed, child_ctx);
 						} else {
-							${iterations}[#i] = ${create_each_block}(#component, child_ctx);
+							${iterations}[#i] = ${create_each_block}($$, child_ctx);
 							${iterations}[#i].c();
 							${iterations}[#i].m(${updateMountNode}, ${anchor});
 						}
 					`
 				: deindent`
-					${iterations}[#i] = ${create_each_block}(#component, child_ctx);
+					${iterations}[#i] = ${create_each_block}($$, child_ctx);
 					${iterations}[#i].c();
 					${iterations}[#i].${mountOrIntro}(${updateMountNode}, ${anchor});
 				`;
diff --git a/src/compile/render-dom/wrappers/Element/Binding.ts b/src/compile/render-dom/wrappers/Element/Binding.ts
index 672fb21ab7..4a2df8af70 100644
--- a/src/compile/render-dom/wrappers/Element/Binding.ts
+++ b/src/compile/render-dom/wrappers/Element/Binding.ts
@@ -123,11 +123,11 @@ export default class BindingWrapper {
 				const bindingGroup = getBindingGroup(parent.renderer, this.node.expression.node);
 
 				block.builders.hydrate.addLine(
-					`(#component.$$.binding_groups[${bindingGroup}] || (#component.$$.binding_groups[${bindingGroup}] = [])).push(${parent.var});`
+					`($$.binding_groups[${bindingGroup}] || ($$.binding_groups[${bindingGroup}] = [])).push(${parent.var});`
 				);
 
 				block.builders.destroy.addLine(
-					`#component.$$.binding_groups[${bindingGroup}].splice(#component.$$.binding_groups[${bindingGroup}].indexOf(${parent.var}), 1);`
+					`$$.binding_groups[${bindingGroup}].splice($$.binding_groups[${bindingGroup}].indexOf(${parent.var}), 1);`
 				);
 				break;
 
diff --git a/src/compile/render-dom/wrappers/IfBlock.ts b/src/compile/render-dom/wrappers/IfBlock.ts
index 594f811090..0b49412058 100644
--- a/src/compile/render-dom/wrappers/IfBlock.ts
+++ b/src/compile/render-dom/wrappers/IfBlock.ts
@@ -222,7 +222,7 @@ export default class IfBlockWrapper extends Wrapper {
 
 		block.builders.init.addBlock(deindent`
 			var ${current_block_type} = ${select_block_type}(ctx);
-			var ${name} = ${current_block_type_and}${current_block_type}(#component, ctx);
+			var ${name} = ${current_block_type_and}${current_block_type}($$, ctx);
 		`);
 
 		const mountOrIntro = this.branches[0].block.hasIntroMethod ? 'i' : 'm';
@@ -237,7 +237,7 @@ export default class IfBlockWrapper extends Wrapper {
 
 		const changeBlock = deindent`
 			${if_name}${name}.d(1);
-			${name} = ${current_block_type_and}${current_block_type}(#component, ctx);
+			${name} = ${current_block_type_and}${current_block_type}($$, ctx);
 			${if_name}${name}.c();
 			${if_name}${name}.${mountOrIntro}(${updateMountNode}, ${anchor});
 		`;
@@ -301,12 +301,12 @@ export default class IfBlockWrapper extends Wrapper {
 		if (hasElse) {
 			block.builders.init.addBlock(deindent`
 				${current_block_type_index} = ${select_block_type}(ctx);
-				${name} = ${if_blocks}[${current_block_type_index}] = ${if_block_creators}[${current_block_type_index}](#component, ctx);
+				${name} = ${if_blocks}[${current_block_type_index}] = ${if_block_creators}[${current_block_type_index}]($$, ctx);
 			`);
 		} else {
 			block.builders.init.addBlock(deindent`
 				if (~(${current_block_type_index} = ${select_block_type}(ctx))) {
-					${name} = ${if_blocks}[${current_block_type_index}] = ${if_block_creators}[${current_block_type_index}](#component, ctx);
+					${name} = ${if_blocks}[${current_block_type_index}] = ${if_block_creators}[${current_block_type_index}]($$, ctx);
 				}
 			`);
 		}
@@ -332,7 +332,7 @@ export default class IfBlockWrapper extends Wrapper {
 		const createNewBlock = deindent`
 			${name} = ${if_blocks}[${current_block_type_index}];
 			if (!${name}) {
-				${name} = ${if_blocks}[${current_block_type_index}] = ${if_block_creators}[${current_block_type_index}](#component, ctx);
+				${name} = ${if_blocks}[${current_block_type_index}] = ${if_block_creators}[${current_block_type_index}]($$, ctx);
 				${name}.c();
 			}
 			${name}.${mountOrIntro}(${updateMountNode}, ${anchor});
@@ -391,7 +391,7 @@ export default class IfBlockWrapper extends Wrapper {
 		const branch = this.branches[0];
 
 		block.builders.init.addBlock(deindent`
-			var ${name} = (${branch.condition}) && ${branch.block.name}(#component, ctx);
+			var ${name} = (${branch.condition}) && ${branch.block.name}($$, ctx);
 		`);
 
 		const mountOrIntro = branch.block.hasIntroMethod ? 'i' : 'm';
@@ -410,7 +410,7 @@ export default class IfBlockWrapper extends Wrapper {
 					if (${name}) {
 						${name}.p(changed, ctx);
 					} else {
-						${name} = ${branch.block.name}(#component, ctx);
+						${name} = ${branch.block.name}($$, ctx);
 						if (${name}) ${name}.c();
 					}
 
@@ -420,7 +420,7 @@ export default class IfBlockWrapper extends Wrapper {
 					if (${name}) {
 						${name}.p(changed, ctx);
 					} else {
-						${name} = ${branch.block.name}(#component, ctx);
+						${name} = ${branch.block.name}($$, ctx);
 						${name}.c();
 						${name}.m(${updateMountNode}, ${anchor});
 					}
@@ -428,14 +428,14 @@ export default class IfBlockWrapper extends Wrapper {
 			: (branch.block.hasIntroMethod || branch.block.hasOutroMethod)
 				? deindent`
 					if (!${name}) {
-						${name} = ${branch.block.name}(#component, ctx);
+						${name} = ${branch.block.name}($$, ctx);
 						${name}.c();
 					}
 					${name}.i(${updateMountNode}, ${anchor});
 				`
 				: deindent`
 					if (!${name}) {
-						${name} = ${branch.block.name}(#component, ctx);
+						${name} = ${branch.block.name}($$, ctx);
 						${name}.c();
 						${name}.m(${updateMountNode}, ${anchor});
 					}
diff --git a/src/compile/render-dom/wrappers/Slot.ts b/src/compile/render-dom/wrappers/Slot.ts
index 10052f17e0..954c4c56ef 100644
--- a/src/compile/render-dom/wrappers/Slot.ts
+++ b/src/compile/render-dom/wrappers/Slot.ts
@@ -46,7 +46,7 @@ export default class SlotWrapper extends Wrapper {
 
 		const content_name = block.getUniqueName(`slot_content_${sanitize(slotName)}`);
 		const prop = quotePropIfNecessary(slotName);
-		block.addVariable(content_name, `#component.$$.slotted${prop}`);
+		block.addVariable(content_name, `$$.slotted${prop}`);
 
 		// TODO can we use isDomNode instead of type === 'Element'?
 		const needsAnchorBefore = this.prev ? this.prev.node.type !== 'Element' : !parentNode;
diff --git a/src/internal/Component.js b/src/internal/Component.js
index ec8de48d81..a1607f0b30 100644
--- a/src/internal/Component.js
+++ b/src/internal/Component.js
@@ -98,7 +98,7 @@ export function init(component, options, instance, create_fragment, not_equal) {
 	$$.update();
 	ready = true;
 	run_all($$.before_render);
-	$$.fragment = create_fragment(component, $$.ctx);
+	$$.fragment = create_fragment($$, $$.ctx);
 
 	if (options.target) {
 		intros.enabled = !!options.intro;
diff --git a/src/internal/await-block.js b/src/internal/await-block.js
index 5db7c8f1e5..812bf6c860 100644
--- a/src/internal/await-block.js
+++ b/src/internal/await-block.js
@@ -11,7 +11,7 @@ export function handlePromise(promise, info) {
 		info.resolved = key && { [key]: value };
 
 		const child_ctx = assign(assign({}, info.ctx), info.resolved);
-		const block = type && (info.current = type)(info.component, child_ctx);
+		const block = type && (info.current = type)(info.$$, child_ctx);
 
 		if (info.block) {
 			if (info.blocks) {
@@ -32,7 +32,7 @@ export function handlePromise(promise, info) {
 			block[block.i ? 'i' : 'm'](info.mount(), info.anchor);
 
 			// TODO is some of this redundant?
-			run_all(info.component.$$.after_render);
+			run_all(info.$$.after_render);
 			flush();
 		}
 

From 1d9ce0fff5940530ac1546368b3f392f5e81a6a6 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 15:06:42 -0500
Subject: [PATCH 21/23] update tests

---
 .../action-custom-event-handler/expected.js   |  2 +-
 test/js/samples/action/expected.js            |  2 +-
 test/js/samples/bind-width-height/expected.js |  2 +-
 .../expected.js                               |  2 +-
 .../component-static-array/expected.js        |  2 +-
 .../component-static-immutable/expected.js    |  2 +-
 .../component-static-immutable2/expected.js   |  2 +-
 test/js/samples/component-static/expected.js  |  2 +-
 .../samples/computed-collapsed-if/expected.js |  2 +-
 test/js/samples/css-media-query/expected.js   |  2 +-
 .../css-shadow-dom-keyframes/expected.js      |  2 +-
 test/js/samples/debug-empty/expected.js       |  2 +-
 .../debug-foo-bar-baz-things/expected.js      |  8 ++---
 test/js/samples/debug-foo/expected.js         |  8 ++---
 .../samples/deconflict-builtins/expected.js   |  8 ++---
 .../js/samples/deconflict-globals/expected.js |  2 +-
 .../expected.js                               |  2 +-
 test/js/samples/do-use-dataset/expected.js    |  2 +-
 .../dont-use-dataset-in-legacy/expected.js    |  2 +-
 .../dont-use-dataset-in-svg/expected.js       |  2 +-
 test/js/samples/dynamic-import/expected.js    |  2 +-
 .../each-block-changed-check/expected.js      |  8 ++---
 .../each-block-keyed-animated/expected.js     |  8 ++---
 test/js/samples/each-block-keyed/expected.js  |  8 ++---
 .../event-handler-no-passive/expected.js      |  2 +-
 test/js/samples/event-modifiers/expected.js   |  2 +-
 .../js/samples/head-no-whitespace/expected.js |  2 +-
 test/js/samples/hoisted-const/expected.js     |  2 +-
 .../js/samples/if-block-no-update/expected.js | 10 +++---
 test/js/samples/if-block-simple/expected.js   |  8 ++---
 .../expected.js                               |  2 +-
 .../inline-style-optimized-url/expected.js    |  2 +-
 .../inline-style-optimized/expected.js        |  2 +-
 .../inline-style-unoptimized/expected.js      |  2 +-
 test/js/samples/input-files/expected.js       |  2 +-
 test/js/samples/input-range/expected.js       |  2 +-
 .../input-without-blowback-guard/expected.js  |  2 +-
 .../expected.js                               |  2 +-
 .../expected.js                               |  2 +-
 .../expected.js                               |  2 +-
 .../expected.js                               |  2 +-
 test/js/samples/legacy-input-type/expected.js |  2 +-
 test/js/samples/media-bindings/expected.js    |  2 +-
 .../non-imported-component/expected.js        |  2 +-
 .../samples/select-dynamic-value/expected.js  |  2 +-
 test/js/samples/setup-method/expected.js      |  2 +-
 test/js/samples/svg-title/expected.js         |  2 +-
 test/js/samples/title/expected.js             |  2 +-
 .../use-elements-as-anchors/expected.js       | 32 +++++++++----------
 .../samples/window-binding-scroll/expected.js |  2 +-
 50 files changed, 90 insertions(+), 90 deletions(-)

diff --git a/test/js/samples/action-custom-event-handler/expected.js b/test/js/samples/action-custom-event-handler/expected.js
index afe310bad1..e4a1329c60 100644
--- a/test/js/samples/action-custom-event-handler/expected.js
+++ b/test/js/samples/action-custom-event-handler/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, createElement, detachNode, flush, init, insert, noop, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var button, foo_action, current;
 
 	return {
diff --git a/test/js/samples/action/expected.js b/test/js/samples/action/expected.js
index 5f243de833..f2f66baa2b 100644
--- a/test/js/samples/action/expected.js
+++ b/test/js/samples/action/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, createElement, detachNode, identity, init, insert, noop, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var a, link_action, current;
 
 	return {
diff --git a/test/js/samples/bind-width-height/expected.js b/test/js/samples/bind-width-height/expected.js
index 6b8565e88f..4ca71de2cf 100644
--- a/test/js/samples/bind-width-height/expected.js
+++ b/test/js/samples/bind-width-height/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addResizeListener, add_render_callback, createElement, detachNode, flush, init, insert, noop, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var div, div_resize_listener, current;
 
 	return {
diff --git a/test/js/samples/collapses-text-around-comments/expected.js b/test/js/samples/collapses-text-around-comments/expected.js
index 3e4329e88e..26b8dac055 100644
--- a/test/js/samples/collapses-text-around-comments/expected.js
+++ b/test/js/samples/collapses-text-around-comments/expected.js
@@ -8,7 +8,7 @@ function add_css() {
 	append(document.head, style);
 }
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var p, text, current;
 
 	return {
diff --git a/test/js/samples/component-static-array/expected.js b/test/js/samples/component-static-array/expected.js
index 8fbc4a6b2d..f39cb4c328 100644
--- a/test/js/samples/component-static-array/expected.js
+++ b/test/js/samples/component-static-array/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, init, mount_component, noop, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var current;
 
 	var nested = new ctx.Nested({ props: { foo: [1, 2, 3] } });
diff --git a/test/js/samples/component-static-immutable/expected.js b/test/js/samples/component-static-immutable/expected.js
index 545b857699..a33a09a093 100644
--- a/test/js/samples/component-static-immutable/expected.js
+++ b/test/js/samples/component-static-immutable/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, init, mount_component, noop, not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var current;
 
 	var nested = new ctx.Nested({ props: { foo: "bar" } });
diff --git a/test/js/samples/component-static-immutable2/expected.js b/test/js/samples/component-static-immutable2/expected.js
index 545b857699..a33a09a093 100644
--- a/test/js/samples/component-static-immutable2/expected.js
+++ b/test/js/samples/component-static-immutable2/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, init, mount_component, noop, not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var current;
 
 	var nested = new ctx.Nested({ props: { foo: "bar" } });
diff --git a/test/js/samples/component-static/expected.js b/test/js/samples/component-static/expected.js
index 1f888cc8f7..df8a0d3274 100644
--- a/test/js/samples/component-static/expected.js
+++ b/test/js/samples/component-static/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, init, mount_component, noop, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var current;
 
 	var nested = new ctx.Nested({ props: { foo: "bar" } });
diff --git a/test/js/samples/computed-collapsed-if/expected.js b/test/js/samples/computed-collapsed-if/expected.js
index 38a567dfbe..39c7f85bc8 100644
--- a/test/js/samples/computed-collapsed-if/expected.js
+++ b/test/js/samples/computed-collapsed-if/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, flush, init, noop, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var current;
 
 	return {
diff --git a/test/js/samples/css-media-query/expected.js b/test/js/samples/css-media-query/expected.js
index a556c368a2..f130945c4b 100644
--- a/test/js/samples/css-media-query/expected.js
+++ b/test/js/samples/css-media-query/expected.js
@@ -8,7 +8,7 @@ function add_css() {
 	append(document.head, style);
 }
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var div, current;
 
 	return {
diff --git a/test/js/samples/css-shadow-dom-keyframes/expected.js b/test/js/samples/css-shadow-dom-keyframes/expected.js
index 267439fba1..bf56378e2d 100644
--- a/test/js/samples/css-shadow-dom-keyframes/expected.js
+++ b/test/js/samples/css-shadow-dom-keyframes/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteElement, createElement, detachNode, identity, init, insert, noop, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var div, current;
 
 	return {
diff --git a/test/js/samples/debug-empty/expected.js b/test/js/samples/debug-empty/expected.js
index 57d88a13b0..16313a1a50 100644
--- a/test/js/samples/debug-empty/expected.js
+++ b/test/js/samples/debug-empty/expected.js
@@ -3,7 +3,7 @@ import { SvelteComponentDev, addLoc, append, createElement, createText, detachNo
 
 const file = undefined;
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var h1, text0, text1, text2, text3, current;
 
 	return {
diff --git a/test/js/samples/debug-foo-bar-baz-things/expected.js b/test/js/samples/debug-foo-bar-baz-things/expected.js
index 020145f53c..7183e59e83 100644
--- a/test/js/samples/debug-foo-bar-baz-things/expected.js
+++ b/test/js/samples/debug-foo-bar-baz-things/expected.js
@@ -10,7 +10,7 @@ function get_each_context(ctx, list, i) {
 }
 
 // (1:0) {#each things as thing}
-function create_each_block(component, ctx) {
+function create_each_block($$, ctx) {
 	var span, text0_value = ctx.thing.name, text0, text1;
 
 	return {
@@ -54,7 +54,7 @@ function create_each_block(component, ctx) {
 	};
 }
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var text0, p, text1, text2, current;
 
 	var each_value = ctx.things;
@@ -62,7 +62,7 @@ function create_fragment(component, ctx) {
 	var each_blocks = [];
 
 	for (var i = 0; i < each_value.length; i += 1) {
-		each_blocks[i] = create_each_block(component, get_each_context(ctx, each_value, i));
+		each_blocks[i] = create_each_block($$, get_each_context(ctx, each_value, i));
 	}
 
 	return {
@@ -104,7 +104,7 @@ function create_fragment(component, ctx) {
 					if (each_blocks[i]) {
 						each_blocks[i].p(changed, child_ctx);
 					} else {
-						each_blocks[i] = create_each_block(component, child_ctx);
+						each_blocks[i] = create_each_block($$, child_ctx);
 						each_blocks[i].c();
 						each_blocks[i].m(text0.parentNode, text0);
 					}
diff --git a/test/js/samples/debug-foo/expected.js b/test/js/samples/debug-foo/expected.js
index 69fc7d7f04..93fbdc2f21 100644
--- a/test/js/samples/debug-foo/expected.js
+++ b/test/js/samples/debug-foo/expected.js
@@ -10,7 +10,7 @@ function get_each_context(ctx, list, i) {
 }
 
 // (1:0) {#each things as thing}
-function create_each_block(component, ctx) {
+function create_each_block($$, ctx) {
 	var span, text0_value = ctx.thing.name, text0, text1;
 
 	return {
@@ -54,7 +54,7 @@ function create_each_block(component, ctx) {
 	};
 }
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var text0, p, text1, text2, current;
 
 	var each_value = ctx.things;
@@ -62,7 +62,7 @@ function create_fragment(component, ctx) {
 	var each_blocks = [];
 
 	for (var i = 0; i < each_value.length; i += 1) {
-		each_blocks[i] = create_each_block(component, get_each_context(ctx, each_value, i));
+		each_blocks[i] = create_each_block($$, get_each_context(ctx, each_value, i));
 	}
 
 	return {
@@ -104,7 +104,7 @@ function create_fragment(component, ctx) {
 					if (each_blocks[i]) {
 						each_blocks[i].p(changed, child_ctx);
 					} else {
-						each_blocks[i] = create_each_block(component, child_ctx);
+						each_blocks[i] = create_each_block($$, child_ctx);
 						each_blocks[i].c();
 						each_blocks[i].m(text0.parentNode, text0);
 					}
diff --git a/test/js/samples/deconflict-builtins/expected.js b/test/js/samples/deconflict-builtins/expected.js
index b84d84c0ac..3f73d83574 100644
--- a/test/js/samples/deconflict-builtins/expected.js
+++ b/test/js/samples/deconflict-builtins/expected.js
@@ -8,7 +8,7 @@ function get_each_context(ctx, list, i) {
 }
 
 // (1:0) {#each createElement as node}
-function create_each_block(component, ctx) {
+function create_each_block($$, ctx) {
 	var span, text_value = ctx.node, text;
 
 	return {
@@ -36,7 +36,7 @@ function create_each_block(component, ctx) {
 	};
 }
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var each_anchor, current;
 
 	var each_value = ctx.createElement;
@@ -44,7 +44,7 @@ function create_fragment(component, ctx) {
 	var each_blocks = [];
 
 	for (var i = 0; i < each_value.length; i += 1) {
-		each_blocks[i] = create_each_block(component, get_each_context(ctx, each_value, i));
+		each_blocks[i] = create_each_block($$, get_each_context(ctx, each_value, i));
 	}
 
 	return {
@@ -75,7 +75,7 @@ function create_fragment(component, ctx) {
 					if (each_blocks[i]) {
 						each_blocks[i].p(changed, child_ctx);
 					} else {
-						each_blocks[i] = create_each_block(component, child_ctx);
+						each_blocks[i] = create_each_block($$, child_ctx);
 						each_blocks[i].c();
 						each_blocks[i].m(each_anchor.parentNode, each_anchor);
 					}
diff --git a/test/js/samples/deconflict-globals/expected.js b/test/js/samples/deconflict-globals/expected.js
index 8e8dd84b3d..eae53e6ab6 100644
--- a/test/js/samples/deconflict-globals/expected.js
+++ b/test/js/samples/deconflict-globals/expected.js
@@ -2,7 +2,7 @@
 import { SvelteComponent as SvelteComponent_1, flush, init, noop, run, safe_not_equal } from "svelte/internal";
 import { onMount } from "svelte";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var current;
 
 	return {
diff --git a/test/js/samples/dev-warning-missing-data-computed/expected.js b/test/js/samples/dev-warning-missing-data-computed/expected.js
index 8bb6894f0b..7f52c96119 100644
--- a/test/js/samples/dev-warning-missing-data-computed/expected.js
+++ b/test/js/samples/dev-warning-missing-data-computed/expected.js
@@ -3,7 +3,7 @@ import { SvelteComponentDev, addLoc, append, createElement, createText, detachNo
 
 const file = undefined;
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var p, text0_value = Math.max(0, ctx.foo), text0, text1, text2, current;
 
 	return {
diff --git a/test/js/samples/do-use-dataset/expected.js b/test/js/samples/do-use-dataset/expected.js
index f09216c4c3..1cdc176977 100644
--- a/test/js/samples/do-use-dataset/expected.js
+++ b/test/js/samples/do-use-dataset/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, createElement, createText, detachNode, flush, init, insert, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var div0, text, div1, current;
 
 	return {
diff --git a/test/js/samples/dont-use-dataset-in-legacy/expected.js b/test/js/samples/dont-use-dataset-in-legacy/expected.js
index 9229f2fb0d..26fd86b9b6 100644
--- a/test/js/samples/dont-use-dataset-in-legacy/expected.js
+++ b/test/js/samples/dont-use-dataset-in-legacy/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, createElement, createText, detachNode, flush, init, insert, run, safe_not_equal, setAttribute } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var div0, text, div1, current;
 
 	return {
diff --git a/test/js/samples/dont-use-dataset-in-svg/expected.js b/test/js/samples/dont-use-dataset-in-svg/expected.js
index 52ba85c76b..2bb5a1d36b 100644
--- a/test/js/samples/dont-use-dataset-in-svg/expected.js
+++ b/test/js/samples/dont-use-dataset-in-svg/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, append, createSvgElement, detachNode, flush, init, insert, run, safe_not_equal, setAttribute } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var svg, g0, g1, current;
 
 	return {
diff --git a/test/js/samples/dynamic-import/expected.js b/test/js/samples/dynamic-import/expected.js
index a7cc795de2..d0e36d4936 100644
--- a/test/js/samples/dynamic-import/expected.js
+++ b/test/js/samples/dynamic-import/expected.js
@@ -2,7 +2,7 @@
 import { SvelteComponent as SvelteComponent_1, identity, init, mount_component, noop, safe_not_equal } from "svelte/internal";
 import LazyLoad from "./LazyLoad.html";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var current;
 
 	var lazyload = new LazyLoad({ props: { load: func } });
diff --git a/test/js/samples/each-block-changed-check/expected.js b/test/js/samples/each-block-changed-check/expected.js
index c9c5288cb1..cc59d354d6 100644
--- a/test/js/samples/each-block-changed-check/expected.js
+++ b/test/js/samples/each-block-changed-check/expected.js
@@ -9,7 +9,7 @@ function get_each_context(ctx, list, i) {
 }
 
 // (1:0) {#each comments as comment, i}
-function create_each_block(component, ctx) {
+function create_each_block($$, ctx) {
 	var div, strong, text0, text1, span, text2_value = ctx.comment.author, text2, text3, text4_value = ctx.elapsed(ctx.comment.time, ctx.time), text4, text5, text6, raw_value = ctx.comment.html, raw_before;
 
 	return {
@@ -67,7 +67,7 @@ function create_each_block(component, ctx) {
 	};
 }
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var text0, p, text1, current;
 
 	var each_value = ctx.comments;
@@ -75,7 +75,7 @@ function create_fragment(component, ctx) {
 	var each_blocks = [];
 
 	for (var i = 0; i < each_value.length; i += 1) {
-		each_blocks[i] = create_each_block(component, get_each_context(ctx, each_value, i));
+		each_blocks[i] = create_each_block($$, get_each_context(ctx, each_value, i));
 	}
 
 	return {
@@ -110,7 +110,7 @@ function create_fragment(component, ctx) {
 					if (each_blocks[i]) {
 						each_blocks[i].p(changed, child_ctx);
 					} else {
-						each_blocks[i] = create_each_block(component, child_ctx);
+						each_blocks[i] = create_each_block($$, child_ctx);
 						each_blocks[i].c();
 						each_blocks[i].m(text0.parentNode, text0);
 					}
diff --git a/test/js/samples/each-block-keyed-animated/expected.js b/test/js/samples/each-block-keyed-animated/expected.js
index 66db899b65..874c79c637 100644
--- a/test/js/samples/each-block-keyed-animated/expected.js
+++ b/test/js/samples/each-block-keyed-animated/expected.js
@@ -8,7 +8,7 @@ function get_each_context(ctx, list, i) {
 }
 
 // (19:0) {#each things as thing (thing.id)}
-function create_each_block(component, key_1, ctx) {
+function create_each_block($$, key_1, ctx) {
 	var div, text_value = ctx.thing.name, text, rect, stop_animation = noop;
 
 	return {
@@ -55,7 +55,7 @@ function create_each_block(component, key_1, ctx) {
 	};
 }
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var each_blocks_1 = [], each_lookup = blankObject(), each_anchor, current;
 
 	var each_value = ctx.things;
@@ -65,7 +65,7 @@ function create_fragment(component, ctx) {
 	for (var i = 0; i < each_value.length; i += 1) {
 		let child_ctx = get_each_context(ctx, each_value, i);
 		let key = get_key(child_ctx);
-		each_blocks_1[i] = each_lookup[key] = create_each_block(component, key, child_ctx);
+		each_blocks_1[i] = each_lookup[key] = create_each_block($$, key, child_ctx);
 	}
 
 	return {
@@ -85,7 +85,7 @@ function create_fragment(component, ctx) {
 		p(changed, ctx) {
 			const each_value = ctx.things;
 			for (let i = 0; i < each_blocks_1.length; i += 1) each_blocks_1[i].r();
-			each_blocks_1 = updateKeyedEach(each_blocks_1, component, changed, get_key, 1, ctx, each_value, each_lookup, each_anchor.parentNode, fixAndOutroAndDestroyBlock, create_each_block, "m", each_anchor, get_each_context);
+			each_blocks_1 = updateKeyedEach(each_blocks_1, $$, changed, get_key, 1, ctx, each_value, each_lookup, each_anchor.parentNode, fixAndOutroAndDestroyBlock, create_each_block, "m", each_anchor, get_each_context);
 			for (let i = 0; i < each_blocks_1.length; i += 1) each_blocks_1[i].a();
 		},
 
diff --git a/test/js/samples/each-block-keyed/expected.js b/test/js/samples/each-block-keyed/expected.js
index b90b33fbdd..dc6f2c98e2 100644
--- a/test/js/samples/each-block-keyed/expected.js
+++ b/test/js/samples/each-block-keyed/expected.js
@@ -8,7 +8,7 @@ function get_each_context(ctx, list, i) {
 }
 
 // (1:0) {#each things as thing (thing.id)}
-function create_each_block(component, key_1, ctx) {
+function create_each_block($$, key_1, ctx) {
 	var div, text_value = ctx.thing.name, text;
 
 	return {
@@ -41,7 +41,7 @@ function create_each_block(component, key_1, ctx) {
 	};
 }
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var each_blocks_1 = [], each_lookup = blankObject(), each_anchor, current;
 
 	var each_value = ctx.things;
@@ -51,7 +51,7 @@ function create_fragment(component, ctx) {
 	for (var i = 0; i < each_value.length; i += 1) {
 		let child_ctx = get_each_context(ctx, each_value, i);
 		let key = get_key(child_ctx);
-		each_blocks_1[i] = each_lookup[key] = create_each_block(component, key, child_ctx);
+		each_blocks_1[i] = each_lookup[key] = create_each_block($$, key, child_ctx);
 	}
 
 	return {
@@ -70,7 +70,7 @@ function create_fragment(component, ctx) {
 
 		p(changed, ctx) {
 			const each_value = ctx.things;
-			each_blocks_1 = updateKeyedEach(each_blocks_1, component, changed, get_key, 1, ctx, each_value, each_lookup, each_anchor.parentNode, destroyBlock, create_each_block, "m", each_anchor, get_each_context);
+			each_blocks_1 = updateKeyedEach(each_blocks_1, $$, changed, get_key, 1, ctx, each_value, each_lookup, each_anchor.parentNode, destroyBlock, create_each_block, "m", each_anchor, get_each_context);
 		},
 
 		i(target, anchor) {
diff --git a/test/js/samples/event-handler-no-passive/expected.js b/test/js/samples/event-handler-no-passive/expected.js
index dad32a0875..fea5cf99e2 100644
--- a/test/js/samples/event-handler-no-passive/expected.js
+++ b/test/js/samples/event-handler-no-passive/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addListener, createElement, detachNode, identity, init, insert, noop, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var a, current, dispose;
 
 	return {
diff --git a/test/js/samples/event-modifiers/expected.js b/test/js/samples/event-modifiers/expected.js
index 884a5c04c8..8d334ec04a 100644
--- a/test/js/samples/event-modifiers/expected.js
+++ b/test/js/samples/event-modifiers/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addListener, append, createElement, createText, detachNode, identity, init, insert, noop, preventDefault, run, run_all, safe_not_equal, stopPropagation } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var div, button0, text1, button1, text3, button2, current, dispose;
 
 	return {
diff --git a/test/js/samples/head-no-whitespace/expected.js b/test/js/samples/head-no-whitespace/expected.js
index 3208ccd613..58bfa6ee06 100644
--- a/test/js/samples/head-no-whitespace/expected.js
+++ b/test/js/samples/head-no-whitespace/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, append, createElement, detachNode, identity, init, noop, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var meta0, meta1, current;
 
 	return {
diff --git a/test/js/samples/hoisted-const/expected.js b/test/js/samples/hoisted-const/expected.js
index cbf17aa3dc..aa81d991e8 100644
--- a/test/js/samples/hoisted-const/expected.js
+++ b/test/js/samples/hoisted-const/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, append, createElement, createText, detachNode, identity, init, insert, noop, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var b, text_value = get_answer(), text, current;
 
 	return {
diff --git a/test/js/samples/if-block-no-update/expected.js b/test/js/samples/if-block-no-update/expected.js
index b1cc1693b2..cc01e9791a 100644
--- a/test/js/samples/if-block-no-update/expected.js
+++ b/test/js/samples/if-block-no-update/expected.js
@@ -2,7 +2,7 @@
 import { SvelteComponent as SvelteComponent_1, createComment, createElement, detachNode, flush, init, insert, run, safe_not_equal } from "svelte/internal";
 
 // (3:0) {:else}
-function create_else_block(component, ctx) {
+function create_else_block($$, ctx) {
 	var p;
 
 	return {
@@ -24,7 +24,7 @@ function create_else_block(component, ctx) {
 }
 
 // (1:0) {#if foo}
-function create_if_block(component, ctx) {
+function create_if_block($$, ctx) {
 	var p;
 
 	return {
@@ -45,7 +45,7 @@ function create_if_block(component, ctx) {
 	};
 }
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var if_block_anchor, current;
 
 	function select_block_type(ctx) {
@@ -54,7 +54,7 @@ function create_fragment(component, ctx) {
 	}
 
 	var current_block_type = select_block_type(ctx);
-	var if_block = current_block_type(component, ctx);
+	var if_block = current_block_type($$, ctx);
 
 	return {
 		c() {
@@ -71,7 +71,7 @@ function create_fragment(component, ctx) {
 		p(changed, ctx) {
 			if (current_block_type !== (current_block_type = select_block_type(ctx))) {
 				if_block.d(1);
-				if_block = current_block_type(component, ctx);
+				if_block = current_block_type($$, ctx);
 				if_block.c();
 				if_block.m(if_block_anchor.parentNode, if_block_anchor);
 			}
diff --git a/test/js/samples/if-block-simple/expected.js b/test/js/samples/if-block-simple/expected.js
index 08e7ec2866..054ee7219b 100644
--- a/test/js/samples/if-block-simple/expected.js
+++ b/test/js/samples/if-block-simple/expected.js
@@ -2,7 +2,7 @@
 import { SvelteComponent as SvelteComponent_1, createComment, createElement, detachNode, flush, init, insert, run, safe_not_equal } from "svelte/internal";
 
 // (1:0) {#if foo}
-function create_if_block(component, ctx) {
+function create_if_block($$, ctx) {
 	var p;
 
 	return {
@@ -23,10 +23,10 @@ function create_if_block(component, ctx) {
 	};
 }
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var if_block_anchor, current;
 
-	var if_block = (ctx.foo) && create_if_block(component, ctx);
+	var if_block = (ctx.foo) && create_if_block($$, ctx);
 
 	return {
 		c() {
@@ -43,7 +43,7 @@ function create_fragment(component, ctx) {
 		p(changed, ctx) {
 			if (ctx.foo) {
 				if (!if_block) {
-					if_block = create_if_block(component, ctx);
+					if_block = create_if_block($$, ctx);
 					if_block.c();
 					if_block.m(if_block_anchor.parentNode, if_block_anchor);
 				}
diff --git a/test/js/samples/inline-style-optimized-multiple/expected.js b/test/js/samples/inline-style-optimized-multiple/expected.js
index 92257c8bd1..f4ac24f484 100644
--- a/test/js/samples/inline-style-optimized-multiple/expected.js
+++ b/test/js/samples/inline-style-optimized-multiple/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, createElement, detachNode, flush, init, insert, run, safe_not_equal, setStyle } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var div, current;
 
 	return {
diff --git a/test/js/samples/inline-style-optimized-url/expected.js b/test/js/samples/inline-style-optimized-url/expected.js
index 9404253d97..da4f91c1d2 100644
--- a/test/js/samples/inline-style-optimized-url/expected.js
+++ b/test/js/samples/inline-style-optimized-url/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, createElement, detachNode, flush, init, insert, run, safe_not_equal, setStyle } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var div, current;
 
 	return {
diff --git a/test/js/samples/inline-style-optimized/expected.js b/test/js/samples/inline-style-optimized/expected.js
index 91a2cff9d1..84056cfd50 100644
--- a/test/js/samples/inline-style-optimized/expected.js
+++ b/test/js/samples/inline-style-optimized/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, createElement, detachNode, flush, init, insert, run, safe_not_equal, setStyle } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var div, current;
 
 	return {
diff --git a/test/js/samples/inline-style-unoptimized/expected.js b/test/js/samples/inline-style-unoptimized/expected.js
index 2ca3e54257..1f66ec8766 100644
--- a/test/js/samples/inline-style-unoptimized/expected.js
+++ b/test/js/samples/inline-style-unoptimized/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, createElement, createText, detachNode, flush, init, insert, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var div0, text, div1, div1_style_value, current;
 
 	return {
diff --git a/test/js/samples/input-files/expected.js b/test/js/samples/input-files/expected.js
index 8ca98b3b5b..baab165695 100644
--- a/test/js/samples/input-files/expected.js
+++ b/test/js/samples/input-files/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addListener, createElement, detachNode, flush, init, insert, noop, run, safe_not_equal, setAttribute } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var input, current, dispose;
 
 	return {
diff --git a/test/js/samples/input-range/expected.js b/test/js/samples/input-range/expected.js
index 2a93c131c9..1d90cf146c 100644
--- a/test/js/samples/input-range/expected.js
+++ b/test/js/samples/input-range/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addListener, createElement, detachNode, flush, init, insert, run, run_all, safe_not_equal, setAttribute, toNumber } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var input, current, dispose;
 
 	return {
diff --git a/test/js/samples/input-without-blowback-guard/expected.js b/test/js/samples/input-without-blowback-guard/expected.js
index fe2791a31c..3c5f57391b 100644
--- a/test/js/samples/input-without-blowback-guard/expected.js
+++ b/test/js/samples/input-without-blowback-guard/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addListener, createElement, detachNode, flush, init, insert, run, safe_not_equal, setAttribute } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var input, current, dispose;
 
 	return {
diff --git a/test/js/samples/instrumentation-script-if-no-block/expected.js b/test/js/samples/instrumentation-script-if-no-block/expected.js
index 0d1b0b9780..b8c0cb22e1 100644
--- a/test/js/samples/instrumentation-script-if-no-block/expected.js
+++ b/test/js/samples/instrumentation-script-if-no-block/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addListener, append, createElement, createText, detachNode, init, insert, run, safe_not_equal, setData } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var button, text1, p, text2, text3, current, dispose;
 
 	return {
diff --git a/test/js/samples/instrumentation-script-x-equals-x/expected.js b/test/js/samples/instrumentation-script-x-equals-x/expected.js
index 221088fef5..429bf51fae 100644
--- a/test/js/samples/instrumentation-script-x-equals-x/expected.js
+++ b/test/js/samples/instrumentation-script-x-equals-x/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addListener, append, createElement, createText, detachNode, init, insert, run, safe_not_equal, setData } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var button, text1, p, text2, text3_value = ctx.things.length, text3, current, dispose;
 
 	return {
diff --git a/test/js/samples/instrumentation-template-if-no-block/expected.js b/test/js/samples/instrumentation-template-if-no-block/expected.js
index b1b4a5b8ce..8aba31fc4d 100644
--- a/test/js/samples/instrumentation-template-if-no-block/expected.js
+++ b/test/js/samples/instrumentation-template-if-no-block/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addListener, append, createElement, createText, detachNode, init, insert, run, safe_not_equal, setData } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var button, text1, p, text2, text3, current, dispose;
 
 	return {
diff --git a/test/js/samples/instrumentation-template-x-equals-x/expected.js b/test/js/samples/instrumentation-template-x-equals-x/expected.js
index 8dbcb10263..6136f16432 100644
--- a/test/js/samples/instrumentation-template-x-equals-x/expected.js
+++ b/test/js/samples/instrumentation-template-x-equals-x/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addListener, append, createElement, createText, detachNode, init, insert, run, safe_not_equal, setData } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var button, text1, p, text2, text3_value = ctx.things.length, text3, current, dispose;
 
 	return {
diff --git a/test/js/samples/legacy-input-type/expected.js b/test/js/samples/legacy-input-type/expected.js
index 94cfc8eab0..de095d7c0a 100644
--- a/test/js/samples/legacy-input-type/expected.js
+++ b/test/js/samples/legacy-input-type/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, createElement, detachNode, identity, init, insert, noop, run, safe_not_equal, setInputType } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var input, current;
 
 	return {
diff --git a/test/js/samples/media-bindings/expected.js b/test/js/samples/media-bindings/expected.js
index 4b2c70fdb8..645a7d9b0f 100644
--- a/test/js/samples/media-bindings/expected.js
+++ b/test/js/samples/media-bindings/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addListener, add_render_callback, createElement, detachNode, flush, init, insert, run, run_all, safe_not_equal, timeRangesToArray } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var audio, audio_updating = false, audio_animationframe, audio_is_paused = true, current, dispose;
 
 	function audio_timeupdate_handler() {
diff --git a/test/js/samples/non-imported-component/expected.js b/test/js/samples/non-imported-component/expected.js
index 4ef3582503..32a772b3b5 100644
--- a/test/js/samples/non-imported-component/expected.js
+++ b/test/js/samples/non-imported-component/expected.js
@@ -2,7 +2,7 @@
 import { SvelteComponent as SvelteComponent_1, callAfter, createText, detachNode, identity, init, insert, mount_component, noop, safe_not_equal } from "svelte/internal";
 import Imported from "Imported.html";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var text, current;
 
 	var imported = new Imported({});
diff --git a/test/js/samples/select-dynamic-value/expected.js b/test/js/samples/select-dynamic-value/expected.js
index ed3f1248c1..6788f18fd0 100644
--- a/test/js/samples/select-dynamic-value/expected.js
+++ b/test/js/samples/select-dynamic-value/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, append, createElement, detachNode, flush, init, insert, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var select, option0, option1, select_value_value, current;
 
 	return {
diff --git a/test/js/samples/setup-method/expected.js b/test/js/samples/setup-method/expected.js
index 18fc6e61ec..257de1d245 100644
--- a/test/js/samples/setup-method/expected.js
+++ b/test/js/samples/setup-method/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, identity, init, noop, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var current;
 
 	return {
diff --git a/test/js/samples/svg-title/expected.js b/test/js/samples/svg-title/expected.js
index 8e0cdc866b..ed67789799 100644
--- a/test/js/samples/svg-title/expected.js
+++ b/test/js/samples/svg-title/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, append, createSvgElement, createText, detachNode, identity, init, insert, noop, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var svg, title, text, current;
 
 	return {
diff --git a/test/js/samples/title/expected.js b/test/js/samples/title/expected.js
index e92cf04e7d..cfac2c0ad1 100644
--- a/test/js/samples/title/expected.js
+++ b/test/js/samples/title/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, flush, init, noop, run, safe_not_equal } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var title_value, current;
 
 	document.title = title_value = "a " + ctx.custom + " title";
diff --git a/test/js/samples/use-elements-as-anchors/expected.js b/test/js/samples/use-elements-as-anchors/expected.js
index 021fbde06d..e6610407e4 100644
--- a/test/js/samples/use-elements-as-anchors/expected.js
+++ b/test/js/samples/use-elements-as-anchors/expected.js
@@ -2,7 +2,7 @@
 import { SvelteComponent as SvelteComponent_1, append, createComment, createElement, createText, detachNode, flush, init, insert, run, safe_not_equal } from "svelte/internal";
 
 // (2:1) {#if a}
-function create_if_block_4(component, ctx) {
+function create_if_block_4($$, ctx) {
 	var p;
 
 	return {
@@ -24,7 +24,7 @@ function create_if_block_4(component, ctx) {
 }
 
 // (8:1) {#if b}
-function create_if_block_3(component, ctx) {
+function create_if_block_3($$, ctx) {
 	var p;
 
 	return {
@@ -46,7 +46,7 @@ function create_if_block_3(component, ctx) {
 }
 
 // (12:1) {#if c}
-function create_if_block_2(component, ctx) {
+function create_if_block_2($$, ctx) {
 	var p;
 
 	return {
@@ -68,7 +68,7 @@ function create_if_block_2(component, ctx) {
 }
 
 // (18:1) {#if d}
-function create_if_block_1(component, ctx) {
+function create_if_block_1($$, ctx) {
 	var p;
 
 	return {
@@ -90,7 +90,7 @@ function create_if_block_1(component, ctx) {
 }
 
 // (25:0) {#if e}
-function create_if_block(component, ctx) {
+function create_if_block($$, ctx) {
 	var p;
 
 	return {
@@ -111,18 +111,18 @@ function create_if_block(component, ctx) {
 	};
 }
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var div, text0, p0, text2, text3, text4, p1, text6, text7, if_block4_anchor, current;
 
-	var if_block0 = (ctx.a) && create_if_block_4(component, ctx);
+	var if_block0 = (ctx.a) && create_if_block_4($$, ctx);
 
-	var if_block1 = (ctx.b) && create_if_block_3(component, ctx);
+	var if_block1 = (ctx.b) && create_if_block_3($$, ctx);
 
-	var if_block2 = (ctx.c) && create_if_block_2(component, ctx);
+	var if_block2 = (ctx.c) && create_if_block_2($$, ctx);
 
-	var if_block3 = (ctx.d) && create_if_block_1(component, ctx);
+	var if_block3 = (ctx.d) && create_if_block_1($$, ctx);
 
-	var if_block4 = (ctx.e) && create_if_block(component, ctx);
+	var if_block4 = (ctx.e) && create_if_block($$, ctx);
 
 	return {
 		c() {
@@ -167,7 +167,7 @@ function create_fragment(component, ctx) {
 		p(changed, ctx) {
 			if (ctx.a) {
 				if (!if_block0) {
-					if_block0 = create_if_block_4(component, ctx);
+					if_block0 = create_if_block_4($$, ctx);
 					if_block0.c();
 					if_block0.m(div, text0);
 				}
@@ -178,7 +178,7 @@ function create_fragment(component, ctx) {
 
 			if (ctx.b) {
 				if (!if_block1) {
-					if_block1 = create_if_block_3(component, ctx);
+					if_block1 = create_if_block_3($$, ctx);
 					if_block1.c();
 					if_block1.m(div, text3);
 				}
@@ -189,7 +189,7 @@ function create_fragment(component, ctx) {
 
 			if (ctx.c) {
 				if (!if_block2) {
-					if_block2 = create_if_block_2(component, ctx);
+					if_block2 = create_if_block_2($$, ctx);
 					if_block2.c();
 					if_block2.m(div, text4);
 				}
@@ -200,7 +200,7 @@ function create_fragment(component, ctx) {
 
 			if (ctx.d) {
 				if (!if_block3) {
-					if_block3 = create_if_block_1(component, ctx);
+					if_block3 = create_if_block_1($$, ctx);
 					if_block3.c();
 					if_block3.m(div, null);
 				}
@@ -211,7 +211,7 @@ function create_fragment(component, ctx) {
 
 			if (ctx.e) {
 				if (!if_block4) {
-					if_block4 = create_if_block(component, ctx);
+					if_block4 = create_if_block($$, ctx);
 					if_block4.c();
 					if_block4.m(if_block4_anchor.parentNode, if_block4_anchor);
 				}
diff --git a/test/js/samples/window-binding-scroll/expected.js b/test/js/samples/window-binding-scroll/expected.js
index a539b38dc2..0fded5c925 100644
--- a/test/js/samples/window-binding-scroll/expected.js
+++ b/test/js/samples/window-binding-scroll/expected.js
@@ -1,7 +1,7 @@
 /* generated by Svelte vX.Y.Z */
 import { SvelteComponent as SvelteComponent_1, addListener, add_render_callback, append, createElement, createText, detachNode, flush, init, insert, run, safe_not_equal, setData } from "svelte/internal";
 
-function create_fragment(component, ctx) {
+function create_fragment($$, ctx) {
 	var scrolling = false, clear_scrolling = () => { scrolling = false }, scrolling_timeout, p, text0, text1, current, dispose;
 
 	add_render_callback(ctx.onwindowscroll);

From 81ec3404bc8bf239648dbb0ad780481432773c08 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 16:25:28 -0500
Subject: [PATCH 22/23] remove unused line

---
 src/internal/await-block.js | 2 --
 1 file changed, 2 deletions(-)

diff --git a/src/internal/await-block.js b/src/internal/await-block.js
index 812bf6c860..8949d0d6bd 100644
--- a/src/internal/await-block.js
+++ b/src/internal/await-block.js
@@ -31,8 +31,6 @@ export function handlePromise(promise, info) {
 			block.c();
 			block[block.i ? 'i' : 'm'](info.mount(), info.anchor);
 
-			// TODO is some of this redundant?
-			run_all(info.$$.after_render);
 			flush();
 		}
 

From 2c47b34c1f490ff66a5f5a625af015b896de1bb3 Mon Sep 17 00:00:00 2001
From: Richard Harris <richard.a.harris@gmail.com>
Date: Tue, 1 Jan 2019 16:26:43 -0500
Subject: [PATCH 23/23] remove unused import

---
 src/internal/await-block.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/src/internal/await-block.js b/src/internal/await-block.js
index 8949d0d6bd..9f49c13e55 100644
--- a/src/internal/await-block.js
+++ b/src/internal/await-block.js
@@ -1,4 +1,4 @@
-import { assign, run_all, isPromise } from './utils.js';
+import { assign, isPromise } from './utils.js';
 import { group_outros } from './transitions.js';
 import { flush } from '../internal/scheduler.js';