Styles applied via CSS never appear on an element's `style` object. The `style` object can specify per-instance styles that are combined with CSS styles into the eventual computed-style. The first thing for you to do is investigate using the window.getComputedStyle API <https://developer.mozilla.org/en-US/docs/Web/API/Window.getComputedStyle> instead of examining the `.style` property itself.
On Fri, Nov 7, 2014 at 5:17 PM, santiago esteva <[email protected]> wrote: > Given I extend the paper checkbox element so I can customize themes for > example: > > <polymer-element name="my-checkbox" extends="paper-checkbox" noscript> > <template> > <link rel="stylesheet" href="my-checkbox.css"> > <shadow></shadow> > </template></polymer-element> > > On my css I do > > :host { > padding: 20px 20px 20px 0;}:host::shadow #checkbox.checked { > border-color: blue;}:host-context(.my-theme)::shadow #checkbox.checked { > border-color: red;} > :host-context(.my-theme)::shadow #ink { > color: red;} > > The when I unit test or run a demo like this: > > <section class="my-theme"> > <div center horizontal layout> > <div flex>Vibrate on touch</div> > <my-checkbox id="myCB"></my-checkbox> > </div></section> > > I would like to assert the theme has been applied. So in the console or in > my unit test I want to access the style.color or style.borderColor but it > is always empty when I do so. I query for the element, then I look into its > shadowRoot and even the olderShadowRoot since paper element uses shadow as > well and then I query for the checkbox itself and the color is an empty > string. Code works but I cannot unit test it or even assert it on the > console. > > > myCb.shadowRoot.olderShadowRoot.querySelector('#checkbox.checked').style.borderColor > > Is the theme applied later on the cycle? Do I need to wrap it inside a > sync statement? > > 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/7e3395ec-ef67-422b-8dc0-efb908ba8081%40googlegroups.com > <https://groups.google.com/d/msgid/polymer-dev/7e3395ec-ef67-422b-8dc0-efb908ba8081%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/CAHbmOLYxyYLSAiXoWgAWKyYrwXd4xsE2NdxWRFQfybNgwYG%2BqA%40mail.gmail.com. For more options, visit https://groups.google.com/d/optout.
