Issue 93640 in chromium: Chrome 14 Rendering text-shadow incorrectly IMPORTANT! - a blurred mess and in the wrong color, in 13 it works fine
chro...@googlecode.com
Owner: ----
Labels: Type-Bug Pri-2 Area-Undefined
New issue 93640 by svas...@gmail.com: Chrome 14 Rendering text-shadow
incorrectly IMPORTANT! - a blurred mess and in the wrong color, in 13 it
works fine
http://code.google.com/p/chromium/issues/detail?id=93640
Chrome Version : 14.0.835.94 beta-m
URLs (if applicable) :
Other browsers tested: Chrome 13 (displays fine)
issue:
Safari 5: Works
Firefox 4.x: Works
IE 7/8/9: Works
What steps will reproduce the problem?
1. color:#fff;text-shadow: black 1px 1px 0px, black 1px 1px 5px, black 1px
1px 5px;
What is the expected result?
Display the white text clearly with the appropriate black text shadow.
What happens instead?
A blurred mess. Plus it's displaying the black text-shadow as white. Run
the same page in chrome 13 or firefox and it displays fine.
Please provide any additional information below. Attach a screenshot if
possible.
Screens attached.
Attachments:
Chrome-14-Bug.jpg 26.9 KB
chro...@googlecode.com
Labels: -Type-Bug -Area-Undefined Type-Regression Area-WebKit
Feature-Fonts WebKit-Fonts
Comment #1 on issue 93640 by mkte...@gmail.com: Chrome 14 Rendering
text-shadow incorrectly IMPORTANT! - a blurred mess and in the wrong color,
in 13 it works fine
http://code.google.com/p/chromium/issues/detail?id=93640
I think I saw this earlier today/yesterday, but don't remember the exact
site.
chro...@googlecode.com
Comment #2 on issue 93640 by svas...@gmail.com: Chrome 14 Rendering
in 13 it works fine
http://code.google.com/p/chromium/issues/detail?id=93640
I also tested this in the latest Chrome 15 dev build 15 minutes ago and the
bug is still there.
chro...@googlecode.com
Cc: ba...@chromium.org
Comment #4 on issue 93640 by yu...@chromium.org: Chrome 14 Rendering
text-shadow incorrectly IMPORTANT! - a blurred mess and in the wrong color,
in 13 it works fine
http://code.google.com/p/chromium/issues/detail?id=93640
(No comment was entered for this change.)
chro...@googlecode.com
Comment #5 on issue 93640 by yu...@chromium.org: Chrome 14 Rendering
in 13 it works fine
http://code.google.com/p/chromium/issues/detail?id=93640
1. Can you upload a sample HTML file that exhibits the issue?
2. On which platform are you seeing this issue? Which version of Windows?
I've created an HTML file myself using the style specified but I haven't
see the issue with:
- 15.0.867.0 canary on Windows Vista 64 SP1
- 15.0.865.0 on Mac OS X 10.5.8
- 14.0.835.126 beta on Linux
- 15.0.872.0 (Developer Build 99622 Linux) on Linux
chro...@googlecode.com
Comment #6 on issue 93640 by svas...@gmail.com: Chrome 14 Rendering
in 13 it works fine
http://code.google.com/p/chromium/issues/detail?id=93640
I am using Windows 7 64 bit and build 15.0.865.1000 of chrome. The problem
I have identified after investigating further is not just when you apply
the style, but ***when you position text with the shadow ON TOP OF A
CANVAS**.
Copy and paste the basic quick code I threw together below to replicate the
problem. But Yes, the problem is absolutely there. And to add to the
issue ... while I am talking about blurring issues above the canvas now in
Chrome since 14, I have css hover over events on some elements in div's
above the canvas that is in the background - many of the elements when
hovered over above the canvas become blurred on the hover over then return
to normal when the mouse leaves the hover over element.
But talking about this bug, you will see in the sample code the
text 'Location' is blurred above the canvas element.
Here is how you reproduce it:
<html>
<head>
<script>
var bg = new Image();
bg.onload = function() {
var canvas = document.getElementById('Background');
if (canvas != null)
{
var width = window.innerWidth;
var height = window.innerHeight;
var g = canvas.getContext('2d');
if (canvas.width != window.innerWidth)
{
canvas.width = window.innerWidth;
}
if (canvas.height != window.innerHeight)
{
canvas.height = window.innerHeight;
}
g.drawImage(bg, 0, 0, width, height);
}
};
bg.src
= 'http://images.google.com/intl/en_ALL/images/logos/images_logo_lg.gif';
</script>
</head>
<body style="background:blue">
<canvas id="Background"
style="background:red;position:absolute;top:0;left:0;width:100%;height:100%"></canvas>
<div style="color:#fff;text-shadow: black 1px 1px 0px, black 1px 1px 5px,
black 1px 1px 5px;-webkit-transform: rotate(-90deg);position: absolute;top:
100px;left: 100px;font-family: Helvetica;font-size: 11px;letter-spacing:
1px;">Location</div>
</body>
</html>
chro...@googlecode.com
Owner: kar...@google.com
Cc: yu...@chromium.org
Labels: OS-Windows Area-UI Feature-GPU-Canvas2D
Comment #7 on issue 93640 by yu...@chromium.org: Chrome 14 Rendering
text-shadow incorrectly IMPORTANT! - a blurred mess and in the wrong color,
in 13 it works fine
http://code.google.com/p/chromium/issues/detail?id=93640
Thank you very much for the example.
This seems more like a Canvas and/or Skia issue.
Karen, can you triage this to someone in that area?
I can reproduce it with Chrome 15.0.871.1 canary on Windows Vista 64.
I don't see the issue with Safari (7534.50) on Windows Vista 64.
I don't see the issue with Chrome on Mac or Linux.
chro...@googlecode.com
Comment #8 on issue 93640 by svas...@gmail.com: Chrome 14 Rendering
in 13 it works fine
http://code.google.com/p/chromium/issues/detail?id=93640
It would be great if someone could look at this... We want to be confident
we can release a certain feature in our website and our users won't have a
problem with it.
chro...@googlecode.com
Comment #10 on issue 93640 by mikelawt...@chromium.org: Chrome 14 Rendering
in 13 it works fine
http://code.google.com/p/chromium/issues/detail?id=93640
Adding -webkit-transform: translateZ(0) forces the HW accelerated
compositor on.
Can you try running with "--disable-accelerated-compositing"
and/or "--disable-accelerated-layers" see if the problem goes away?
(http://peter.sh/experiments/chromium-command-line-switches/ is a great
resource for cmdline flags you can experiment with).
chro...@googlecode.com
Comment #11 on issue 93640 by svas...@gmail.com: Chrome 14 Rendering
in 13 it works fine
http://code.google.com/p/chromium/issues/detail?id=93640
"--disable-accelerated-compositing" works.
"--disable-accelerated-layers" does not.
With the "--disable-accelerated-compositing" flag used everything becomes
clear but the performance is sluggish.
I have tested Chrome 16.0.891.0 and can still verify the bug is present.
chro...@googlecode.com
Comment #13 on issue 93640 by maz...@me.com: Chrome 14 Rendering
in 13 it works fine
http://code.google.com/p/chromium/issues/detail?id=93640
Anything new on this case?
chro...@googlecode.com
Comment #14 on issue 93640 by svas...@gmail.com: Chrome 14 Rendering
in 13 it works fine
http://code.google.com/p/chromium/issues/detail?id=93640
I have been downloading the latest dev versions of Chrome 16 and the bug is
still present. Safari and other browsers and still rendering correctly.
I think nobody is looking at the bug because it says Chrome 14 in the title
instead of Chrome 16, so they must think it's fixed which it's not.
I would like to change the title if possible so more developers look at it.