| <!DOCTYPE html> |
| <style> |
| [attr] div { |
| color: red; |
| } |
| [attr] .baz { |
| color: blue; |
| } |
| </style> |
| |
| <div id="a"></div> |
| |
| <script> |
| onload = function() { |
| document.body.offsetTop; |
| |
| var foo = document.createElement("div"); |
| foo.id = "foo"; |
| foo.innerHTML = "<div id=bar><div id=baz>This should be blue.</div></div>"; |
| |
| // Append foo but not attach it. |
| a.appendChild(foo); |
| |
| // Schedule invalidation on bar which sets childNeedsStyleInvalidation on foo. |
| bar.setAttribute("attr", "attr"); |
| |
| // Remove from the tree and clear all invalidation bits, but foo still has them |
| // since it's not in the tree. |
| foo.remove(); |
| document.body.offsetTop; |
| |
| // Add foo back and attach it. |
| a.appendChild(foo); |
| document.body.offsetTop; |
| |
| // Schedule invalidation, but it won't get above foo since the bits are |
| // incorrectly set. |
| baz.className = "baz"; |
| }; |
| </script> |
