Bug 149843 - Backgrounds bleed out of natively rendered text fields
Summary: Backgrounds bleed out of natively rendered text fields
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: WebCore Misc. (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2015-10-06 08:11 PDT by Wenson Hsieh
Modified: 2015-10-12 11:39 PDT (History)
9 users (show)

See Also:


Attachments
Patch (7.63 KB, patch)
2015-10-06 09:55 PDT, Wenson Hsieh
no flags Details | Formatted Diff | Diff
Patch (6.85 KB, patch)
2015-10-07 18:53 PDT, Wenson Hsieh
no flags Details | Formatted Diff | Diff
Patch (2.36 KB, patch)
2015-10-08 09:31 PDT, Wenson Hsieh
no flags Details | Formatted Diff | Diff
Patch (7.07 KB, patch)
2015-10-08 11:27 PDT, Wenson Hsieh
no flags Details | Formatted Diff | Diff
Archive of layout-test-results from ews102 for mac-mavericks (642.57 KB, application/zip)
2015-10-08 12:00 PDT, Build Bot
no flags Details
Archive of layout-test-results from ews105 for mac-mavericks-wk2 (684.71 KB, application/zip)
2015-10-08 12:05 PDT, Build Bot
no flags Details
Patch (7.06 KB, patch)
2015-10-08 12:06 PDT, Wenson Hsieh
darin: review+
Details | Formatted Diff | Diff
Patch (6.63 KB, patch)
2015-10-08 17:00 PDT, Wenson Hsieh
no flags Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Wenson Hsieh 2015-10-06 08:11:34 PDT
Load data:text/html,<input style="background: yellow"> and look closely at the bounds of the text field. Observe that the yellow background bleeds out of the text field's border by 1 device pixel.
Comment 1 Wenson Hsieh 2015-10-06 09:51:36 PDT
<rdar://problem/22896977>
Comment 2 Wenson Hsieh 2015-10-06 09:55:43 PDT
Created attachment 262519 [details]
Patch
Comment 3 Wenson Hsieh 2015-10-07 18:53:42 PDT
Created attachment 262666 [details]
Patch
Comment 4 Said Abou-Hallawa 2015-10-08 09:12:44 PDT
Comment on attachment 262666 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=262666&action=review

> Source/WebCore/rendering/RenderBox.cpp:1336
> +    paintFillLayers(paintInfo, style().visitedDependentColor(CSSPropertyBackgroundColor), style().backgroundLayers(), adjustedBackgroundPaintRect(paintInfo.context(), paintRect), bleedAvoidance);

Should not we make paintBackground() itself virtual and make RenderTextControlSingleLine overrides it? I think RenderTextControlSingleLine:: paintBackground() will only have to make a copy of paintRect, adjust it using shrinkRectByOneDevicePixel() and then call the base class function paintBackground(). I think this approach is clearer since the sequence of calls goes from the derived class "RenderTextControlSingleLine::paintBackground()" to the base class "RenderBox::paintBackground()".  Your approach actually flows from the base class "RenderBox::paintBackground()" to the derived class "RenderTextControlSingleLine::adjustedBackgroundPaintRect" and then back to the base class again "RenderBox::paintBackground()"."RenderBox::paintBackground()".
Comment 5 Wenson Hsieh 2015-10-08 09:31:45 PDT
Created attachment 262696 [details]
Patch
Comment 6 zalan 2015-10-08 09:34:17 PDT
Comment on attachment 262696 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=262696&action=review

> Source/WebCore/rendering/RenderThemeMac.mm:860
> +        adjustedPaintRect.inflateX(LayoutUnit::fromPixel(1) / transform.xScale());
> +        adjustedPaintRect.inflateY(LayoutUnit::fromPixel(1) / transform.yScale());

shouldn't that be LayoutUnit::fromPixel(1/deviceScaleFactor) ?
Comment 7 Darin Adler 2015-10-08 09:37:16 PDT
Comment on attachment 262696 [details]
Patch

Can we make a regression test for this please?
Comment 8 Wenson Hsieh 2015-10-08 09:44:10 PDT
Comment on attachment 262696 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=262696&action=review

>> Source/WebCore/rendering/RenderThemeMac.mm:860
>> +        adjustedPaintRect.inflateY(LayoutUnit::fromPixel(1) / transform.yScale());
> 
> shouldn't that be LayoutUnit::fromPixel(1/deviceScaleFactor) ?

the device scale factor is accounted for in the x/yScales.
Comment 9 Wenson Hsieh 2015-10-08 09:44:25 PDT
(In reply to comment #7)
> Comment on attachment 262696 [details]
> Patch
> 
> Can we make a regression test for this please?

Will do!
Comment 10 Wenson Hsieh 2015-10-08 11:27:30 PDT
Created attachment 262702 [details]
Patch
Comment 11 Build Bot 2015-10-08 12:00:31 PDT
Comment on attachment 262702 [details]
Patch

Attachment 262702 [details] did not pass mac-ews (mac):
Output: http://webkit-queues.webkit.org/results/258336

New failing tests:
fast/forms/textfield-background-bleeding.html
Comment 12 Build Bot 2015-10-08 12:00:34 PDT
Created attachment 262703 [details]
Archive of layout-test-results from ews102 for mac-mavericks

The attached test failures were seen while running run-webkit-tests on the mac-ews.
Bot: ews102  Port: mac-mavericks  Platform: Mac OS X 10.9.5
Comment 13 Build Bot 2015-10-08 12:05:11 PDT
Comment on attachment 262702 [details]
Patch

Attachment 262702 [details] did not pass mac-wk2-ews (mac-wk2):
Output: http://webkit-queues.webkit.org/results/258338

New failing tests:
fast/forms/textfield-background-bleeding.html
Comment 14 Build Bot 2015-10-08 12:05:14 PDT
Created attachment 262704 [details]
Archive of layout-test-results from ews105 for mac-mavericks-wk2

The attached test failures were seen while running run-webkit-tests on the mac-wk2-ews.
Bot: ews105  Port: mac-mavericks-wk2  Platform: Mac OS X 10.9.5
Comment 15 Wenson Hsieh 2015-10-08 12:06:12 PDT
Created attachment 262705 [details]
Patch
Comment 16 Darin Adler 2015-10-08 15:13:03 PDT
Comment on attachment 262705 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=262705&action=review

> Source/WebCore/rendering/RenderThemeMac.mm:856
> +    FloatRect adjustedPaintRect(r);

I think this needs a brief, precise comment explaining why the code does this. The sequence starting on this line is a perfect example of code that is not self explanatory! Maybe something like the change log, but shorter.

> Source/WebCore/rendering/RenderThemeMac.mm:860
> +        adjustedPaintRect.inflateX(LayoutUnit::fromPixel(1) / transform.xScale());
> +        adjustedPaintRect.inflateY(LayoutUnit::fromPixel(1) / transform.yScale());

Does this yield a different result than if you write:

    adjustedPaintRect.inflateX(1 / transform.xScale());
    adjustedPaintRect.inflateY(1 / transform.xScale());

I’m not sure why it’s helpful to involve LayoutUnit since xScale and yScale are already floating point.
Comment 17 Wenson Hsieh 2015-10-08 16:59:39 PDT
Comment on attachment 262705 [details]
Patch

View in context: https://bugs.webkit.org/attachment.cgi?id=262705&action=review

>> Source/WebCore/rendering/RenderThemeMac.mm:856
>> +    FloatRect adjustedPaintRect(r);
> 
> I think this needs a brief, precise comment explaining why the code does this. The sequence starting on this line is a perfect example of code that is not self explanatory! Maybe something like the change log, but shorter.

Got it. I'll write a sentence about why this adjustment is necessary, and include a link to the radar.

>> Source/WebCore/rendering/RenderThemeMac.mm:860
>> +        adjustedPaintRect.inflateY(LayoutUnit::fromPixel(1) / transform.yScale());
> 
> Does this yield a different result than if you write:
> 
>     adjustedPaintRect.inflateX(1 / transform.xScale());
>     adjustedPaintRect.inflateY(1 / transform.xScale());
> 
> I’m not sure why it’s helpful to involve LayoutUnit since xScale and yScale are already floating point.

Yes -- just verified that it yields the same result. I'll change it to just use the literal value.
Comment 18 Wenson Hsieh 2015-10-08 17:00:27 PDT
Created attachment 262727 [details]
Patch
Comment 19 Wenson Hsieh 2015-10-09 08:19:14 PDT
Committed r190800: <http://trac.webkit.org/changeset/190800>
Comment 20 Brent Fulgham 2015-10-12 11:31:01 PDT
This change introduced a test failure on Windows. It may just need a Windows-specific baseline:

fast/forms/hidpi-textfield-background-bleeding.html
Comment 21 Wenson Hsieh 2015-10-12 11:34:40 PDT
Sorry about that! This test only affects Mac platforms. I'll update the windows TestExpectations to reflect this.
Comment 22 Brent Fulgham 2015-10-12 11:39:20 PDT
This test won't work on Windows:

1. Windows doesn't support 0.5px widths (waiting for hidpi support).
2. The solid black border used in the "expected" file does not match the style of native Windows edit controls (which has a bevelled border).

Since this bug seems very Mac-specific, I'll skip on Windows.