diff --git a/test/helpers.js b/test/helpers.js index 5a2d1403f0..d4f507fc87 100644 --- a/test/helpers.js +++ b/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 = '
'; @@ -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; + } + }; +} diff --git a/test/runtime/samples/binding-select-in-each-block/_config.js b/test/runtime/samples/binding-select-in-each-block/_config.js index e8ff7f9f07..89f40f8d48 100644 --- a/test/runtime/samples/binding-select-in-each-block/_config.js +++ b/test/runtime/samples/binding-select-in-each-block/_config.js @@ -1,5 +1,16 @@ export default { - skip: true, // JSDOM... + + ssrHtml: ` + + + + `, html: ` diff --git a/test/runtime/samples/binding-select-multiple/_config.js b/test/runtime/samples/binding-select-multiple/_config.js index e1d21c0ea8..b7d6c3589f 100644 --- a/test/runtime/samples/binding-select-multiple/_config.js +++ b/test/runtime/samples/binding-select-multiple/_config.js @@ -1,49 +1,58 @@ export default { - skip: true, // JSDOM props: { selected: [ 'two', 'three' ] }, + ssrHtml: ` + + +

selected: two, three

+ `, + html: `

selected: two, three

`, - 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, `

selected: three

` ); options[0].selected = true; - select.dispatchEvent( change ); + await select.dispatchEvent( change ); assert.deepEqual( component.selected, [ 'one', 'three' ] ); assert.htmlEqual( target.innerHTML, `

selected: one, three

@@ -57,9 +66,9 @@ export default { assert.htmlEqual( target.innerHTML, `

selected: one, two

diff --git a/test/runtime/samples/binding-select-optgroup/_config.js b/test/runtime/samples/binding-select-optgroup/_config.js index 5927bce901..e8a1d40797 100644 --- a/test/runtime/samples/binding-select-optgroup/_config.js +++ b/test/runtime/samples/binding-select-optgroup/_config.js @@ -1,5 +1,15 @@ export default { - skip: true, // JSDOM + + ssrHtml: ` +

Hello undefined!

+ + + `, html: `

Hello Harry!

@@ -12,17 +22,17 @@ export default { `, - 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, ` diff --git a/test/runtime/samples/window-bind-scroll-update/_config.js b/test/runtime/samples/window-bind-scroll-update/_config.js index b9b620d1cd..cb13ea11c2 100644 --- a/test/runtime/samples/window-bind-scroll-update/_config.js +++ b/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); - } -}; \ No newline at end of file + }, +}; diff --git a/test/runtime/samples/window-binding-resize/_config.js b/test/runtime/samples/window-binding-resize/_config.js index d8fbe69f75..1429f67db8 100644 --- a/test/runtime/samples/window-binding-resize/_config.js +++ b/test/runtime/samples/window-binding-resize/_config.js @@ -1,16 +1,25 @@ export default { html: `
1024x768
`, - skip: true, // some weird stuff happening with JSDOM 11 - // skip: /^v4/.test(process.version), // node 4 apparently does some dumb stuff + before_test() { + 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 - // `window` (bug?) so we need to do this - Object.defineProperties(global, { + Object.defineProperties(window, { innerWidth: { value: 567, configurable: true diff --git a/test/runtime/samples/window-binding-scroll-store/_config.js b/test/runtime/samples/window-binding-scroll-store/_config.js index abddb86765..dbab4b36ac 100644 --- a/test/runtime/samples/window-binding-scroll-store/_config.js +++ b/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 { `

scroll\ny\nis\n234.\n234\n*\n234\n=\n54756

` ); }, - - after_test() { - Object.defineProperties(window, { - pageYOffset: { - value: 0, - configurable: true, - }, - }); - }, }; diff --git a/test/runtime/samples/window-event/_config.js b/test/runtime/samples/window-event/_config.js index 16e0f870ef..bd09487f5e 100644 --- a/test/runtime/samples/window-event/_config.js +++ b/test/runtime/samples/window-event/_config.js @@ -1,16 +1,12 @@ export default { html: `
undefinedxundefined
`, - 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 - // `window` (bug?) so we need to do this - Object.defineProperties(global, { + Object.defineProperties(window, { innerWidth: { value: 567, configurable: true diff --git a/test/runtime/samples/window-event/main.svelte b/test/runtime/samples/window-event/main.svelte index 1aa84a0890..e246902063 100644 --- a/test/runtime/samples/window-event/main.svelte +++ b/test/runtime/samples/window-event/main.svelte @@ -3,6 +3,6 @@ export let height; - +
{width}x{height}
\ No newline at end of file