Merge r182546 - Fill list style background with same color with that …

…of list background. https://bugs.webkit.org/show_bug.cgi?id=143483 Reviewed by Simon Fraser. Source/WebCore: LayoutListMarker does not have a node so its selectionBackgroundColor alway returns the default theme color for selection. We can make it more natural by filling the same color with that of LayoutListItem into it. Tests: fast/backgrounds/selection-background-color-of-image-list-style.html fast/backgrounds/selection-background-color-of-list-style.html * rendering/RenderListMarker.cpp: (WebCore::RenderListMarker::paint): LayoutTests: * fast/backgrounds/selection-background-color-of-image-list-style.html: Added. * fast/backgrounds/selection-background-color-of-list-style.html: Added. * platform/gtk/fast/backgrounds/selection-background-color-of-image-list-style-expected.png: Added. * platform/gtk/fast/backgrounds/selection-background-color-of-image-list-style-expected.txt: Added. * platform/gtk/fast/backgrounds/selection-background-color-of-list-style-expected.png: Added. * platform/gtk/fast/backgrounds/selection-background-color-of-list-style-expected.txt: Added. * platform/mac/fast/backgrounds/selection-background-color-of-image-list-style-expected.png: Added. * platform/mac/fast/backgrounds/selection-background-color-of-image-list-style-expected.txt: Added. * platform/mac/fast/backgrounds/selection-background-color-of-list-style-expected.png: Added. * platform/mac/fast/backgrounds/selection-background-color-of-list-style-expected.txt: Added.
WebKit · Apr 13, 2015 · 40fc608 · 40fc608
1 parent 0b3abad
commit 40fc608
Show file tree

Hide file tree

Showing 13 changed files with 174 additions and 2 deletions.
diff --git a/LayoutTests/ChangeLog b/LayoutTests/ChangeLog
@@ -1,3 +1,21 @@
+2015-04-08  ChangSeok Oh  <changseok.oh@collabora.com>
+
+        Fill list style background with same color with that of list background.
+        https://bugs.webkit.org/show_bug.cgi?id=143483
+
+        Reviewed by Simon Fraser.
+
+        * fast/backgrounds/selection-background-color-of-image-list-style.html: Added.
+        * fast/backgrounds/selection-background-color-of-list-style.html: Added.
+        * platform/gtk/fast/backgrounds/selection-background-color-of-image-list-style-expected.png: Added.
+        * platform/gtk/fast/backgrounds/selection-background-color-of-image-list-style-expected.txt: Added.
+        * platform/gtk/fast/backgrounds/selection-background-color-of-list-style-expected.png: Added.
+        * platform/gtk/fast/backgrounds/selection-background-color-of-list-style-expected.txt: Added.
+        * platform/mac/fast/backgrounds/selection-background-color-of-image-list-style-expected.png: Added.
+        * platform/mac/fast/backgrounds/selection-background-color-of-image-list-style-expected.txt: Added.
+        * platform/mac/fast/backgrounds/selection-background-color-of-list-style-expected.png: Added.
+        * platform/mac/fast/backgrounds/selection-background-color-of-list-style-expected.txt: Added.
+
 2015-03-31  Said Abou-Hallawa  <sabouhallawa@apple.com>
 
         border-image with 'fill' keyword does not fill the middle area unless the border width is greater than zero.

