Bug 54841 - Text overflow ellipsis wrong color when using webkit-text-fill-color
Summary: Text overflow ellipsis wrong color when using webkit-text-fill-color
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: 528+ (Nightly build)
Hardware: Mac (Intel) OS X 10.6
: P2 Normal
Assignee: Rob Buis
URL:
Keywords:
Depends on:
Blocks:
 
Reported: 2011-02-20 18:50 PST by Luke Alonso
Modified: 2013-03-02 13:13 PST (History)
7 users (show)

See Also:


Attachments
A repro case (772 bytes, text/html)
2011-02-20 18:50 PST, Luke Alonso
no flags Details
Patch (1.56 KB, patch)
2012-06-08 19:01 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Archive of layout-test-results from ec2-cr-linux-04 (742.19 KB, application/zip)
2012-06-09 00:41 PDT, WebKit Review Bot
no flags Details
Patch (13.58 KB, patch)
2012-06-09 11:39 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Archive of layout-test-results from ec2-cr-linux-04 (598.82 KB, application/zip)
2012-06-09 14:05 PDT, WebKit Review Bot
no flags Details
Patch (13.55 KB, patch)
2012-06-11 13:28 PDT, Rob Buis
no flags Details | Formatted Diff | Diff
Archive of layout-test-results from ec2-cr-linux-03 (1.42 MB, application/zip)
2012-06-11 15:05 PDT, WebKit Review Bot
no flags Details
Patch (13.51 KB, patch)
2012-11-17 11:19 PST, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (3.93 KB, patch)
2012-11-17 14:23 PST, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (3.97 KB, patch)
2012-11-19 10:34 PST, Rob Buis
no flags Details | Formatted Diff | Diff
Patch (4.04 KB, patch)
2012-11-19 18:40 PST, Rob Buis
hyatt: review+
Details | Formatted Diff | Diff

Note You need to log in before you can comment on or make changes to this bug.
Description Luke Alonso 2011-02-20 18:50:41 PST
Created attachment 83114 [details]
A repro case

The ellipsis shown when using 'text-overflow: ellipsis' appears to be the wrong color when the text color has been specified using webkit-text-fill-color. I imagine it's rendering the ellipsis using the standard 'color' style. A random, likely wrong, guess after a cursory inspection of the codebase, is that it involves the following in EllipsisBox::paint:

    Color textColor = style->visitedDependentColor(CSSPropertyColor);
    if (textColor != context->fillColor())
        context->setFillColor(textColor, style->colorSpace());


A simple test case is attached.

I've reproduced this in Safari 5.0.3 and webkit nightly 533.19.4, r78794.
Comment 1 Luke Alonso 2011-02-27 11:05:59 PST
Comment on attachment 83114 [details]
A repro case

><html>
><body>
><div style="width: 225px; font-size: 24px; overflow: hidden; text-overflow: ellipsis; -webkit-text-fill-color: red; white-space: nowrap;">
>Wrong - This is a long string, which is clipped, but the ellipsis is the wrong color!
></div>
><div style="width: 225px; font-size: 24px; overflow: hidden; text-overflow: ellipsis; color: blue; white-space: nowrap;">
>Right - This is a long string, which is clipped, and the ellipsis is the right color!
></div
></body>
></html>
Comment 2 Rob Buis 2012-06-08 19:01:56 PDT
Created attachment 146679 [details]
Patch
Comment 3 Rob Buis 2012-06-08 19:02:42 PDT
Comment on attachment 146679 [details]
Patch

Just testing for now.
Comment 4 WebKit Review Bot 2012-06-08 19:05:27 PDT
Attachment 146679 [details] did not pass style-queue:

Failed to run "['Tools/Scripts/check-webkit-style', '--diff-files', u'Source/WebCore/ChangeLog', u'Source/WebCor..." exit_code: 1
Source/WebCore/ChangeLog:8:  You should remove the 'No new tests' and either add and list tests, or explain why no new tests were possible.  [changelog/nonewtests] [5]
Total errors found: 1 in 2 files


