Bug 217103 - [TextureMapper] A semi-transparent parent layer is rendered as a opaque layer for children layers
Summary: [TextureMapper] A semi-transparent parent layer is rendered as a opaque layer...
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Platform (show other bugs)
Version: WebKit Nightly Build
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Nobody
URL:
Keywords: InRadar
: 244509 (view as bug list)
Depends on:
Blocks:
 
Reported: 2020-09-29 13:40 PDT by Fujii Hironori
Modified: 2022-08-29 13:51 PDT (History)
1 user (show)

See Also:

Attachments
test case (450 bytes, text/html)
2020-09-29 13:41 PDT, Fujii Hironori 		no flags Details
[Screenshot] WinCairo before r267711 (8.50 KB, image/png)
2020-09-29 13:46 PDT, Fujii Hironori 		no flags Details
[Screenshot] WinCairo after r267711 (8.62 KB, image/png)
2020-09-29 13:46 PDT, Fujii Hironori 		no flags Details
[Screenshot] attachment#409968 WinCairo before r267711 (28.79 KB, image/png)
2020-09-29 13:52 PDT, Fujii Hironori 		no flags Details
[Screenshot] attachment#409968 WinCairo after r267711 (24.89 KB, image/png)
2020-09-29 13:52 PDT, Fujii Hironori 		no flags Details
test caes of sterically intersecting sibling semi-transparent layers (730 bytes, text/html)
2020-09-29 14:46 PDT, Fujii Hironori 		no flags Details
[Screenshot] attachment#410055 WinCairo before r267711 (38.78 KB, image/png)
2020-09-29 17:06 PDT, Fujii Hironori 		no flags Details
[Screenshot] attachment#410055 WinCairo after r267711 (34.47 KB, image/png)
2020-09-29 17:06 PDT, Fujii Hironori 		no flags Details
WIP patch (2.85 KB, patch)
2020-09-29 21:01 PDT, Fujii Hironori 		no flags Details | Formatted Diff | Diff
test case using opacity property (733 bytes, text/html)
2020-09-29 21:02 PDT, Fujii Hironori 		no flags Details
parent with box-shadow (767 bytes, text/html)
2022-08-24 17:24 PDT, Fujii Hironori 		no flags Details
View All Add an attachment (proposed patch, testcase, etc.)

Note You need to log in before you can comment on or make changes to this bug.
Description Fujii Hironori 2020-09-29 13:40:45 PDT 
[TextureMapper] A semi-transparent parent layer is rendered as a opaque layer for children layers

Since r267711 (Bug 90078) enabled a depth buffer for preserve-3d,
a semi-transparent parent layer is rendered as a opaque layer.
So, it hides children layers.
Comment 1 Fujii Hironori 2020-09-29 13:41:23 PDT 
Created attachment 410038 [details]
test case
Comment 2 Fujii Hironori 2020-09-29 13:46:31 PDT 
Created attachment 410043 [details]
[Screenshot] WinCairo before r267711
Comment 3 Fujii Hironori 2020-09-29 13:46:46 PDT 
Created attachment 410044 [details]
[Screenshot] WinCairo after r267711
Comment 4 Fujii Hironori 2020-09-29 13:49:56 PDT 
attachment#409968 [details] (Bug 217080 Comment 0) is another test case demonstrating the issue.
Comment 5 Fujii Hironori 2020-09-29 13:52:42 PDT 
Created attachment 410045 [details]
[Screenshot] attachment#409968 [details] WinCairo before r267711
Comment 6 Fujii Hironori 2020-09-29 13:52:59 PDT 
Created attachment 410046 [details]
[Screenshot] attachment#409968 [details] WinCairo after r267711
Comment 7 Fujii Hironori 2020-09-29 14:46:38 PDT 
Created attachment 410055 [details]
test caes of sterically intersecting sibling semi-transparent layers

Because TextureMapperLayer sorts siblings by z order (in TextureMapperLayer::sortByZOrder),
sibling semi-transparent layers are blended as expected in most cases.

However, if sibling semi-transparent layers are sterically intersecting,
some semi-transparent layers can hide background.

To solve this issue perfectly, TextureMapper needs OIT support.
  Bug 217080 – [TextureMapper] Order Independent Transparency support
Comment 8 Fujii Hironori 2020-09-29 17:06:23 PDT 
Created attachment 410069 [details]
[Screenshot] attachment#410055 [details] WinCairo before r267711
Comment 9 Fujii Hironori 2020-09-29 17:06:37 PDT 
Created attachment 410070 [details]
[Screenshot] attachment#410055 [details] WinCairo after r267711
Comment 10 Fujii Hironori 2020-09-29 17:15:38 PDT 
Specifying glDepthMask(GL_FALSE) can stop writing into the depth buffer.
https://www.khronos.org/registry/OpenGL-Refpages/gl2.1/xhtml/glDepthMask.xml
Comment 11 Fujii Hironori 2020-09-29 21:01:47 PDT 
Created attachment 410089 [details]
WIP patch

This patch checks only options.opacity. This patch works only for opacity property, but for rgba().
Comment 12 Fujii Hironori 2020-09-29 21:02:33 PDT 
Created attachment 410090 [details]
test case using opacity property
Comment 13 Radar WebKit Bug Importer 2020-10-06 13:41:19 PDT 
<rdar://problem/70015221>
Comment 14 Fujii Hironori 2022-08-24 17:24:24 PDT 
Created attachment 461850 [details]
parent with box-shadow

This is another example.
https://codepen.io/polypane/pen/ZExZzrp
https://polypane.app/css-3d-transform-examples/
Comment 15 Fujii Hironori 2022-08-29 13:51:29 PDT 
*** Bug 244509 has been marked as a duplicate of this bug. ***