Web Components – the future
You should first ground yourself on Web Components and read this article on Web Components and concepts, ShadowDOM, imports, templates, custom elements by Todd Motto.
Once you have read/listened you will have some idea and concept about Web Components and how they are the future…..
But what I wanted to show briefly was how to enable the ShadowDOM in Chrome and what that can do for you in a cool kinda way.
If you create a simple <input type=”number”> field on an HTML5 page you will now get a “Number Picker” which is more than just an Input field
And if you look at that through the web explorer (F12) you will see the HTML Markup for that
Within the Web Dev Tools for Chrome you can click on the settings button and within there under General “Show user agent shadow DOM”
And then if we look at our Number field again you will see it is actually marked up HTML which we did not see before.
Cool eh 🙂