If any of these errors are false positives, please file a bug against check-webkit-style.
Comment 5 WebKit Review Bot 2012-06-09 00:40:58 PDT
Comment on attachment 146679 [details]
Patch

Attachment 146679 [details] did not pass chromium-ews (chromium-xvfb):
Output: http://queues.webkit.org/results/12935203

New failing tests:
fast/css/text-overflow-ellipsis-strict.html
fast/css/text-overflow-ellipsis.html
Comment 6 WebKit Review Bot 2012-06-09 00:41:02 PDT
Created attachment 146692 [details]
Archive of layout-test-results from ec2-cr-linux-04

The attached test failures were seen while running run-webkit-tests on the chromium-ews.
Bot: ec2-cr-linux-04  Port: <class 'webkitpy.common.config.ports.ChromiumXVFBPort'>  Platform: Linux-2.6.35-28-virtual-x86_64-with-Ubuntu-10.10-maverick
Comment 7 Rob Buis 2012-06-09 11:39:07 PDT
Created attachment 146711 [details]
Patch
Comment 8 WebKit Review Bot 2012-06-09 14:05:24 PDT
Comment on attachment 146711 [details]
Patch

Attachment 146711 [details] did not pass chromium-ews (chromium-xvfb):
Output: http://queues.webkit.org/results/12919820

New failing tests:
fast/css/text-overflow-ellipsis-color.html
Comment 9 WebKit Review Bot 2012-06-09 14:05:28 PDT
Created attachment 146718 [details]
Archive of layout-test-results from ec2-cr-linux-04

The attached test failures were seen while running run-webkit-tests on the chromium-ews.
Bot: ec2-cr-linux-04  Port: <class 'webkitpy.common.config.ports.ChromiumXVFBPort'>  Platform: Linux-2.6.35-28-virtual-x86_64-with-Ubuntu-10.10-maverick
Comment 10 Rob Buis 2012-06-11 13:28:40 PDT
Created attachment 146893 [details]
Patch
Comment 11 WebKit Review Bot 2012-06-11 15:05:05 PDT
Comment on attachment 146893 [details]
Patch

Attachment 146893 [details] did not pass chromium-ews (chromium-xvfb):
Output: http://queues.webkit.org/results/12948247

New failing tests:
fast/css/text-overflow-ellipsis-color.html
Comment 12 WebKit Review Bot 2012-06-11 15:05:09 PDT
Created attachment 146924 [details]
Archive of layout-test-results from ec2-cr-linux-03

The attached test failures were seen while running run-webkit-tests on the chromium-ews.
Bot: ec2-cr-linux-03  Port: <class 'webkitpy.common.config.ports.ChromiumXVFBPort'>  Platform: Linux-2.6.35-28-virtual-x86_64-with-Ubuntu-10.10-maverick
Comment 13 Rob Buis 2012-11-17 11:19:21 PST
Created attachment 174822 [details]
Patch
Comment 14 Darin Adler 2012-11-17 13:07:33 PST
Comment on attachment 174822 [details]
Patch

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

> LayoutTests/ChangeLog:12
> +        * platform/mac/fast/css/text-overflow-ellipsis-color-expected.png: Added.
> +        * platform/mac/fast/css/text-overflow-ellipsis-color-expected.txt: Added.

This should be done with a reference test, not a Mac-only pixel test.
Comment 15 WebKit Review Bot 2012-11-17 14:13:46 PST
Comment on attachment 174822 [details]
Patch

Attachment 174822 [details] did not pass chromium-ews (chromium-xvfb):
Output: http://queues.webkit.org/results/14868639

New failing tests:
fast/css/text-overflow-ellipsis-color.html
Comment 16 Rob Buis 2012-11-17 14:23:17 PST
Created attachment 174828 [details]
Patch
Comment 17 WebKit Review Bot 2012-11-17 15:18:42 PST
Comment on attachment 174828 [details]
Patch

Attachment 174828 [details] did not pass chromium-ews (chromium-xvfb):
Output: http://queues.webkit.org/results/14875456

