聚合物跨范围样式不起作用

Question

我尝试使用应用于主机的样式来影响元素的阴影DOM的CSS。这似乎应该有效，但不是。

/* my-element styles */

:host .conditional { display: none; }
:host(.show-conditional) .conditional { display: list-item; }

<!-- my-element template -->
<ul>
    <li>Always visible</li>
    <li class="conditional">Only when host has .conditional set</li>
</ul>

我希望我清楚我在这里尝试做什么。当我检查my-element时，我发现它已设置my-element-0，show-conditional个类。检查第二个li表明只有隐藏它的样式适用，但应该显示它的样式不适用。钻入生成的样式表会显示有一种样式可以使li可见，但它不是：

.my-element-0 .conditional.my-element { display: none; } .my-element-0.show-conditional .conditional.my-element { display: list-item; }

当我检查它时，第二种风格并不适用于我的li，但查看它看起来应该是的父类。

我错过了什么？