Skip to content
This repository was archived by the owner on Jul 1, 2021. It is now read-only.
This repository was archived by the owner on Jul 1, 2021. It is now read-only.

disconnectedCallback is not invoked #43

@dios-david

Description

@dios-david

I found that disconnectedCallback() doesn't get invoked when removing a custom element from the DOM.

To be honest, I don't really know what behaviour should I expect here:

  • diffing document.innerHTML when it changes, calling disconnectedCallbacks of those elements which were removed
  • having a functionality to reset/destroy a document, which resets document.innerHTML and calls the disconnectedCallbacks of each rendered elements

Does basichtml have any support for this? (instead of doing document.body.innerHTML = '';)

const { init, HTMLElement } = require('basichtml');
const { customElements, document } = init();

customElements.define('test-component', class TestComponent extends HTMLElement {
    connectedCallback() {
        console.log('connected');
        this.interval = setInterval(() => console.log('tick'), 1000);
    }

    disconnectedCallback() {
        console.log('disconnected');
        clearInterval(this.interval);
    }
});

document.body.innerHTML = '<body><test-component /></body>';
console.log(document.toString());
document.body.innerHTML = '';

// keeping the process alive
process.stdin.on('data', () => {});

As a result of not calling disconnectedCallback, the setInterval() created in connectedCallback keeps ticking in every second.

Console output:

connected
<!DOCTYPE html><html><body><body><test-component></test-component></body></body></html>
tick
tick
tick

(Please forgive me opening issues, there are rather questions than actual issues. I'm just getting familiar with basichtml, which looks awesome as your other projects (e.g. heresy <3))

Metadata

Metadata

Assignees

No one assigned

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions