[Shadow DOM] Insertion points need resetStyleInheritance
authorcommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 12 Oct 2012 03:51:37 +0000 (03:51 +0000)
committercommit-queue@webkit.org <commit-queue@webkit.org@268f45cc-cd09-0410-ab3c-d52691b4dbfc>
Fri, 12 Oct 2012 03:51:37 +0000 (03:51 +0000)
https://bugs.webkit.org/show_bug.cgi?id=93922

Patch by Takashi Sakamoto <tasak@google.com> on 2012-10-11
Reviewed by Dimitri Glazkov.

Source/WebCore:

Implemented resetStyleInheritance of insertion points.
Its spec link is http://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/shadow/index.html#api-html-content-element-reset-style-inheritance

Test: fast/dom/shadow/insertion-point-resetStyleInheritance.html

* css/StyleResolver.cpp:
(WebCore::isResetStyleInheritance):
Added a new function to check whether there exists any insertion
point which has reset-style-inhertiance flag set to be true.
(WebCore::StyleResolver::initForStyleResolve):
Modified to use the above function to check reset-style-inheritance.
* html/shadow/HTMLContentElement.idl:
* html/shadow/HTMLShadowElement.idl:
Added a new attribute for reset-style-inheritance.
* html/shadow/InsertionPoint.cpp:
(WebCore::InsertionPoint::InsertionPoint):
Initialized a new member variable for reset-style-inheritance.
(WebCore::InsertionPoint::resetStyleInheritance):
(WebCore::InsertionPoint::setResetStyleInheritance):
Implemented setter/getter for reset-style-inheritance.
* html/shadow/InsertionPoint.h:
(InsertionPoint):
Added a new member variable for reset-style-inheritance.

LayoutTests:

* fast/dom/shadow/insertion-point-resetStyleInheritance-expected.txt: Added.
* fast/dom/shadow/insertion-point-resetStyleInheritance.html: Added.

git-svn-id: https://svn.webkit.org/repository/webkit/trunk@131136 268f45cc-cd09-0410-ab3c-d52691b4dbfc

LayoutTests/ChangeLog
LayoutTests/fast/dom/shadow/insertion-point-resetStyleInheritance-expected.txt [new file with mode: 0644]
LayoutTests/fast/dom/shadow/insertion-point-resetStyleInheritance.html [new file with mode: 0644]
Source/WebCore/ChangeLog
Source/WebCore/css/StyleResolver.cpp
Source/WebCore/html/shadow/HTMLContentElement.idl
Source/WebCore/html/shadow/HTMLShadowElement.idl
Source/WebCore/html/shadow/InsertionPoint.cpp
Source/WebCore/html/shadow/InsertionPoint.h

index f73b83b..01f8959 100644 (file)
@@ -1,3 +1,13 @@
+2012-10-11  Takashi Sakamoto  <tasak@google.com>
+
+        [Shadow DOM] Insertion points need resetStyleInheritance
+        https://bugs.webkit.org/show_bug.cgi?id=93922
+
+        Reviewed by Dimitri Glazkov.
+
+        * fast/dom/shadow/insertion-point-resetStyleInheritance-expected.txt: Added.
+        * fast/dom/shadow/insertion-point-resetStyleInheritance.html: Added.
+
 2012-10-11  Kenichi Ishibashi  <bashi@chromium.org>
 
         [Chromium] Use harfbuzz-ng by default on Linux
