#12511 closed bug (fixed)
Text Becomes Invisible in Div With Opacity Set <1
| Reported by: | achmafooma | Owned by: | jua |
|---|---|---|---|
| Priority: | normal | Milestone: | R1 |
| Component: | Applications/WebPositive | Version: | R1/Development |
| Keywords: | opacity div text color | Cc: | |
| Blocked By: | Blocking: | #12545 | |
| Has a Patch: | no | Platform: | All |
Description
In current WebPositive (in Haiku nightly), text in semi-transparent divs (opacity set below 1) can become invisible.
An example HTML file is attached. It includes two identical blocks, but with the first set to 0.95 opacity.
Text in the second block is visible (as it should be). Text in the first block SHOULD be visible (#000 on #FFF background with the whole block at 0.95 opacity), but it is not.
Attachments (5)
Change History (19)
Changed 4 years ago by
comment:1 Changed 4 years ago by
| Owner: | changed from pulkomandy to jua |
|---|---|
| Status: | new → assigned |
comment:3 Changed 4 years ago by
| Milestone: | R1/beta1 → R1 |
|---|
comment:4 Changed 3 years ago by
| Blocking: | 12493 added |
|---|
comment:5 Changed 3 years ago by
| Blocking: | 12493 removed |
|---|
What happens here:
The opacity triggers the creation of a layer for drawing in WebKit. However, we apparently don't support drawing a string "with offsets" as it is done by WebKit (AS_DRAW_STRING_WITH_OFFSETS). My guess is because support for that is still missing in BPicture.
A normal DrawString works as expected, but it doesn't exactly match glyph metrics from webkit, so the text is not exactly at the right place, which creates some other (more subtle) rendering problems. This is why the "with offset" version was added in the first place.
comment:6 Changed 3 years ago by
| Blocking: | 12545 added |
|---|
comment:7 Changed 2 years ago by
I'm seeing this on this website: https://hudsonsbay.capitalone.com/#/sign-in?locale=en_CA screenshot1.png attached
Changed 2 years ago by
| Attachment: | Bay_login.png added |
|---|
comment:8 Changed 2 years ago by
Here's another URL with the same or similar problem: https://drive.google.com/file/d/0B8n9qMefrOQJVXFobGRFOTR4RzA/view (screenshot1.png)
The download button is invisible until the mouse is hovered over it (top right) (screenshot2.png)
Changed 2 years ago by
| Attachment: | screenshot1.png added |
|---|
Changed 2 years ago by
| Attachment: | screenshot2.png added |
|---|
comment:9 Changed 2 years ago by
hrev51259 x86_gcc2h HaikuWebKit 1.6.0 Problem remains as before on this URL: https://hudsonsbay.capitalone.com/#/sign-in?locale=en_CA
Changed 8 months ago by
| Attachment: | screenshot3.png added |
|---|
comment:10 Changed 8 months ago by
Tested with latest webkit 607.1.5. Screenshot 3.png shows the text on the Just Energy Log-in is almost invisible.
comment:11 Changed 6 months ago by
This issue is unchanged using current WebKit build
HaikuWebKit 1.6.7
WebKit 607.1.17
comment:12 Changed 6 months ago by
This patch should solve the issue: https://review.haiku-os.org/c/haiku/+/544
comment:13 Changed 5 months ago by
| Resolution: | → fixed |
|---|---|
| Status: | assigned → closed |
Attached test file now renders properly, so it seems this was indeed fixed by that patch.
comment:14 Changed 5 months ago by
The problem persists on this URL: https://my.justenergy.com/
See comment: 10 above and attched screenshot for comparison. It's worse now on that page.
example HTML exhibiting this bug