phantom.js can’t handle webcomponents.js (a required polyfill), so testing or seo packages like spiderable wouldn’t work
also, keep in mind Chrome is the only browser that has a decent support of custom elements, while others may have performance issues
in my own experience, I was very excited about using custom elements (wrapped by Google’s Polymer), as it let me overcome Blaze issues, until I hit the phantom.js wall
I wouldn’t do that if I were you, as seems to cause more problems than it solves. Even if all browsers would render these elements, how can you guarantee that the end result would be the same on every browser?
Maybe one browser does makes them inline, maybe another handles them as block. Maybe a future release will create an element named panel that behaves differently.
I’ve actually had a similar issue happen to me, where I create an input[type="date"] element to make it’s purpose clear, and when the browsers started supporting with their own datepicker my datepickers broke horribly.
And now I wonder how hard it would be to add a middleware in Blaze that replaces <panel> with <div class="panel">…
actually, these 2 concerns are not that much of an issue
custom elements can be styled in complete isolation (shadow DOM), so the browser differences concern boils down to regular cross-browser design issues, regardless of custom elements.
as for the placement of the host element in the DOM (i.e. ), you can style it as well
as for namespace conflicts, you can easily prefix all your elements (the specification dictates that at least one hyphen is mandatory in the tag name) so such conflicts are avoided
however, my posted argument against custom elements still stands
Well, the Shadow DOM is not really supported on anywhere but Chrome, but yes you can re-style and namespace the elements. But still. More trouble than it’s worth it IMO.
But it would still be cool to be able to rewrite elements before they are sent to the browser, just so our templates can be better understood by the reader. Like a parser that would go through the document, look for no standard elements and replace them with their <span class="element-name"> counterpart perhaps but now I’m getting out of topic so I’ll stop.
I think I will revert back to using standard divs with classes.
I was hoping that it would not be an issue, but I have noticed some inconsistencies and I guess it will probably get worse before it gets better.