diff --git a/LayoutTests/fast/dom/shadow/insertion-point-resetStyleInheritance-expected.txt b/LayoutTests/fast/dom/shadow/insertion-point-resetStyleInheritance-expected.txt
new file mode 100644 (file)
index 0000000..97ae8a1
--- /dev/null
@@ -0,0 +1,25 @@
+Test case: no reset-style-inheritance. color value should be inherited from the shadow host.
+PASS window.getComputedStyle(document.getElementById("no-reset-style-inheritance").firstChild).color is "rgb(255, 238, 238)"
+PASS window.getComputedStyle(document.getElementById("no-reset-style-inheritance").firstChild).backgroundColor is "rgba(0, 0, 0, 0)"
+Test case: reset-style-inhertiace basic test. color value should be initial because insertion point's resetStyleInheritance is true.
+PASS window.getComputedStyle(document.getElementById("reset-style-inheritance").firstChild).color is "rgb(0, 0, 0)"
+PASS window.getComputedStyle(document.getElementById("reset-style-inheritance").firstChild).backgroundColor is "rgba(0, 0, 0, 0)"
+Test case: reset-style-inhertiace changes dynamically. Firstly color value should be inherited. Next, initial. At last, inherited.
+PASS window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).color is "rgb(255, 238, 238)"
+PASS window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).backgroundColor is "rgba(0, 0, 0, 0)"
+PASS window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).color is "rgb(0, 0, 0)"
+PASS window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).backgroundColor is "rgba(0, 0, 0, 0)"
+PASS window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).color is "rgb(255, 238, 238)"
+PASS window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).backgroundColor is "rgba(0, 0, 0, 0)"
+Test case: the parent node of the distributed node is in the same shadow dom subtree as the insertion point. color value should be initial. reset-style-inheritance doesn't depend on whether parent style node is in the same treescope or not.
+PASS window.getComputedStyle(document.getElementById("reset-but-not-cross-upper-boundary").firstChild).color is "rgb(0, 0, 0)"
+PASS window.getComputedStyle(document.getElementById("reset-but-not-cross-upper-boundary").firstChild).backgroundColor is "rgba(0, 0, 0, 0)"
+Test case: reset-style-inheritance with multiple shadow roots. color value should be initial, because reset-style-inheritance of the insertion point in the youngest shadow root is true.
+PASS window.getComputedStyle(document.getElementById("multiple-shadow-roots").firstChild).color is "rgb(0, 0, 0)"
+PASS window.getComputedStyle(document.getElementById("multiple-shadow-roots").firstChild).backgroundColor is "rgba(0, 0, 0, 0)"
+Test case: multiple insertion points in the same shadow dom subtree.. Each reset-style-inheritance should be checked.
+PASS window.getComputedStyle(document.getElementById("multiple-insertion-points").firstChild).color is "rgb(255, 238, 238)"
+PASS window.getComputedStyle(document.getElementById("multiple-insertion-points").firstChild).backgroundColor is "rgba(0, 0, 0, 0)"
+PASS window.getComputedStyle(document.getElementById("multiple-insertion-points").lastChild).color is "rgb(0, 0, 0)"
+PASS window.getComputedStyle(document.getElementById("multiple-insertion-points").lastChild).backgroundColor is "rgba(0, 0, 0, 0)"
+DONE
diff --git a/LayoutTests/fast/dom/shadow/insertion-point-resetStyleInheritance.html b/LayoutTests/fast/dom/shadow/insertion-point-resetStyleInheritance.html
new file mode 100644 (file)
index 0000000..604ef8b
--- /dev/null
@@ -0,0 +1,127 @@
+<!DOCTYPE html>
+<html>
+<head>
+<style>
+div.resetTest {
+  background-color: #eef;
+  color: #fee;
+}
+</style>
+<script src="../../js/resources/js-test-pre.js"></script>
+<script src="resources/polyfill.js"></script>
+<script>
+function testNoResetStyleInheritance() {
+    debug("Test case: no reset-style-inheritance. color value should be inherited from the shadow host.");
+    var div = document.getElementById('no-reset-style-inheritance');
+
+    var shadowRoot = new WebKitShadowRoot(div);
+    shadowRoot.innerHTML = '<content id="content"></content>';
+    
+    shadowRoot.getElementById('content').resetStyleInheritance = false;
+    shouldBe('window.getComputedStyle(document.getElementById("no-reset-style-inheritance").firstChild).color', '"rgb(255, 238, 238)"');
+    shouldBe('window.getComputedStyle(document.getElementById("no-reset-style-inheritance").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
+}
+
+function testResetStyleInheritance() {
+    debug("Test case: reset-style-inhertiace basic test. color value should be initial because insertion point's resetStyleInheritance is true.");
+    var div = document.getElementById('reset-style-inheritance');
+
+    var shadowRoot = new WebKitShadowRoot(div);
+    shadowRoot.innerHTML = '<content id="content"></content>';
+
+    shadowRoot.getElementById('content').resetStyleInheritance = true;
+    shouldBe('window.getComputedStyle(document.getElementById("reset-style-inheritance").firstChild).color', '"rgb(0, 0, 0)"');
+    shouldBe('window.getComputedStyle(document.getElementById("reset-style-inheritance").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
+}
+
+function testResetStyleInheritanceDynamic() {
+    debug("Test case: reset-style-inhertiace changes dynamically. Firstly color value should be inherited. Next, initial. At last, inherited.");
+    var div = document.getElementById('reset-style-inheritance-dynamic');
+
+    var shadowRoot = new WebKitShadowRoot(div);
+    shadowRoot.innerHTML = '<content id="content"></content>';
+
+    shadowRoot.getElementById('content').resetStyleInheritance = false;
+    shouldBe('window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).color', '"rgb(255, 238, 238)"');
+    shouldBe('window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
+
+    shadowRoot.getElementById('content').resetStyleInheritance = true;
+    shouldBe('window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).color', '"rgb(0, 0, 0)"');
+    shouldBe('window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
+
+    shadowRoot.getElementById('content').resetStyleInheritance = false;
+    shouldBe('window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).color', '"rgb(255, 238, 238)"');
+    shouldBe('window.getComputedStyle(document.getElementById("reset-style-inheritance-dynamic").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
+}
+
+function testResetStyleInheritanceWithoutCrossingUpperBoundary() {
+    debug("Test case: the parent node of the distributed node is in the same shadow dom subtree as the insertion point. color value should be initial. reset-style-inheritance doesn't depend on whether parent style node is in the same treescope or not.");
+    var div = document.getElementById('reset-but-not-cross-upper-boundary');
+    var shadowRoot = new WebKitShadowRoot(div);
+
+    shadowRoot.innerHTML = '<div style="color:blue; background-color:green;"><content id="content"></content></div>';
+
+    shadowRoot.getElementById('content').resetStyleInheritance = true;
+    shouldBe('window.getComputedStyle(document.getElementById("reset-but-not-cross-upper-boundary").firstChild).color', '"rgb(0, 0, 0)"');
+    shouldBe('window.getComputedStyle(document.getElementById("reset-but-not-cross-upper-boundary").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
+}
+
+function testResetStyleInheritanceWithMultipleShadowRoots() {
+    debug("Test case: reset-style-inheritance with multiple shadow roots. color value should be initial, because reset-style-inheritance of the insertion point in the youngest shadow root is true.");
+    var div = document.getElementById('multiple-shadow-roots');
+    var oldestShadowRoot = new WebKitShadowRoot(div);
+    oldestShadowRoot.innerHTML = '<content id="content"></content>';
+
+    var youngerShadowRoot = new WebKitShadowRoot(div);
+    youngerShadowRoot.innerHTML = '<shadow id="shadow"></shadow>';
+
+    var youngestShadowRoot = new WebKitShadowRoot(div);
+    youngestShadowRoot.innerHTML = '<shadow id="shadow"></shadow>';
+
+    oldestShadowRoot.getElementById('content').resetStyleInheritance = false;
+    youngerShadowRoot.getElementById('shadow').resetStyleInheritance = false;
+    youngestShadowRoot.getElementById('shadow').resetStyleInheritance = true;
+    shouldBe('window.getComputedStyle(document.getElementById("multiple-shadow-roots").firstChild).color', '"rgb(0, 0, 0)"');
+    shouldBe('window.getComputedStyle(document.getElementById("multiple-shadow-roots").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
+}
+
+function testResetStyleInheritanceWithMultipleInsertionPoints() {
+    debug("Test case: multiple insertion points in the same shadow dom subtree.. Each reset-style-inheritance should be checked.");
+    var div = document.getElementById('multiple-insertion-points');
+    var oldestShadowRoot = new WebKitShadowRoot(div);
+    oldestShadowRoot.innerHTML = '<content id="content"></content>';
+
+    var youngestShadowRoot = new WebKitShadowRoot(div);
+    youngestShadowRoot.innerHTML = '<content select=":first-child" id="content"></content><shadow id="shadow"></shadow>';
+
+    youngestShadowRoot.getElementById('content').resetStyleInheritance = false;
+    youngestShadowRoot.getElementById('shadow').resetStyleInheritance = true;
+
+    shouldBe('window.getComputedStyle(document.getElementById("multiple-insertion-points").firstChild).color', '"rgb(255, 238, 238)"');
+    shouldBe('window.getComputedStyle(document.getElementById("multiple-insertion-points").firstChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
+    shouldBe('window.getComputedStyle(document.getElementById("multiple-insertion-points").lastChild).color', '"rgb(0, 0, 0)"');
+    shouldBe('window.getComputedStyle(document.getElementById("multiple-insertion-points").lastChild).backgroundColor', '"rgba(0, 0, 0, 0)"');
+}
+
+function runTests() {
+    testNoResetStyleInheritance();
+    testResetStyleInheritance();
+    testResetStyleInheritanceDynamic();
+    testResetStyleInheritanceWithoutCrossingUpperBoundary()
+    testResetStyleInheritanceWithMultipleShadowRoots();
+    testResetStyleInheritanceWithMultipleInsertionPoints();
+    document.getElementById('test-cases').innerHTML = 'DONE';
+}
+</script>
+</head>
+<body onload="runTests()">
+<div id="test-cases">
+  <div id="no-reset-style-inheritance" class="resetTest"><span>first-child</span></div>
+  <div id="reset-style-inheritance" class="resetTest"><span>first-child</span></div>
+  <div id="reset-style-inheritance-dynamic" class="resetTest"><span>first-child</span></div>
+  <div id="reset-but-not-cross-upper-boundary" class="resetTest"><span>first-child</span></div>
+  <div id="multiple-shadow-roots" class="resetTest"><span>first-child</span></div>
+  <div id="multiple-insertion-points" class="resetTest"><span>first-child</span><span>last-child</span></div>
+</div>
+</body>
+</html>
index 9d57129..250a69e 100644 (file)
@@ -1,3 +1,34 @@
+2012-10-11  Takashi Sakamoto  <tasak@google.com>
+
+        [Shadow DOM] Insertion points need resetStyleInheritance
+        https://bugs.webkit.org/show_bug.cgi?id=93922
+
+        Reviewed by Dimitri Glazkov.
+
+        Implemented resetStyleInheritance of insertion points.
+        Its spec link is http://dvcs.w3.org/hg/webcomponents/raw-file/tip/spec/shadow/index.html#api-html-content-element-reset-style-inheritance
+
+        Test: fast/dom/shadow/insertion-point-resetStyleInheritance.html
+
+        * css/StyleResolver.cpp:
+        (WebCore::isResetStyleInheritance):
+        Added a new function to check whether there exists any insertion
+        point which has reset-style-inhertiance flag set to be true.
+        (WebCore::StyleResolver::initForStyleResolve):
+        Modified to use the above function to check reset-style-inheritance.
+        * html/shadow/HTMLContentElement.idl:
+        * html/shadow/HTMLShadowElement.idl:
+        Added a new attribute for reset-style-inheritance.
+        * html/shadow/InsertionPoint.cpp:
+        (WebCore::InsertionPoint::InsertionPoint):
+        Initialized a new member variable for reset-style-inheritance.
+        (WebCore::InsertionPoint::resetStyleInheritance):
+        (WebCore::InsertionPoint::setResetStyleInheritance):
+        Implemented setter/getter for reset-style-inheritance.
+        * html/shadow/InsertionPoint.h:
+        (InsertionPoint):
+        Added a new member variable for reset-style-inheritance.
+
 2012-10-11  Anders Carlsson  <andersca@apple.com>
 
         Attempt to fix build broken by r131125.
index fbad08c..00ed250 100644 (file)
@@ -61,6 +61,7 @@
 #include "CounterContent.h"
 #include "CursorList.h"
 #include "DocumentStyleSheetCollection.h"
+#include "ElementShadow.h"
 #include "FontFeatureValue.h"
 #include "FontValue.h"
 #include "Frame.h"
@@ -958,6 +959,27 @@ inline void StyleResolver::initElement(Element* e)
     }
 }
 
+inline bool shouldResetStyleInheritance(NodeRenderingContext& context)
+{
+    if (context.resetStyleInheritance())
+        return true;
+
+    InsertionPoint* insertionPoint = context.insertionPoint();
+    if (!insertionPoint)
+        return false;
+    ASSERT(context.node()->parentElement());
+    ElementShadow* shadow = context.node()->parentElement()->shadow();
+    ASSERT(shadow);
+
+    for ( ; insertionPoint; ) {
+        InsertionPoint* youngerInsertionPoint = shadow->insertionPointFor(insertionPoint);
+        if (!youngerInsertionPoint)
+            break;
+        insertionPoint = youngerInsertionPoint;
+    }
+    return insertionPoint->resetStyleInheritance();
+}
+
 inline void StyleResolver::initForStyleResolve(Element* e, RenderStyle* parentStyle, PseudoId pseudoID)
 {
     m_pseudoStyle = pseudoID;
@@ -965,7 +987,7 @@ inline void StyleResolver::initForStyleResolve(Element* e, RenderStyle* parentSt
     if (e) {
         NodeRenderingContext context(e);
         m_parentNode = context.parentNodeForRenderingAndStyle();
-        m_parentStyle = context.resetStyleInheritance()? 0 :
+        m_parentStyle = shouldResetStyleInheritance(context) ? 0 :
             parentStyle ? parentStyle :
             m_parentNode ? m_parentNode->renderStyle() : 0;
         m_distributedToInsertionPoint = context.insertionPoint();
index c928d44..df08b38 100644 (file)
@@ -30,5 +30,6 @@ module html {
         V8EnabledAtRuntime=shadowDOM
     ] HTMLContentElement : HTMLElement {
         attribute [Reflect] DOMString select;
+        attribute boolean resetStyleInheritance;
     };
 }
index 94facb7..c2c8f1a 100644 (file)
@@ -34,6 +34,7 @@ module html {
         Conditional=SHADOW_DOM,
         V8EnabledAtRuntime=shadowDOM
     ] HTMLShadowElement : HTMLElement {
+        attribute boolean resetStyleInheritance;
     };
 
 }
index 62f71cc..7aecaa5 100644 (file)
@@ -39,6 +39,7 @@ namespace WebCore {
 
 InsertionPoint::InsertionPoint(const QualifiedName& tagName, Document* document)
     : HTMLElement(tagName, document)
+    , m_shouldResetStyleInheritance(false)
 {
 }
 
@@ -159,4 +160,18 @@ void InsertionPoint::removedFrom(ContainerNode* insertionPoint)
     HTMLElement::removedFrom(insertionPoint);
 }
 
+bool InsertionPoint::resetStyleInheritance() const
+{
+    return m_shouldResetStyleInheritance;
+}
+
+void InsertionPoint::setResetStyleInheritance(bool value)
+{
+    if (value != m_shouldResetStyleInheritance) {
+        m_shouldResetStyleInheritance = value;
+        if (attached() && isActive())
+            shadowRoot()->host()->setNeedsStyleRecalc();
+    }
+}
+
 } // namespace WebCore
index bd446b8..2ef36c1 100644 (file)
@@ -55,6 +55,9 @@ public:
     virtual bool isSelectValid() const = 0;
     virtual bool doesSelectFromHostChildren() const = 0;
 
+    bool resetStyleInheritance() const;
+    void setResetStyleInheritance(bool);
+
     virtual void attach();
     virtual void detach();
     virtual bool isInsertionPoint() const OVERRIDE { return true; }
@@ -77,6 +80,7 @@ protected:
 
 private:
     ContentDistribution m_distribution;
+    bool m_shouldResetStyleInheritance : 1;
 };
 
 inline bool isInsertionPoint(const Node* node)