Changeset 281685 in webkit


Ignore:
Timestamp:
Aug 26, 2021 9:58:53 PM (11 months ago)
Author:
commit-queue@webkit.org
Message:

Caret should respect text background color
​https://bugs.webkit.org/show_bug.cgi?id=117493

Patch by Joone Hur <Joone Hur> on 2021-08-26
Reviewed by Ryosuke Niwa.

Source/WebCore:

An earlier fix for caret color, which we are now improving, was this commit:
​https://trac.webkit.org/changeset/152612/webkit

This patch allows the caret to become visible in the black background
by getting the caret color from the element containing
the text, not the root editable element that has the contentEditable attribute.

  • editing/FrameSelection.cpp:

(WebCore::CaretBase::computeCaretColor):

LayoutTests:

Rebaselined caret rendering tests.

  • editing/caret/caret-color.html:
  • editing/caret/color-span-inside-editable-background-expected.html:
  • editing/caret/color-span-inside-editable-expected.html:
  • fast/css/caret-color-auto-expected.html:
  • platform/ios-wk2/editing/caret/caret-color-expected.png:
  • platform/ios/editing/caret/caret-color-expected.txt:
  • platform/mac/editing/caret/caret-color-expected.png:
  • platform/mac/editing/caret/caret-color-expected.txt:
  • platform/win/editing/caret/caret-color-expected.txt:
Location:
trunk
Files:
12 edited

Legend:

