reenable skipped test due to jsdom

test/helpers.js

@@ -59,6 +59,12 @@ for (const key of Object.getOwnPropertyNames(global)) {
 	window[key] = window[key] || global[key];
 }
 
+// implement mock scroll
+window.scrollTo = function(pageXOffset, pageYOffset) {
+	window.pageXOffset = pageXOffset;
+	window.pageYOffset = pageYOffset;
+};
+
 export function env() {
 	window.document.title = '';
 	window.document.body.innerHTML = '<main></main>';
@@ -205,3 +211,25 @@ export function spaces(i) {
 	while (i--) result += ' ';
 	return result;
 }
+
+// fake timers
+const original_set_timeout = global.setTimeout;
+
+export function useFakeTimers() {
+	const callbacks = [];
+
+	global.setTimeout = function(fn) {
+		callbacks.push(fn);
+	};
+
+	return {
+		flush() {
+			callbacks.forEach(fn => fn());
+			callbacks.splice(0, callbacks.length);
+		},
+		removeFakeTimers() {
+			callbacks.splice(0, callbacks.length);
+			global.setTimeout = original_set_timeout;
+		}
+	};
+}

test/runtime/samples/binding-select-in-each-block/_config.js

@@ -1,5 +1,16 @@
 export default {
-	skip: true, // JSDOM...
+
+	ssrHtml: `
+		<select value='hullo'>
+			<option value='hullo'>Hullo</option>
+			<option value='world'>World</option>
+		</select>
+
+		<select value='world'>
+			<option value='hullo'>Hullo</option>
+			<option value='world'>World</option>
+		</select>
+	`,
 
 	html: `
 		<select>

test/runtime/samples/binding-select-in-each-block/main.svelte

@@ -1,3 +1,6 @@
+<script>
+	export let items;
+</script>
 {#each items as item}
 	<select bind:value={item.value}>
 		<option value="hullo">Hullo</option>

test/runtime/samples/binding-select-multiple/_config.js

@@ -1,49 +1,58 @@
 export default {
-	skip: true, // JSDOM
 
 	props: {
 		selected: [ 'two', 'three' ]
 	},
 
+	ssrHtml: `
+		<select multiple value="two,three">
+			<option value="one">one</option>
+			<option value="two">two</option>
+			<option value="three">three</option>
+		</select>
+
+		<p>selected: two, three</p>
+	`,
+
 	html: `
 		<select multiple>
-			<option>one</option>
+			<option value="one">one</option>
-			<option>two</option>
+			<option value="two">two</option>
-			<option>three</option>
+			<option value="three">three</option>
 		</select>
 
 		<p>selected: two, three</p>
 	`,
 
-	test({ assert, component, target, window }) {
+	async test({ assert, component, target, window }) {
 		const select = target.querySelector( 'select' );
 		const options = [ ...target.querySelectorAll( 'option' ) ];
 
 		const change = new window.Event( 'change' );
 
 		options[1].selected = false;
-		select.dispatchEvent( change );
+		await select.dispatchEvent( change );
 
 		assert.deepEqual( component.selected, [ 'three' ] );
 		assert.htmlEqual( target.innerHTML, `
 			<select multiple>
-				<option>one</option>
+				<option value="one">one</option>
-				<option>two</option>
+				<option value="two">two</option>
-				<option>three</option>
+				<option value="three">three</option>
 			</select>
 
 			<p>selected: three</p>
 		` );
 
 		options[0].selected = true;
-		select.dispatchEvent( change );
+		await select.dispatchEvent( change );
 
 		assert.deepEqual( component.selected, [ 'one', 'three' ] );
 		assert.htmlEqual( target.innerHTML, `
 			<select multiple>
-				<option>one</option>
+				<option value="one">one</option>
-				<option>two</option>
+				<option value="two">two</option>
-				<option>three</option>
+				<option value="three">three</option>
 			</select>
 
 			<p>selected: one, three</p>
@@ -57,9 +66,9 @@ export default {
 
 		assert.htmlEqual( target.innerHTML, `
 			<select multiple>
-				<option>one</option>
+				<option value="one">one</option>
-				<option>two</option>
+				<option value="two">two</option>
-				<option>three</option>
+				<option value="three">three</option>
 			</select>
 
 			<p>selected: one, two</p>

test/runtime/samples/binding-select-optgroup/_config.js

@@ -1,5 +1,15 @@
 export default {
-	skip: true, // JSDOM
+
+	ssrHtml: `
+		<h1>Hello undefined!</h1>
+
+		<select>
+			<option value="Harry">Harry</option>
+			<optgroup label="Group">
+				<option value="World">World</option>
+			</optgroup>
+		</select>
+	`,
 
 	html: `
 		<h1>Hello Harry!</h1>
@@ -12,17 +22,17 @@ export default {
 		</select>
 	`,
 
-	test({ assert, component, target, window }) {
+	async test({ assert, component, target, window }) {
 		const select = target.querySelector('select');
 		const options = [...target.querySelectorAll('option')];
 
-		assert.deepEqual(options, select.options);
+		assert.deepEqual(options, [...select.options]);
 		assert.equal(component.name, 'Harry');
 
 		const change = new window.Event('change');
 
 		options[1].selected = true;
-		select.dispatchEvent(change);
+		await select.dispatchEvent(change);
 
 		assert.equal(component.name, 'World');
 		assert.htmlEqual(target.innerHTML, `

test/runtime/samples/window-bind-scroll-update/_config.js

@@ -1,10 +1,37 @@
+import { env, useFakeTimers } from "../../../helpers";
+
+let clock;
+
 export default {
-	skip: true, // JSDOM
+	before_test()  {
+		clock = useFakeTimers();
+
+		const window = env();
+		Object.defineProperties(window, {
+			pageYOffset: {
+				value: 0,
+				configurable: true
+			},
+			pageXOffset: {
+				value: 0,
+				configurable: true
+			}
+		});
+	},
 
-	test({ assert, component, target, window }) {
+	after_test() {
+		clock.removeFakeTimers();
+		clock = null;
+	},
+
+	async test({ assert, component, target, window }) {
 		assert.equal(window.pageYOffset, 0);
 
+		// clear the previous 'scrolling' state
+		clock.flush();
 		component.scrollY = 100;
+
+		clock.flush();
 		assert.equal(window.pageYOffset, 100);
-	}
+	},
-};
+};

test/runtime/samples/window-binding-resize/_config.js

@@ -1,16 +1,25 @@
 export default {
 	html: `<div>1024x768</div>`,
 
-	skip: true, // some weird stuff happening with JSDOM 11
+	before_test() {
-	// skip: /^v4/.test(process.version), // node 4 apparently does some dumb stuff
+		Object.defineProperties(window, {
+			innerWidth: {
+				value: 1024,
+				configurable: true
+			},
+			innerHeight: {
+				value: 768,
+				configurable: true
+			}
+		});
+	},
+
 	skip_if_ssr: true, // there's some kind of weird bug with this test... it compiles with the wrong require.extensions hook for some bizarre reason
 
 	async test({ assert, component, target, window }) {
 		const event = new window.Event('resize');
 
-		// JSDOM executes window event listeners with `global` rather than
+		Object.defineProperties(window, {
-		// `window` (bug?) so we need to do this
-		Object.defineProperties(global, {
 			innerWidth: {
 				value: 567,
 				configurable: true

test/runtime/samples/window-binding-scroll-store/_config.js

@@ -1,6 +1,13 @@
 export default {
 	skip_if_ssr: true,
-
+	before_test() {
+		Object.defineProperties(window, {
+			pageYOffset: {
+				value: 0,
+				configurable: true,
+			},
+		});
+	},
 	async test({ assert, component, target, window }) {
 		assert.equal(window.pageYOffset, 0);
 
@@ -19,13 +26,4 @@ export default {
 			`<p style="position: fixed; top: 1em; left: 1em;">scroll\ny\nis\n234.\n234\n*\n234\n=\n54756</p><div style="height: 9999px;"></div>`
 		);
 	},
-
-	after_test() {
-		Object.defineProperties(window, {
-			pageYOffset: {
-				value: 0,
-				configurable: true,
-			},
-		});
-	},
 };

test/runtime/samples/window-event/_config.js

@@ -1,16 +1,12 @@
 export default {
 	html: `<div>undefinedxundefined</div>`,
 
-	skip: true, // some weird stuff happening with JSDOM 11
-	// skip: /^v4/.test(process.version), // node 4 apparently does some dumb stuff
 	skip_if_ssr: true, // there's some kind of weird bug with this test... it compiles with the wrong require.extensions hook for some bizarre reason
 
 	async test({ assert, component, target, window }) {
 		const event = new window.Event('resize');
 
-		// JSDOM executes window event listeners with `global` rather than
+		Object.defineProperties(window, {
-		// `window` (bug?) so we need to do this
-		Object.defineProperties(global, {
 			innerWidth: {
 				value: 567,
 				configurable: true

test/runtime/samples/window-event/main.svelte

@@ -3,6 +3,6 @@
 	export let height;
 </script>
 
-<svelte:window on:resize='{() => width = this.innerWidth, height = this.innerHeight}'/>
+<svelte:window on:resize={function () { width = this.innerWidth, height = this.innerHeight; }}/>
 
 <div>{width}x{height}</div>