googlearchive / app-drawer-template

Application template that demonstrates the PRPL pattern
28 stars 22 forks source link

Not working on Firefox 45.0 #6

Closed xintellion closed 8 years ago

xintellion commented 8 years ago

I have cloned and ran bower update on the template. In Chrome everything is working. But on Firefox 45.0 (Linux) I get the following error loading the page.

TypeError: document.body is null

This is thrown trying to add the script tag for webcomponents-lite.min.js

ncrawlins commented 8 years ago

this is problem with trying to access document.body in a script in the header tag. body doesn't exist yet in firefox or IE.

wrap that line in an event listener for load or DOMContentLoaded or somethign like that so you know body will exist

window.addEventListener('DOMContentLoaded', function () { document.body.appendChild(e); })

or you could just replace all of the else block with

document.write( '<script src="/bower_components/webcomponentsjs/webcomponents-lite.min.js">\x3C/script>')

That will put the polyfill script tag in the header on browsers that need it, which for me at least, seems to shorten the amount of time I have to look at an empty shell in IE before everything "polymerizes" on initial page load or on page refresh. I don't know if there's a reason you wouldn't want that particular script tag in the header.

kevinpschaaf commented 8 years ago

Fixed in #3. You can either change the old template's document.body to document.head or re-initialize the template using polymer init app-drawer-template to get the same fix. Sorry for the confusion.