add tests

test/runtime/samples/transition-js-each-else-block-intro-outro/_config.js

@@ -0,0 +1,54 @@
+export default {
+  props: {
+    things: ['a', 'b', 'c']
+  },
+
+  test({ assert, component, target, window, raf }) {
+    component.things = [];
+    let div = target.querySelector('div');
+    assert.equal(div.foo, 0);
+
+    raf.tick(200);
+    assert.equal(div.foo, 0.5);
+
+    raf.tick(300);
+    assert.equal(div.foo, 0.75);
+
+    raf.tick(400);
+    assert.equal(div.foo, 1);
+
+    raf.tick(600);
+    component.things = ['a', 'b', 'c'];
+
+    raf.tick(700);
+    assert.equal(div.foo, 1);
+    assert.equal(div.bar, 0.75);
+
+    raf.tick(800);
+    assert.equal(div.foo, 1);
+    assert.equal(div.bar, 0.5);
+
+    raf.tick(900);
+    assert.equal(div.foo, 1);
+    assert.equal(div.bar, 0.25);
+
+    // test outro before intro complete
+    raf.tick(1000);
+    component.things = [];
+    div = target.querySelector('div');
+
+    raf.tick(1200);
+    assert.equal(div.foo, 0.5);
+
+    component.things = ['a', 'b', 'c'];
+    raf.tick(1300);
+    assert.equal(div.foo, 0.75);
+    assert.equal(div.bar, 0.75);
+
+    raf.tick(1400);
+    assert.equal(div.foo, 1);
+    assert.equal(div.bar, 0.5);
+
+    raf.tick(2000);
+  }
+};

test/runtime/samples/transition-js-each-else-block-intro-outro/main.svelte

@@ -0,0 +1,27 @@
+<script>
+	export let things;
+
+	function foo(node, params) {
+		return {
+			duration: 400,
+			tick: t => {
+				node.foo = t;
+			}
+		};
+	}
+
+  function bar(node, params) {
+    return {
+      duration: 400,
+      tick: t => {
+        node.bar = t;
+      }
+    };
+  }
+</script>
+
+{#each things as thing}
+  <p>{thing}</p>
+  {:else}
+  <div in:foo out:bar>else</div>
+{/each}

test/runtime/samples/transition-js-each-else-block-intro/_config.js

@@ -0,0 +1,22 @@
+export default {
+  props: {
+    things: ['a', 'b', 'c']
+  },
+
+  test({ assert, component, target, window, raf }) {
+    component.things = [];
+    const div = target.querySelector('div');
+    assert.equal(div.foo, 0);
+
+    raf.tick(200);
+    assert.equal(div.foo, 0.5);
+
+    raf.tick(300);
+    assert.equal(div.foo, 0.75);
+
+    raf.tick(400);
+    assert.equal(div.foo, 1);
+
+    raf.tick(500);
+  }
+};

test/runtime/samples/transition-js-each-else-block-intro/main.svelte

@@ -0,0 +1,18 @@
+<script>
+	export let things;
+
+	function foo(node, params) {
+		return {
+			duration: 400,
+			tick: t => {
+				node.foo = t;
+			}
+		};
+	}
+</script>
+
+{#each things as thing}
+  <p>{thing}</p>
+  {:else}
+  <div in:foo>else</div>
+{/each}

test/runtime/samples/transition-js-each-else-block-outro/_config.js

@@ -0,0 +1,20 @@
+export default {
+  props: {
+    things: []
+  },
+  test({ assert, component, target, window, raf }) {
+    const div = target.querySelector('div');
+    component.things = ['a', 'b', 'c'];
+
+    raf.tick(200);
+    assert.equal(div.foo, 0.5);
+
+    raf.tick(300);
+    assert.equal(div.foo, 0.25);
+
+    raf.tick(400);
+    assert.equal(div.foo, 0);
+
+    raf.tick(500);
+  }
+};

test/runtime/samples/transition-js-each-else-block-outro/main.svelte

@@ -0,0 +1,18 @@
+<script>
+	export let things;
+
+	function foo(node, params) {
+		return {
+			duration: 400,
+			tick: t => {
+				node.foo = t;
+			}
+		};
+	}
+</script>
+
+{#each things as thing}
+  <p>{thing}</p>
+{:else}
+  <div out:foo>else</div>
+{/each}