Unmodified
Added
Removed

  • trunk/LayoutTests/ChangeLog

    r281683 r281685  
     12021-08-26  Joone Hur  <joone@webkit.org>
     2
     3        Caret should respect text background color
     4        https://bugs.webkit.org/show_bug.cgi?id=117493
     5
     6        Reviewed by Ryosuke Niwa.
     7
     8        Rebaselined caret rendering tests.
     9
     10        * editing/caret/caret-color.html:
     11        * editing/caret/color-span-inside-editable-background-expected.html:
     12        * editing/caret/color-span-inside-editable-expected.html:
     13        * fast/css/caret-color-auto-expected.html:
     14        * platform/ios-wk2/editing/caret/caret-color-expected.png:
     15        * platform/ios/editing/caret/caret-color-expected.txt:
     16        * platform/mac/editing/caret/caret-color-expected.png:
     17        * platform/mac/editing/caret/caret-color-expected.txt:
     18        * platform/win/editing/caret/caret-color-expected.txt:
     19
    1202021-08-26  Simon Fraser  <simon.fraser@apple.com>
    221

  • trunk/LayoutTests/editing/caret/caret-color.html

    r152612 r281685  
    1717</head>
    1818<body>
    19 <p>This tests to make sure that the caret is visible in the black background by getting the caret color from the color of the element(span) containing the text, not the parent element(div) that has the contentEditable attribute.
     19<p>This tests to make sure that the caret is visible in the black background by getting the caret color from the color of the element(span) containing the text, not the root editable element(div) that has the contentEditable attribute.
    2020</p>
    21 <div contenteditable id="root" class="editing">
    22 <span id="test" style="color: white; background-color: black">Where is my caret?</span>
     21<div contenteditable id="root" class="editing" style="background-color: black" >
     22<span id="test" style="color: white">Where is my caret?</span>
    2323</div>
    2424

  • trunk/LayoutTests/editing/caret/color-span-inside-editable-background-expected.html

    r175152 r281685  
    11This test makes sure that carets in content editable divs with a background color specified remain black even if there is a span inside them with a foreground color specified.
    22<div style="width: 505px; height: 505px; overflow: hidden;">
    3 <div style="width: 50px; height: 500px; background-color: black"></div>
     3<div style="width: 50px; height: 500px; background-color: red"></div>
    44</div>

  • trunk/LayoutTests/editing/caret/color-span-inside-editable-expected.html

    r173246 r281685  
    11This test makes sure that carets in content editable divs remain black even if there is a span inside them with a foreground color specified.
    22<div style="width: 505px; height: 505px; overflow: hidden;">
    3 <div style="width: 50px; height: 500px; background-color: black"></div>
     3<div style="width: 50px; height: 500px; background-color: red"></div>
    44</div>

  • trunk/LayoutTests/fast/css/caret-color-auto-expected.html

    r220706 r281685  
    1212    background-color: white;
    1313    color: red;
    14     caret-color: green;
     14    caret-color: red;
    1515    transform-origin: left top;
    1616    transform: scale(50, 50);

  • trunk/LayoutTests/platform/ios/editing/caret/caret-color-expected.txt

    r179104 r281685  
    1212        RenderText {#text} at (0,0) size 754x39
    1313          text run at (0,0) width 754: "This tests to make sure that the caret is visible in the black background by getting the caret color from the color of the"
    14           text run at (0,20) width 638: "element(span) containing the text, not the parent element(div) that has the contentEditable attribute."
    15       RenderBlock {DIV} at (0,56) size 784x20
    16         RenderInline {SPAN} at (0,0) size 124x19 [color=#FFFFFF] [bgcolor=#000000]
     14          text run at (0,20) width 679: "element(span) containing the text, not the root editable element(div) that has the contentEditable attribute."
     15      RenderBlock {DIV} at (0,56) size 784x20 [bgcolor=#000000]
     16        RenderInline {SPAN} at (0,0) size 124x19 [color=#FFFFFF]
    1717          RenderText {#text} at (0,0) size 124x19
    1818            text run at (0,0) width 124: "Where is my caret?"

  • trunk/LayoutTests/platform/mac/editing/caret/caret-color-expected.txt

    r177774 r281685  
    1212        RenderText {#text} at (0,0) size 754x36
    1313          text run at (0,0) width 754: "This tests to make sure that the caret is visible in the black background by getting the caret color from the color of the"
    14           text run at (0,18) width 638: "element(span) containing the text, not the parent element(div) that has the contentEditable attribute."
    15       RenderBlock {DIV} at (0,52) size 784x18
    16         RenderInline {SPAN} at (0,0) size 124x18 [color=#FFFFFF] [bgcolor=#000000]
     14          text run at (0,18) width 679: "element(span) containing the text, not the root editable element(div) that has the contentEditable attribute."
     15      RenderBlock {DIV} at (0,52) size 784x18 [bgcolor=#000000]
     16        RenderInline {SPAN} at (0,0) size 124x18 [color=#FFFFFF]
    1717          RenderText {#text} at (0,0) size 124x18
    1818            text run at (0,0) width 124: "Where is my caret?"

  • trunk/LayoutTests/platform/win/editing/caret/caret-color-expected.txt

    r152736 r281685  
     1EDITING DELEGATE: shouldBeginEditingInDOMRange:range from 0 of DIV > BODY > HTML > #document to 3 of DIV > BODY > HTML > #document
     2EDITING DELEGATE: webViewDidBeginEditing:WebViewDidBeginEditingNotification
     3EDITING DELEGATE: webViewDidChangeSelection:WebViewDidChangeSelectionNotification
     4EDITING DELEGATE: webViewDidChangeSelection:WebViewDidChangeSelectionNotification
     5EDITING DELEGATE: webViewDidChangeSelection:WebViewDidChangeSelectionNotification
    16layer at (0,0) size 800x600
    27  RenderView at (0,0) size 800x600
    … …  
    712        RenderText {#text} at (0,0) size 735x36
    813          text run at (0,0) width 735: "This tests to make sure that the caret is visible in the black background by getting the caret color from the color of the"
    9           text run at (0,18) width 621: "element(span) containing the text, not the parent element(div) that has the contentEditable attribute."
    10       RenderBlock {DIV} at (0,52) size 784x18
    11         RenderInline {SPAN} at (0,0) size 121x18 [color=#FFFFFF] [bgcolor=#000000]
     14          text run at (0,18) width 660: "element(span) containing the text, not the root editable element(div) that has the contentEditable attribute."
     15      RenderBlock {DIV} at (0,52) size 784x18 [bgcolor=#000000]
     16        RenderInline {SPAN} at (0,0) size 121x18 [color=#FFFFFF]
    1217          RenderText {#text} at (0,0) size 121x18
    1318            text run at (0,0) width 121: "Where is my caret?"

  • trunk/Source/WebCore/ChangeLog

    r281683 r281685  
     12021-08-26  Joone Hur  <joone@webkit.org>
     2
     3        Caret should respect text background color
     4        https://bugs.webkit.org/show_bug.cgi?id=117493
     5
     6        Reviewed by Ryosuke Niwa.
     7
     8        An earlier fix for caret color, which we are now improving, was this commit:
     9        https://trac.webkit.org/changeset/152612/webkit
     10
     11        This patch allows the caret to become visible in the black background
     12        by getting the caret color from the element containing
     13        the text, not the root editable element that has the contentEditable attribute.
     14
     15        * editing/FrameSelection.cpp:
     16        (WebCore::CaretBase::computeCaretColor):
     17
    1182021-08-26  Simon Fraser  <simon.fraser@apple.com>
    219

  • trunk/Source/WebCore/editing/FrameSelection.cpp

    r280872 r281685  
    17911791    return elementStyle.caretColor();
    17921792#else
    1793     auto* rootEditableElement = node ? node->rootEditableElement() : nullptr;
    1794     auto* rootEditableStyle = rootEditableElement && rootEditableElement->renderer() ? &rootEditableElement->renderer()->style() : nullptr;
     1793    RefPtr parentElement = node ? node->parentElement() : nullptr;
     1794    auto* parentStyle = parentElement && parentElement->renderer() ? &parentElement->renderer()->style() : nullptr;
    17951795    // CSS value "auto" is treated as an invalid color.
    1796     if (!elementStyle.caretColor().isValid() && rootEditableStyle) {
    1797         auto rootEditableBackgroundColor = rootEditableStyle->visitedDependentColorWithColorFilter(CSSPropertyBackgroundColor);
     1796    if (!elementStyle.caretColor().isValid() && parentStyle) {
     1797        auto parentBackgroundColor = parentStyle->visitedDependentColorWithColorFilter(CSSPropertyBackgroundColor);
    17981798        auto elementBackgroundColor = elementStyle.visitedDependentColorWithColorFilter(CSSPropertyBackgroundColor);
    1799         auto disappearsIntoBackground = blendSourceOver(rootEditableBackgroundColor, elementBackgroundColor) == rootEditableBackgroundColor;
     1799        auto disappearsIntoBackground = blendSourceOver(parentBackgroundColor, elementBackgroundColor) == parentBackgroundColor;
    18001800        if (disappearsIntoBackground)
    1801             return rootEditableStyle->visitedDependentColorWithColorFilter(CSSPropertyCaretColor);
     1801            return parentStyle->visitedDependentColorWithColorFilter(CSSPropertyCaretColor);
    18021802    }
    18031803    return elementStyle.visitedDependentColorWithColorFilter(CSSPropertyCaretColor);
Note: See TracChangeset for help on using the changeset viewer.