CODEWITHSUNDEEP
polymerweb-component
Brett Zamir
Brett Zamir

Reputation: 14345

Avoiding custom events in Polymer

I was drawn to the idea of a "VanillaJS" approach mentioned by http://customelements.io/ for https://github.com/webcomponents/element-boilerplate . This drew me to http://www.polymer-project.org/platform/custom-elements.html (since I would like to do everything I can in JavaScript rather than use <link/> to do imports).

However, it seems that, contrary to the spirit of VanillaJS and polyfills, they seem to require their own custom "WebComponentsReady" event. (To me a polyfill is something which completely follows a standard or proposed standard, and lets you merely remove a script tag or load when it is fully supported and not need to change any other code.)

(Mozilla's x-tag (which is also not clear on whether it can be used purely as a polyfill or whether one requires the xtag global) uses a "DOMComponentsLoaded" event which I am not clear is standard.)

Neither event is mentioned at http://www.w3.org/TR/custom-elements/

Any way to work with these to use a standard event or avoid these otherwise without polling?

UPDATE

I see from http://lists.w3.org/Archives/Public/public-webapps/2013JulSep/0697.html that the "WebComponentsReady" event was discussed as being a candidate for specification but had not (at least at that time) been added, so I guess this event may be the safest bet since Mozilla's x-tag does use it internally immediately before firing its own "DOMComponentsLoaded" event and it was at least discussed as a possible candidate for standardization. :)

Upvotes: 0

Views: 157

Answers (1)

ebidel
ebidel

Reputation: 24109

Neither event is part of the standards. Both Polymer's WebComponentsReady and x-tag's DOMComponentsLoaded are fired for convenience. This is one of those things you'd have to do yourself without a sugaring library. I suspect x-tag's fires hooks into the WebComponentsReady event because it uses the same set of polyfills as Polymer.

BTW, one reason to use an HTML Import (<link rel="import">) to load components is that you get aload` event. That could be one signal the component is ready.

Upvotes: 2

Related Questions