It's been working for many refreshes...but it just happened again... I got
'Uncaught TypeError: Cannot read property 'addEventListener' of undefined'
for 'panel.addEventListener("content-scroll", moveTitle);'. This is in
chrome where the initialize.js script is loaded last in the index.html.
function makeGlobalElements() {
//elements is not routing list, routing list is elementList
panel = Polymer.dom(document.rootElement).querySelector(
'paper-header-panel[main]');
rippleElement = Polymer.dom(document.rootElement).querySelector(
'#ripple-element');
toolbar = Polymer.dom(document.rootElement).querySelector('#main-toolbar'
);
headerName = Polymer.dom(document.rootElement).querySelector('#name-title'
);
drawer = Polymer.dom(document.rootElement).querySelector(
'paper-drawer-panel');
mainPanelContent = Polymer.dom(document.rootElement).querySelector(
'#mainPanelContent');
};
function attatchListeners() {
panel.addEventListener("content-scroll", moveTitle);
....
function initializeYay() {
makeGlobalElements();
attatchListeners();
setUpRoutes();
removeSplash();
//fetchPdfjs();
}
if (!webComponentsSupported) {
document.addEventListener('WebComponentsReady', initializeYay);
} else {
initializeYay();
page('/portfolio');
}
----
On Friday, December 25, 2015 at 9:37:55 AM UTC-6, Eric Bidelman wrote:
>
> 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]
> <javascript:>> 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] <javascript:>.
>> 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/ecbf652f-4130-4118-8a29-30de8c98ff24%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.
