Issue 78529 in chromium: Text is invisible with text-rendering: optimizelegibility and <video> on the page
chro...@googlecode.com
Owner: ----
Labels: Type-Bug Pri-2 Area-Undefined
New issue 78529 by s...@typekit.com: Text is invisible with text-rendering:
optimizelegibility and <video> on the page
http://code.google.com/p/chromium/issues/detail?id=78529
Chrome Version : 11.0.696.34 and 12.0.726.0 both show the problem
(10.0.648.204 works fine though)
OS : Win 7 (Win XP and Mac OSX work fine, Win Vista not
tested)
URLs (if applicable) : http://seanmcb.com/typekit/chrome-rendering.html
Other browsers tested:
Safari 5: OK
Firefox 4.x: OK
IE 7/8/9: OK
What steps will reproduce the problem?
1. Load the simple test case at
http://seanmcb.com/typekit/chrome-rendering.html
2. Observe that the three test case divs in the markup don't render text at
all
3. Observe that removing the <video> from the DOM causes the test cases to
appear
4. Observe that removing the text-rendering: optimizelegibility; property
with the inspector causes the test cases to appear
It appears that this is a regression since the latest Chrome 10.x loads the
test page without issue (as seen in the screenshot).
What is the expected result?
The text should be rendered exactly the same, regardless of the presence of
both text-rendering and <video>.
What happens instead?
When a <video> element is present on the page, any text with
text-rendering: optimizelegibility is invisible.
Please provide any additional information below. Attach a screenshot if
possible.
It seems as though the presence of <video> +
text-rendering:optimizelegibility is causing Chrome to use a different
rendering pipeline on Win7, for some reason.
Attachments:
chrome-rendering.PNG 506 KB
chro...@googlecode.com
Comment #1 on issue 78529 by chriscoy...@gmail.com: Text is invisible with
http://code.google.com/p/chromium/issues/detail?id=78529
I kinda don't think it's the <video> that's the problem. I bet removing the
video from the DOM causes some kind of redraw which makes them appear. I
don't have a test case, but I had a crapload of reports on
http://css-tricks.com/ from people with Windows + Chrome 11 or 12 saying
they had disappearing text all over the site, and I don't use much <video>,
but I do use optimizelegability. I've removed that, and no reports so far.
chro...@googlecode.com
Comment #2 on issue 78529 by seddon.r...@gmail.com: Text is invisible with
http://code.google.com/p/chromium/issues/detail?id=78529
I've got some interesting findings for this bug:
If I set either a text-stroke or text-shadow the invisible text it will
become visible. e.g.
-webkit-text-stroke: 1.0px rgba(0,0,0,0);
text-shadow: 1px 1px 1px rgba(0,0,0,0);
Or if I change it to a color other than the value it's inheriting e.g.
.test * { color: #ff0000; }
Trying to set it to the same colour it inherits won't work.
Seems any property that causes a redraw on the text will make it show up.
chro...@googlecode.com
Comment #3 on issue 78529 by seddon.r...@gmail.com: Text is invisible with
http://code.google.com/p/chromium/issues/detail?id=78529
Ok found some further quirks, it seems the custom font is treated as though
it has opacity set and setting it to white makes it fully invisible?
Giving it a more contrasting color such as red will make it show up but it
will still have some transparency to it. text-stroke or text-shadow stop
this weird opacity bug from happening?
chro...@googlecode.com
Labels: -Area-Undefined Area-WebKit Feature-Fonts WebKit-Core
Comment #4 on issue 78529 by paulir...@chromium.org: Text is invisible with
text-rendering: optimizelegibility and <video> on the page
http://code.google.com/p/chromium/issues/detail?id=78529
(No comment was entered for this change.)
chro...@googlecode.com
Comment #7 on issue 78529 by puntodif...@gmail.com: Text is invisible with
http://code.google.com/p/chromium/issues/detail?id=78529
I can replicate this every time. Chrome 15.0.865.0 on Win 7 x64, Nvidia
drivers 280.26.
Anything that causes the page to switch to GPU rendering (from <video> to
<canvas>, to translate3d), also causes some text to fade/disappear. The
whiter the text is, the more it fades away. White text disappears
completely, while black text remains intact.
You can find here http://jsfiddle.net/8raya/ a simple test case which shows
the problem with the minimum number of elements involved.
chro...@googlecode.com
Comment #8 on issue 78529 by colin.gr...@gmail.com: Text is invisible with
http://code.google.com/p/chromium/issues/detail?id=78529
You can fix the weird opacity on text by adding text-transform: auto; to
the affected elements, works a treat for me now!
chro...@googlecode.com
Comment #9 on issue 78529 by ChadVSc...@gmail.com: Text is invisible with
http://code.google.com/p/chromium/issues/detail?id=78529
thanks seddon, text-shadow: 1px 1px 1px rgba(0,0,0,0); worked perfectly
chro...@googlecode.com
Comment #10 on issue 78529 by pucchaka...@chromium.org: Text is invisible
http://code.google.com/p/chromium/issues/detail?id=78529
This works fine on 16.0.912.63 beta-m & 18.0.975.0 canary
Please find the attached screen shot.
Attachments:
78529.PNG 428 KB
chro...@googlecode.com
Comment #11 on issue 78529 by sgor...@chromium.org: Text is invisible with
http://code.google.com/p/chromium/issues/detail?id=78529
Works as expected for 16.0.912.75 and canary 18.
chro...@googlecode.com
Status: WontFix
Comment #20 on issue 78529 by mikelawt...@chromium.org: Text is invisible
Thanks for the report.
I can now see all six lines of text on Chrome 44 on Windows 7.
--
You received this message because this project is configured to send all
issue notifications to this address.
You may adjust your notification preferences at:
https://code.google.com/hosting/settings