Bug 103709
| Summary: | [Shadow DOM]: reset-style-inheritance flag doesn't work for shadow insertion point | ||
|---|---|---|---|
| Product: | WebKit | Reporter: | Sergey G. Grekhov <sgrekhov> |
| Component: | CSS | Assignee: | Nobody <webkit-unassigned> |
| Status: | RESOLVED FIXED | ||
| Severity: | Normal | CC: | hayato |
| Priority: | P2 | ||
| Version: | 528+ (Nightly build) | ||
| Hardware: | Unspecified | ||
| OS: | Unspecified | ||
| Bug Depends on: | 103711 | ||
| Bug Blocks: | 63606, 103230 | ||
Sergey G. Grekhov
According the Shadow DOM spec (https://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/shadow/index.html#styles) reset-style-inheritance flag should reset all inheritable CSS properties to their initial values at the upper boundary of the tree. This doesn't work in Chrome 23.0.1271.91 m. Example:
<html>
<head>
<script type="text/javascript">
function test() {
var SR = window.ShadowRoot || window.WebKitShadowRoot;
var d = document;
d.body.innerHTML =
'<ul id="shHost">' +
'<li id="li1" class="shadow">1</li>' +
'<li id="li2" class="shadow2">2</li>' +
'<li id="li3" class="shadow">3</li>' +
'<li id="li4">4</li>' +
'<li id="li5" class="shadow">5</li>' +
'<li id="li6" class="shadow2">6</li>' +
'</ul>';
var host = d.querySelector('#shHost');
d.body.setAttribute('style', 'color:red');
//Shadow root to play with
var s = new SR(host);
var div = d.createElement('div');
div.innerHTML ='<ul><content select=".shadow"></content></ul>';
s.appendChild(div);
//Young tree
var s2 = new SR(host);
var div2 = d.createElement('div');
div2.innerHTML = '<shadow reset-style-inheritance=true></shadow>';
s2.appendChild(div2);
}
</script>
</head>
<body onload="test()">
</body>
</html>
Run the example above and observe the browser window. Red color style inherited from document body is not reset in spite of reset-style-inheritance=true attribute. If to modify example above to set resetStyleInheritance property this won't work anyway. In other words:
var div2 = d.createElement('div');
div2.innerHTML = '<shadow id="shTree"></shadow>';
s2.appendChild(div2);
s2.querySelector('#shTree').resetStyleInheritance = true;
The modified script doesn't work anyway
| Attachments | ||
|---|---|---|
| Add attachment proposed patch, testcase, etc. |
Sergey G. Grekhov
See also https://bugs.webkit.org/show_bug.cgi?id=103711
Hayato Ito
https://bugs.webkit.org/show_bug.cgi?id=103711 fixed this. Closing.