My first Custom Element, developed with the help of https://www.html5rocks.com/en/tutorials/webcomponents/customelements/
This is a simple input element existing in its own Shadow DOM (notice how the !important
styling in the index.html page does not affect the style of the label).
When you type delete
into the input, it gets removed from the DOM, and the event listeners are also cleaned up.
It has a fallback for legacy browsers:
Looks slightly prettier in new browsers:
And outputs cool stuff in the console log: