You can attach listeners to elements before they're upgraded and ready. That's a nice property of custom elements and DOM events. Waiting to attach until WCR means you may miss the event the first time it's fired.
On Thu, Dec 24, 2015, 10:32 PM Darin Hensley <[email protected]> wrote: > I am having issues(not consistent....random) where the elements are not > ready when I attach the listeners. I placed a setTimeout to try and > compensate the random race condition. Should these elements be ready during > the time of their queries when WebComponentsReady fires or with the > initialize.js script placed last at the bottom of the index.html? > function makeGlobalElements() { > //elements is not routing list, routing list is elementList > panel = document.querySelector('paper-header-panel[main]'); > rippleElement = document.getElementById('ripple-element'); > toolbar = document.querySelector('#main-toolbar'); > headerName = document.getElementById('name-title'); > drawer = document.querySelector('paper-drawer-panel'); > mainPanelContent = document.getElementById('mainPanelContent'); > }; > > function attatchListeners() { > panel.addEventListener("content-scroll", moveTitle); > ['webkitAnimationEnd', 'animationend'] > .forEach(function(vendor) { > mainPanelContent.addEventListener(vendor, function (animationEvent) { > if (animationEvent.animationName === "slide-down") { > afterSlideDown.runStack(); > mainPanelContent.classList.remove('slide-down-now'); > } > }); > headerName.addEventListener(vendor, function() { > headerName.classList.remove('fade-title'); > }); > }); > }; > > > function initializeYay() { > makeGlobalElements(); > setTimeout(attatchListeners, 500); > setUpRoutes(); > removeSplash(); > //fetchPdfjs(); > } > > if (!webComponentsSupported) { > document.addEventListener('WebComponentsReady', initializeYay); > } else { > initializeYay(); > page('/portfolio'); > } > > > > > On Tuesday, December 22, 2015 at 9:44:05 PM UTC-6, Darin Hensley wrote: >> >> stack overflow post >> <http://stackoverflow.com/questions/34428255/domcontentloaded-never-fires-can-not-use-webcomponentsready> >> >> >> Using polymer 1.2.3, >> >> >> In linux firefox 42.0, where the polyfill(webcomponents-lite.js) is used: >> >> >> `WebComponentsReady` fires to soon, because I `querySelect` and >> `getElementById` elements that do not exist yet in `initialize`. >> >> >> window.addEventListener('WebComponentsReady', function() { >> initialize >> .then(attatchListeners) >> >> >> So I am using `DOMContentLoaded` but it never fires: >> >> document.addEventListener('DOMContentLoaded', function() { >> initialize >> .then(attatchListeners) >> >> >> >> Any ideas on how to make initialize run when the elements are available >> for `querySelect()`? >> >> Follow Polymer on Google+: plus.google.com/107187849809354688692 > --- > You received this message because you are subscribed to the Google Groups > "Polymer" group. > To unsubscribe from this group and stop receiving emails from it, send an > email to [email protected]. > To view this discussion on the web visit > https://groups.google.com/d/msgid/polymer-dev/13dcb312-f0a9-44d5-bf55-29be4cd38441%40googlegroups.com > <https://groups.google.com/d/msgid/polymer-dev/13dcb312-f0a9-44d5-bf55-29be4cd38441%40googlegroups.com?utm_medium=email&utm_source=footer> > . > For more options, visit https://groups.google.com/d/optout. > Follow Polymer on Google+: plus.google.com/107187849809354688692 --- You received this message because you are subscribed to the Google Groups "Polymer" group. To unsubscribe from this group and stop receiving emails from it, send an email to [email protected]. To view this discussion on the web visit https://groups.google.com/d/msgid/polymer-dev/CACGqRCAW%3DEET%3DPBC98fFTn8_T3h8dDrBphF1J5HQE-gubX2rLw%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
