Content on lazily loaded pages not fully styled

[ncrawlins]

Maybe I'm not understanding the necessary steps to fully use the lazy load, but I'm having an issue...

If I add a paper-card to one of the lazily loaded pages, even though I import paper-card in that view, full styling is not applied. (in the case of paper-card, no shadows or elevation). Even though paper-card is only being used in the child view, I have to explicitly import it in the shell file (my-app.html) for it to work properly in the lazily loaded child view.

steps with polymer cli:

1. init the app drawer template
2. bower install the paper-card element
3. import and use a paper-card element in my-view1.html

full styling does not display

[abdonrd]

I have the same problem!

[Jaytn]

I have the same problem. I investigated a little further, but since I'm fairly inexperienced with Polymer (esp the newer versions), I didn't get very far.
What I have observed:
As @ncrawlins said, importing some elements (eg. paper-card) in a lazy-loaded page doesn't fully work, but it works flawlessly when they are imported from my-app.html
Curiously, some elements seem to work, while others don't.
Eg: When I follow the tutorial here it works (ie paper-slider works). paper-input also seems to work.
On the other hand, paper-card and paper-material don't work.
paper-button works only partially, I can interact with it, it shows the ripple, but the attribute "raised" has no effect.

Again, I am not very versed in this but I looked around the developer tools and it seems it imports the element's .html just fine but for some reason it doesn't get parsed or the styles don't get applied.

These were just my observations, I hope this helps.

[abdonrd]

I also have problems when I import a "theme" file (with custom properties).

[abdonrd]

Maybe related: Polymer/polymer#3665

[justinfagnani]

cc @kevinpschaaf

[kevinpschaaf]

Root caused this to a problem that only occurs when lazy-loaded elements also depend on global <style is="custom-style">s that were lazily-loaded (paper-card/paper-material fall into this case, as they pull in paper-styles/shadow.html which contains a global custom-style).

Logged an issue on Polymer here: Polymer/polymer#3705

[AliMD]

I have same issue, any temporary solution until next release ?

[abdonrd]

I think Polymer 1.6.0 fix it. :)
https://github.com/Polymer/polymer/releases/tag/v1.6.0

[mercmobily]

Yep, 1.6.0 fixes it indeed. I think it should be closed.