1723427 - CSS property backface-visibilty doesn’t properly deal with CSS property perspective

Status: RESOLVED FIXED

(Core :: Graphics: WebRender, defect)

Description

[Anselm Schüler]

User Agent: Mozilla/5.0 (X11; Linux x86_64; rv:91.0) Gecko/20100101 Firefox/91.0

Steps to reproduce:

I wrote a document that displays a cube using CSS, which rotates when hovered over, and which uses backface-visibility to hide faces that shouldn’t be visible, and perspective to create a 3D effect.

→ cube.html

Actual results:

The back faces of individual elements was still visible, they merely disappeared once the element would’ve had its back facing the camera had the perspective modifier not been there.

→ firefox-backface-visibility.mkv

Expected results:

The back faces should not appear (or the elements should disappear once their backs face the camera)

→ chromium-backface-visibility.mkv

Comment 1

[Anselm Schüler]

Attachment: cube.html

The HTML file I used

Comment 2

[Anselm Schüler]

Attachment: firefox-backface-visibility.mkv

A video recording of the problem in Firefox

Comment 3

[Anselm Schüler]

Attachment: chromium-backface-visibility.mkv

A recording of the expected behavior in Chromium

Comment 4

[BugBot [:suhaib / :marco/ :calixte]]

The Bugbug bot thinks this bug should belong to the 'Core::WebRTC: Audio/Video' component, and is moving the bug to that component. Please revert this change in case you think the bot is wrong.

Comment 5

[Anselm Schüler]

Attachment: cube.html

The actual HTML I used

Comment 6

[Alice0775 White]

I can reproduce the issue on Windows10.
If disabled WebRender then the problem is gone.

Comment 7

[Alice0775 White]

Regression window:
https://hg.mozilla.org/integration/autoland/pushloghtml?fromchange=251ef3905140484b28314e2dd07b37bc813bab32&tochange=aec4b19308a9b4eb59e2b988840af1d8996825c8

Suspect Bug1525641

Comment 8

[Sotaro Ikeda [:sotaro]]

:kvark, can you comment to the bug?

Comment 9

[rubbel]

I can confirm the issue it started with version 91.x
Up to Version 90 the 3D Transformation with Firefox was correct!

I made a image to show the difference
https://www.gmeiner-verlag.de/images/3D-Problem.png

Example Website:
https://www.gmeiner-verlag.de/buecher/titel/lieblingsplaetze-rhoen.html

Comment 10

[Anselm Schüler]

(also see https://bugzilla.mozilla.org/show_bug.cgi?id=1710764)

Comment 11

[Anselm Schüler]

This bug also occurs on Firefox Nightly on Android (93.0a1 (Build #2015828041))

Comment 12

[Anselm Schüler]

This bug has been fixed for me on NixOS 22.05.20220321.1ec61dd (Quokka).

Comment 13

[BugBot [:suhaib / :marco/ :calixte]]

The bug assignee is inactive on Bugzilla, so the assignee is being reset.

Comment 14

[Mayank Bansal]

This appears to be fixed by
2022-08-10T10:01:57.932000: DEBUG : Found commit message:
Bug 1695318 - Check if the parent node is perspective when considering back faces r=gw

Differential Revision: https://phabricator.services.mozilla.com/D136163

2022-08-10T10:01:57.932000: DEBUG : Did not find a branch, checking all integration branches
2022-08-10T10:01:57.934000: INFO : The bisection is done.
2022-08-10T10:01:57.934000: INFO : Stopped

Comment 15

[Mayank Bansal]

The original issue reported was fixed. However, a new regression has appeared that will be tracked by bug 1783993