Merge pull request #735 from sveltejs/gh-643

don't throw error if component is destroyed twice

src/generators/dom/index.ts

@@ -211,7 +211,7 @@ export default function dom(
 			this._root = options._root || this;
 			this._yield = options._yield;
 
-			this._torndown = false;
+			this._destroyed = false;
 			${generator.stylesheet.hasStyles &&
 				options.css !== false &&
 				`if ( !document.getElementById( '${generator.stylesheet.id}-style' ) ) @add_css();`}
@@ -264,6 +264,7 @@ export default function dom(
 		};
 
 		${name}.prototype.teardown = ${name}.prototype.destroy = function destroy ( detach ) {
+			if ( this._destroyed ) return${options.dev && ` console.warn( 'Component was already destroyed' )`};
 			this.fire( 'destroy' );
 			${templateProperties.ondestroy && `@template.ondestroy.call( this );`}
 
@@ -272,7 +273,7 @@ export default function dom(
 			this._fragment = null;
 
 			this._state = {};
-			this._torndown = true;
+			this._destroyed = true;
 		};
 	`);
 

test/js/samples/collapses-text-around-comments/expected-bundle.js

@@ -201,7 +201,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 	if ( !document.getElementById( 'svelte-3590263702-style' ) ) add_css();
 
 	this._fragment = create_main_fragment( this._state, this );
@@ -223,6 +223,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -230,7 +231,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/collapses-text-around-comments/expected.js

@@ -66,7 +66,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 	if ( !document.getElementById( 'svelte-3590263702-style' ) ) add_css();
 
 	this._fragment = create_main_fragment( this._state, this );
@@ -88,6 +88,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -95,7 +96,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/computed-collapsed-if/expected-bundle.js

@@ -155,7 +155,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -176,6 +176,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -183,7 +184,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/computed-collapsed-if/expected.js

@@ -44,7 +44,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -65,6 +65,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -72,7 +73,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/css-media-query/expected-bundle.js

@@ -181,7 +181,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 	if ( !document.getElementById( 'svelte-2363328337-style' ) ) add_css();
 
 	this._fragment = create_main_fragment( this._state, this );
@@ -202,6 +202,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -209,7 +210,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/css-media-query/expected.js

@@ -50,7 +50,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 	if ( !document.getElementById( 'svelte-2363328337-style' ) ) add_css();
 
 	this._fragment = create_main_fragment( this._state, this );
@@ -71,6 +71,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -78,7 +79,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/each-block-changed-check/expected-bundle.js

@@ -301,7 +301,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -322,6 +322,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -329,7 +330,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/each-block-changed-check/expected.js

@@ -157,7 +157,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -178,6 +178,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -185,7 +186,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/event-handlers-custom/expected-bundle.js

@@ -190,7 +190,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -210,6 +210,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -217,7 +218,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/event-handlers-custom/expected.js

@@ -61,7 +61,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -81,6 +81,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -88,7 +89,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/if-block-no-update/expected-bundle.js

@@ -236,7 +236,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -257,6 +257,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -264,7 +265,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/if-block-no-update/expected.js

@@ -101,7 +101,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -122,6 +122,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -129,7 +130,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/if-block-simple/expected-bundle.js

@@ -212,7 +212,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -233,6 +233,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -240,7 +241,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/if-block-simple/expected.js

@@ -77,7 +77,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -98,6 +98,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -105,7 +106,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/non-imported-component/expected-bundle.js

@@ -182,7 +182,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	if ( !options._root ) {
 		this._oncreate = [];
@@ -216,6 +216,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -223,7 +224,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/non-imported-component/expected.js

@@ -61,7 +61,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	if ( !options._root ) {
 		this._oncreate = [];
@@ -95,6 +95,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -102,7 +103,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/onrender-onteardown-rewritten/expected-bundle.js

@@ -146,7 +146,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	var oncreate = template.oncreate.bind( this );
 
@@ -178,6 +178,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 	template.ondestroy.call( this );
 
@@ -186,7 +187,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/onrender-onteardown-rewritten/expected.js

@@ -35,7 +35,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	var oncreate = template.oncreate.bind( this );
 
@@ -67,6 +67,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 	template.ondestroy.call( this );
 
@@ -75,7 +76,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/use-elements-as-anchors/expected-bundle.js

@@ -396,7 +396,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -417,6 +417,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -424,7 +425,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/js/samples/use-elements-as-anchors/expected.js

@@ -261,7 +261,7 @@ function SvelteComponent ( options ) {
 	this._root = options._root || this;
 	this._yield = options._yield;
 
-	this._torndown = false;
+	this._destroyed = false;
 
 	this._fragment = create_main_fragment( this._state, this );
 
@@ -282,6 +282,7 @@ SvelteComponent.prototype._set = function _set ( newState ) {
 };
 
 SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = function destroy ( detach ) {
+	if ( this._destroyed ) return;
 	this.fire( 'destroy' );
 
 	if ( detach !== false ) this._fragment.unmount();
@@ -289,7 +290,7 @@ SvelteComponent.prototype.teardown = SvelteComponent.prototype.destroy = functio
 	this._fragment = null;
 
 	this._state = {};
-	this._torndown = true;
+	this._destroyed = true;
 };
 
 export default SvelteComponent;

test/runtime/samples/destroy-twice/_config.js

@@ -0,0 +1,6 @@
+export default {
+	test(assert, component) {
+		component.destroy();
+		component.destroy();
+	}
+};

test/runtime/samples/destroy-twice/main.html

@@ -0,0 +1 @@
+<div/>

test/runtime/samples/dev-warning-destroy-twice/_config.js

@@ -0,0 +1,21 @@
+export default {
+	dev: true,
+
+	test(assert, component) {
+		const warn = console.warn; // eslint-disable-line no-console
+
+		const warnings = [];
+		console.warn = warning => { // eslint-disable-line no-console
+			warnings.push(warning);
+		};
+
+		component.destroy();
+		component.destroy();
+
+		assert.deepEqual(warnings, [
+			`Component was already destroyed`
+		]);
+
+		console.warn = warn; // eslint-disable-line no-console
+	}
+};

test/runtime/samples/dev-warning-destroy-twice/main.html

@@ -0,0 +1 @@
+<div/>