New failing tests:
fast/css/text-overflow-ellipsis-color.html
Comment 18 Rob Buis 2012-11-19 10:34:48 PST
Created attachment 175003 [details]
Patch
Comment 19 Rob Buis 2012-11-19 10:38:50 PST
(In reply to comment #18)
> Created an attachment (id=175003) [details]
> Patch

I updated the patch to make it clear that part of the sentence should get clipped and replaced by ellipsis. If I am lucky cr-linux will stop complaining...
Comment 20 WebKit Review Bot 2012-11-19 12:27:20 PST
Comment on attachment 175003 [details]
Patch

Attachment 175003 [details] did not pass chromium-ews (chromium-xvfb):
Output: http://queues.webkit.org/results/14906296

New failing tests:
fast/css/text-overflow-ellipsis-color.html
Comment 21 Rob Buis 2012-11-19 18:40:47 PST
Created attachment 175110 [details]
Patch
Comment 22 Rob Buis 2012-11-20 06:50:30 PST
(In reply to comment #21)
> Created an attachment (id=175110) [details]
> Patch

It seems like Dirk's intuition was right, i.e. using Ahem, thanks!
Comment 23 Daniel Bates 2012-11-21 14:09:39 PST
I noticed that we also don't support -webkit-text-stroke, -webkit-text-stroke-color, and -webkit-text-stroke-width for an ellipsis.
Comment 24 Rob Buis 2012-11-21 14:14:36 PST
Hi Daniel,

(In reply to comment #23)
> I noticed that we also don't support -webkit-text-stroke, -webkit-text-stroke-color, and -webkit-text-stroke-width for an ellipsis.

Right, but I assume that it is not needed for the ellipsis/dots. I may check against other implementations later...
Comment 25 Daniel Bates 2012-11-21 14:24:24 PST
(In reply to comment #24)
> Hi Daniel,
> 
> (In reply to comment #23)
> > I noticed that we also don't support -webkit-text-stroke, -webkit-text-stroke-color, and -webkit-text-stroke-width for an ellipsis.
> 
> Right, but I assume that it is not needed for the ellipsis/dots.

Can you elaborate on your reasoning on why it's unnecessary to support stroke styles for an ellipsis?

> I may check against other implementations later...

As far as I can tell, -webkit-text-{fill-color,  stroke, stroke-color, width} are proprietary WebKit extensions.
Comment 26 Daniel Bates 2012-11-21 14:25:59 PST
(In reply to comment #25)
> [...]
> As far as I can tell, -webkit-text-{fill-color,  stroke, stroke-color, width} are proprietary WebKit extensions.

s/width/stroke-width
Comment 27 Rob Buis 2012-11-21 14:56:10 PST
(In reply to comment #25)
> (In reply to comment #24)
> > Hi Daniel,
> > 
> > (In reply to comment #23)
> > > I noticed that we also don't support -webkit-text-stroke, -webkit-text-stroke-color, and -webkit-text-stroke-width for an ellipsis.
> > 
> > Right, but I assume that it is not needed for the ellipsis/dots.
> 
> Can you elaborate on your reasoning on why it's unnecessary to support stroke styles for an ellipsis?

This is my personal opinion, based on how I imagine it would look. Like described below I can't turn this on for FF, I tried -moz-text-stroke-color and
-moz-text-stroke-width.

> > I may check against other implementations later...
> 
> As far as I can tell, -webkit-text-{fill-color,  stroke, stroke-color, width} are proprietary WebKit extensions.

Yeah, from experiments there is nothing equivalent in FF, so that does not help.

Given all that, and that I can't see anything about this in the spec, I think it is best to just stick to this patch, and if needed open a bug for the -webkit-text-stroke thing.
Comment 28 Dave Hyatt 2013-02-28 12:31:25 PST
Comment on attachment 175110 [details]
Patch

r=me
Comment 29 Rob Buis 2013-03-02 13:13:32 PST
Committed r144542: <http://trac.webkit.org/changeset/144542>