Search code examples
javascriptlistenerweb-component

Web Components Listeners Unbind at Destruction

I am building a Web Component for an input that binds listeners for the focus and blur events in JavaScript.

I am extending from an HTMLElement and I use the constructor to initialize my components and the events binding.

My question is: do I need to unbind these listeners in the case the DOMNodeRemoved event is triggered for instance? Is it a good habit to have or is it useless and the JavaScript engine can clean old reference to the DOM node associated to my Web Component and clean it along with its listeners?

Solution

  • If the event listeners are inside the element (attached to the custom element or any element inside it) you don't need to do anything, they will get cleared when the element is gone. However you should clear the ones attached to the global scope.