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