diff --git a/src/internal/Component.js b/src/internal/Component.js
index 120dc2b4ef..d9ec8fe29b 100644
--- a/src/internal/Component.js
+++ b/src/internal/Component.js
@@ -2,6 +2,7 @@ import { after_render, flush, intro, schedule_update } from './scheduler.js';
 import { set_current_component } from './lifecycle.js'
 import { is_function, run, run_all, noop } from './utils.js';
 import { blankObject } from './utils.js';
+import { children } from './dom.js';
 
 export class $$Component {
 	constructor(options) {
@@ -93,7 +94,8 @@ export class $$Component {
 
 	$$mount(target, anchor, hydrate) {
 		if (hydrate) {
-			this.$$fragment.l(target.childNodes);
+			this.$$fragment.l(children(target));
+			this.$$fragment.m(target, anchor); // TODO can we avoid moving DOM?
 		} else {
 			this.$$fragment.c();
 			this.$$fragment[this.$$fragment.i ? 'i' : 'm'](target, anchor);
diff --git a/test/runtime/index.js b/test/runtime/index.js
index 9db59e7f8e..93c195f9dc 100644
--- a/test/runtime/index.js
+++ b/test/runtime/index.js
@@ -258,7 +258,7 @@ describe.only("runtime", () => {
 
 		assert.throws(() => {
 			new App({
-				target: {},
+				target: { childNodes: [] },
 				hydrate: true
 			});
 		}, /options.hydrate only works if the component was compiled with the `hydratable: true` option/);