diff --git a/src/runtime/internal/Component.ts b/src/runtime/internal/Component.ts
index 6d211dfedd..0078b78c04 100644
--- a/src/runtime/internal/Component.ts
+++ b/src/runtime/internal/Component.ts
@@ -184,6 +184,10 @@ if (typeof HTMLElement === 'function') {
 			this[attr] = newValue;
 		}
 
+		disconnectedCallback() {
+			this.$destroy();
+		}
+
 		$destroy() {
 			destroy_component(this, 1);
 			this.$destroy = noop;
diff --git a/test/custom-elements/samples/ondestroy/main.svelte b/test/custom-elements/samples/ondestroy/main.svelte
new file mode 100644
index 0000000000..aa945ca602
--- /dev/null
+++ b/test/custom-elements/samples/ondestroy/main.svelte
@@ -0,0 +1,22 @@
+<svelte:options tag="my-app"/>
+
+<script>
+	import { onMount, onDestroy } from 'svelte';
+	
+	let el;
+	let parentEl;
+
+	onMount(() => {
+		parentEl = el.parentNode.host.parentElement;
+
+		return () => {
+			parentEl.dataset.onMountDestroyed = true;
+		}
+	});
+
+	onDestroy(() => {
+		parentEl.dataset.destroyed = true;
+	})
+</script>
+
+<div bind:this={el}></div>
diff --git a/test/custom-elements/samples/ondestroy/test.js b/test/custom-elements/samples/ondestroy/test.js
new file mode 100644
index 0000000000..91aff740e7
--- /dev/null
+++ b/test/custom-elements/samples/ondestroy/test.js
@@ -0,0 +1,11 @@
+import * as assert from 'assert';
+import './main.svelte';
+
+export default function (target) {
+	target.innerHTML = '<my-app/>';
+	const el = target.querySelector('my-app');	
+	target.removeChild(el);
+
+	assert.ok(target.dataset.onMountDestroyed);
+	assert.ok(target.dataset.destroyed);
+}
\ No newline at end of file