diff --git a/LayoutTests/fast/backgrounds/selection-background-color-of-image-list-style.html b/LayoutTests/fast/backgrounds/selection-background-color-of-image-list-style.html
@@ -0,0 +1,17 @@
+<!DOCTYPE html>
+<style>
+ul { list-style-image: url('./resources/diamond.png'); }
+ul>li::selection { background: yellow; }
+</style>
+<div>
+  Test pass if background of image list style in ul is yellow.
+  <ul>
+    <li>One</li>
+    <li>Two</li>
+  </ul>
+</div>
+<script>
+var range = document.createRange();
+range.selectNode(document.querySelector('ul'));
+getSelection().addRange(range);
+</script>
diff --git a/LayoutTests/fast/backgrounds/selection-background-color-of-list-style.html b/LayoutTests/fast/backgrounds/selection-background-color-of-list-style.html
@@ -0,0 +1,22 @@
+<!DOCTYPE html>
+<style>
+ul>li::selection { background: green; }
+ol>li::selection { background: yellow; }
+</style>
+<div>
+  Test passes if backgrounds of list style in ul and ol are each green and yellow.
+  <ul>
+    <li>One</li>
+    <li>Two</li>
+  </ul>
+  <ol>
+    <li>One</li>
+    <li>Two</li>
+  </ol>
+</div>
+<script>
+var range = document.createRange();
+range.setStartBefore(document.querySelector('ul'));
+range.setEndAfter(document.querySelector('ol'));
+getSelection().addRange(range);
+</script>
diff --git a/...tk/fast/backgrounds/selection-background-color-of-image-list-style-expected.png b/...tk/fast/backgrounds/selection-background-color-of-image-list-style-expected.png
diff --git a/...platform/gtk/fast/backgrounds/selection-background-color-of-image-list-style-expected.txt b/...platform/gtk/fast/backgrounds/selection-background-color-of-image-list-style-expected.txt
@@ -0,0 +1,20 @@
+layer at (0,0) size 800x600
+  RenderView at (0,0) size 800x600
+layer at (0,0) size 800x91
+  RenderBlock {HTML} at (0,0) size 800x91
+    RenderBody {BODY} at (8,8) size 784x67
+      RenderBlock {DIV} at (0,0) size 784x67
+        RenderBlock (anonymous) at (0,0) size 784x17
+          RenderText {#text} at (0,0) size 361x17
+            text run at (0,0) width 361: "Test pass if background of image list style in ul is yellow."
+        RenderBlock {UL} at (0,33) size 784x34
+          RenderListItem {LI} at (40,0) size 744x17
+            RenderListMarker at (-17,4) size 10x10
+            RenderText {#text} at (0,0) size 27x17
+              text run at (0,0) width 27: "One"
+          RenderListItem {LI} at (40,17) size 744x17
+            RenderListMarker at (-17,4) size 10x10
+            RenderText {#text} at (0,0) size 30x17
+              text run at (0,0) width 30: "Two"
+selection start: position 66 of child 0 {#text} of child 0 {DIV} of body
+selection end:   position 3 of child 0 {#text} of child 3 {LI} of child 1 {UL} of child 0 {DIV} of body
diff --git a/...form/gtk/fast/backgrounds/selection-background-color-of-list-style-expected.png b/...form/gtk/fast/backgrounds/selection-background-color-of-list-style-expected.png
diff --git a/...Tests/platform/gtk/fast/backgrounds/selection-background-color-of-list-style-expected.txt b/...Tests/platform/gtk/fast/backgrounds/selection-background-color-of-list-style-expected.txt
@@ -0,0 +1,29 @@
+layer at (0,0) size 800x600
+  RenderView at (0,0) size 800x600
+layer at (0,0) size 800x141
+  RenderBlock {HTML} at (0,0) size 800x141
+    RenderBody {BODY} at (8,8) size 784x117
+      RenderBlock {DIV} at (0,0) size 784x117
+        RenderBlock (anonymous) at (0,0) size 784x17
+          RenderText {#text} at (0,0) size 489x17
+            text run at (0,0) width 489: "Test passes if backgrounds of list style in ul and ol are each green and yellow."
+        RenderBlock {UL} at (0,33) size 784x34
+          RenderListItem {LI} at (40,0) size 744x17
+            RenderListMarker at (-17,0) size 7x17: bullet
+            RenderText {#text} at (0,0) size 27x17
+              text run at (0,0) width 27: "One"
+          RenderListItem {LI} at (40,17) size 744x17
+            RenderListMarker at (-17,0) size 7x17: bullet
+            RenderText {#text} at (0,0) size 30x17
+              text run at (0,0) width 30: "Two"
+        RenderBlock {OL} at (0,83) size 784x34
+          RenderListItem {LI} at (40,0) size 744x17
+            RenderListMarker at (-20,0) size 16x17: "1"
+            RenderText {#text} at (0,0) size 27x17
+              text run at (0,0) width 27: "One"
+          RenderListItem {LI} at (40,17) size 744x17
+            RenderListMarker at (-20,0) size 16x17: "2"
+            RenderText {#text} at (0,0) size 30x17
+              text run at (0,0) width 30: "Two"
+selection start: position 86 of child 0 {#text} of child 0 {DIV} of body
+selection end:   position 3 of child 0 {#text} of child 3 {LI} of child 3 {OL} of child 0 {DIV} of body
diff --git a/...ac/fast/backgrounds/selection-background-color-of-image-list-style-expected.png b/...ac/fast/backgrounds/selection-background-color-of-image-list-style-expected.png
diff --git a/...platform/mac/fast/backgrounds/selection-background-color-of-image-list-style-expected.txt b/...platform/mac/fast/backgrounds/selection-background-color-of-image-list-style-expected.txt
@@ -0,0 +1,20 @@
+layer at (0,0) size 800x600
+  RenderView at (0,0) size 800x600
+layer at (0,0) size 800x94
+  RenderBlock {HTML} at (0,0) size 800x94
+    RenderBody {BODY} at (8,8) size 784x70
+      RenderBlock {DIV} at (0,0) size 784x70
+        RenderBlock (anonymous) at (0,0) size 784x18
+          RenderText {#text} at (0,0) size 368x18
+            text run at (0,0) width 368: "Test pass if background of image list style in ul is yellow."
+        RenderBlock {UL} at (0,34) size 784x36
+          RenderListItem {LI} at (40,0) size 744x18
+            RenderListMarker at (-17,4) size 10x10
+            RenderText {#text} at (0,0) size 27x18
+              text run at (0,0) width 27: "One"
+          RenderListItem {LI} at (40,18) size 744x18
+            RenderListMarker at (-17,4) size 10x10
+            RenderText {#text} at (0,0) size 29x18
+              text run at (0,0) width 29: "Two"
+selection start: position 66 of child 0 {#text} of child 0 {DIV} of body
+selection end:   position 3 of child 0 {#text} of child 3 {LI} of child 1 {UL} of child 0 {DIV} of body
diff --git a/...form/mac/fast/backgrounds/selection-background-color-of-list-style-expected.png b/...form/mac/fast/backgrounds/selection-background-color-of-list-style-expected.png
diff --git a/...Tests/platform/mac/fast/backgrounds/selection-background-color-of-list-style-expected.txt b/...Tests/platform/mac/fast/backgrounds/selection-background-color-of-list-style-expected.txt
@@ -0,0 +1,29 @@
+layer at (0,0) size 800x600
+  RenderView at (0,0) size 800x600
+layer at (0,0) size 800x146
+  RenderBlock {HTML} at (0,0) size 800x146
+    RenderBody {BODY} at (8,8) size 784x122
+      RenderBlock {DIV} at (0,0) size 784x122
+        RenderBlock (anonymous) at (0,0) size 784x18
+          RenderText {#text} at (0,0) size 497x18
+            text run at (0,0) width 497: "Test passes if backgrounds of list style in ul and ol are each green and yellow."
+        RenderBlock {UL} at (0,34) size 784x36
+          RenderListItem {LI} at (40,0) size 744x18
+            RenderListMarker at (-17,0) size 7x18: bullet
+            RenderText {#text} at (0,0) size 27x18
+              text run at (0,0) width 27: "One"
+          RenderListItem {LI} at (40,18) size 744x18
+            RenderListMarker at (-17,0) size 7x18: bullet
+            RenderText {#text} at (0,0) size 29x18
+              text run at (0,0) width 29: "Two"
+        RenderBlock {OL} at (0,86) size 784x36
+          RenderListItem {LI} at (40,0) size 744x18
+            RenderListMarker at (-20,0) size 16x18: "1"
+            RenderText {#text} at (0,0) size 27x18
+              text run at (0,0) width 27: "One"
+          RenderListItem {LI} at (40,18) size 744x18
+            RenderListMarker at (-20,0) size 16x18: "2"
+            RenderText {#text} at (0,0) size 29x18
+              text run at (0,0) width 29: "Two"
+selection start: position 86 of child 0 {#text} of child 0 {DIV} of body
+selection end:   position 3 of child 0 {#text} of child 3 {LI} of child 3 {OL} of child 0 {DIV} of body
diff --git a/Source/WebCore/ChangeLog b/Source/WebCore/ChangeLog
@@ -1,3 +1,20 @@
+2015-04-08  ChangSeok Oh  <changseok.oh@collabora.com>
+
+        Fill list style background with same color with that of list background.
+        https://bugs.webkit.org/show_bug.cgi?id=143483
+
+        Reviewed by Simon Fraser.
+
+        LayoutListMarker does not have a node so its selectionBackgroundColor alway returns
+        the default theme color for selection. We can make it more natural by filling
+        the same color with that of LayoutListItem into it.
+
+        Tests: fast/backgrounds/selection-background-color-of-image-list-style.html
+               fast/backgrounds/selection-background-color-of-list-style.html
+
+        * rendering/RenderListMarker.cpp:
+        (WebCore::RenderListMarker::paint):
+
 2015-04-08  Carlos Garcia Campos  <cgarcia@igalia.com>
 
         [GTK] Crash in DOMObjectCache when a wrapped object owned by the cache is unreffed by the user

diff --git a/Source/WebCore/rendering/RenderListMarker.cpp b/Source/WebCore/rendering/RenderListMarker.cpp
@@ -1201,15 +1201,15 @@ void RenderListMarker::paint(PaintInfo& paintInfo, const LayoutPoint& paintOffse
         if (selectionState() != SelectionNone) {
             LayoutRect selRect = localSelectionRect();
             selRect.moveBy(boxOrigin);
-            context->fillRect(snappedIntRect(selRect), selectionBackgroundColor(), style().colorSpace());
+            context->fillRect(snappedIntRect(selRect), m_listItem.selectionBackgroundColor(), style().colorSpace());
         }
         return;
     }
 
     if (selectionState() != SelectionNone) {
         LayoutRect selRect = localSelectionRect();
         selRect.moveBy(boxOrigin);
-        context->fillRect(snappedIntRect(selRect), selectionBackgroundColor(), style().colorSpace());
+        context->fillRect(snappedIntRect(selRect), m_listItem.selectionBackgroundColor(), style().colorSpace());
     }
 
     const Color color(style().visitedDependentColor(CSSPropertyColor));