Bug 217103

Summary:

[TextureMapper] A semi-transparent parent layer is rendered as a opaque layer for children layers

Product:

WebKit

Reporter:

Fujii Hironori <Hironori.Fujii>

Component:

Platform

Assignee:

Nobody <webkit-unassigned>

Status:

NEW ---

Severity:

Normal

CC:

webkit-bug-importer

Priority:

Keywords:

InRadar

Version:

WebKit Nightly Build

Hardware:

Unspecified

OS:

Unspecified

Attachments:

Description	Flags
test case	none
[Screenshot] WinCairo before r267711	none
[Screenshot] WinCairo after r267711	none
[Screenshot] attachment#409968 WinCairo before r267711	none
[Screenshot] attachment#409968 WinCairo after r267711	none
test caes of sterically intersecting sibling semi-transparent layers	none
[Screenshot] attachment#410055 WinCairo before r267711	none
[Screenshot] attachment#410055 WinCairo after r267711	none
WIP patch	none
test case using opacity property	none
parent with box-shadow	none

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. ***