I was building a page, and got into a problem which I was struggling with for awhile. The source code is here: https://gist.github.com/zafartahirov/077b3e9ca7fe9958c9e1 - sorry it's not on JSbin, I still cannot figure out how to use multiple files there.
The page works fine on Chrome, but gives me an error Firefox: TypeError: value is not a non-null object in webcomponents.js and Exception caught during observer callback: destributeNodeInto... in polymer.js.
The page is running on http://zafar.cc - but I am expecting to push a different version there once this problem is fixed. The GitHub repo for the page is here: https://github.com/zafartahirov/zafar.cc
Please, advise... :)
EDIT: The live example of the errors could be seen here: http://bl.ocks.org/zafartahirov/raw/077b3e9ca7fe9958c9e1/ - sorry about importing element/... - forgot to change it in the index.html
In elements/zaf-dropdown/zaf-dropdown.html:16 you have:
<shadow></shadow>
I bet you want to replace it with
<content></content>
or even simply drop it. This change fixes the behaviour in browsers not having native support for webcomponents yet.
P. S. IMHO, this is not a best idea to stole the design from polymer paper-elements project.