Style caching can be incorrect in document when style is=custom-style is used

[dfreedm]

Description

Live Demo

test/smoke/custom-style-cache.html

Steps to Reproduce

Expected Results

First element has a font-size of 32px
Second element has a font-size of 12px

Actual Results

Both elements have a font-size of 32px

Browsers Affected

• Chrome
• Firefox
• Edge
• Safari 9
• Safari 8
• IE 11

Versions

• Polymer: v1.6.0

[sorvell]

Quick debugging note: the test case is fixed if Polymer.updateStyles() is called.

[sorvell]

The style caching system relies on the ability to know the index of each style rule. This indexing is performed not by the css parser but by the StyleProperties.decorateStyles. It is therefore required that a host has called this method prior to any elements in that scope calling _updateStyleProperties and looking up their scope style rules.

This should be guaranteed for any element scopes, but it is not guaranteed for the root styling scope, Polymer.StyleDefaults. StyleDefaults only decorates its styles the first time _styleProperties is read.

This may be after an element in this scope calls _updateStyleProperties and tries to calculate scope data.

One way to fix this is to make sure the scope has _styleProperties right when the scope is determined at the top of _updateStyleProperties.