Зачем мне писать: shadow после: host?

Question

Я ищу объяснение, почему мне нужно было бы написать: host :: shadow для того, чтобы мой унаследованный элемент стилизовал элементы в теневом дереве моего базового элемента.

В следующем примере кода, я хотел бы иметь возможность стиль этикетки для полного элемента:

<polymer-element name="my-foo"> 
    <template> 
     <style> 
      :host label { 
       color: red; 
      } 
     </style> 
    <label>My label: </label> 
    </template> 
    <script> 
    Polymer('my-foo'); 
    </script> 
</polymer-element> 

<polymer-element name="my-bar" extends="my-foo"> 
    <template> 
     <style> 
      :host label { 
       font-weight: bold; 
      } 
     </style> 
     <shadow></shadow> 
     <input /> 
    </template> 
    <script> 
    Polymer('my-bar'); 
    </script> 
</polymer-element> 

<my-bar></my-bar> 

http://jsfiddle.net/Lz0Lcrx3/

Приведенный выше пример делает метки появляются красные, но не жирный. Чтобы исправить это, мне нужно изменить стиль на моем унаследованном элементе, чтобы включить :: shadow.

<style> 
     :host::shadow label { 
      font-weight: bold; 
     } 
    </style> 

http://jsfiddle.net/Lz0Lcrx3/1/

Я знаю, что я имею дело с двумя shadowroots в этом случае, и я предполагаю, что :: тень, чтобы убедиться, что мы применяем стиль для всех из них, но я полагал, что: хозяина было бы достаточно.

Может кто-нибудь предложить объяснение?

Answer 1

После еще некоторых поисков я нашел следующую статью, я думаю, объясняет это: http://www.html5rocks.com/en/tutorials/webcomponents/shadowdom-301/

Из того, что я понимаю, точка <shadow></shadow> вставки сделает необходимым использовать :: тень от другого shadowDOM дерева, так как мы фактически пересекающих границы. Теневые границы, а не границы элементов.