mirror of https://github.com/sveltejs/svelte
Call onMount when connected & clean up when disconnected for custom element (#4522)
* call onDestroy when disconnected * lifecycle hooks and custom elements - Call onMount in connectedCallback for customElements - register onMount return values as on_disconnect-callbacks for customElements - run on_disconnect callbacks in disconnectedCallback * do not reset on_mount so that it can fire again if reinserted * simpler isCustomElement & skip extra function call - pass options.customElement down to mount_component - remove expensive isCustomElement check - only call add_render_callback if not customElement Co-authored-by: Pontus Lundin <pontus.lundin@ica.se>pull/5994/head
parent
d3f3ea38d0
commit
d4f98fb63a
@ -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>
|
@ -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.equal(target.dataset.destroyed, undefined);
|
||||||
|
}
|
Loading…
Reference in new issue