[webcomponents] [Shadow]: Consider explicitly exporting CSS Variables across a shadow boundary (bugzilla: 17143) (#94)

Title: [Shadow]: Consider explicitly exporting CSS Variables across a shadow boundary (bugzilla: 17143)

Migrated from: https://www.w3.org/Bugs/Public/show_bug.cgi?id=17143

----
comment: 0
comment_url: https://www.w3.org/Bugs/Public/show_bug.cgi?id=17143#c0
*Dimitri Glazkov* wrote on 2012-05-21 20:32:51 +0000.

Once CSS Variables are in use, _every_ CSS Variable will come across a shadow boundary, which may lead to unintended consequences. Consider a situation where the shadow DOM subtree is using CSS Variables internally. Now, a CSS variable that's specified externally will stomp on them. Sadface ensues.

----

comment: 1
comment_url: https://www.w3.org/Bugs/Public/show_bug.cgi?id=17143#c1
*Dominic Cooney* wrote on 2012-06-18 02:57:47 +0000.

I think this case could be more common than just accidental name collisions.

Consider nested use of the same component: Say my network configuration component has a tab strip for WiFi, IPv6, etc. and it is designed to be reused in different contexts. If someone puts it inside another tabstrip for Network, Display, etc. the variables set to configure the outer tabstrip will naturally apply to the inner one. (I think?)

In general someone using a component inside another component, to make their use of that component really reliable, would have to reset the variables around the inner component, which means being fully aware of its default style.

On the other hand, if the component is using variables for theming, the global application is probably what you want.

---
Reply to this email directly or view it on GitHub:
https://github.com/w3c/webcomponents/issues/94