Closed Bug 1517388 Opened 6 years ago Closed 5 years ago

Can't click on links on blog.openai.com (animation and preserve-3d related)

Categories

(Core :: Web Painting, defect, P2)

Product:
Core
Component:
Web Painting
Version:
66 Branch
Type:
defect

Tracking

()

Status:
RESOLVED INVALID
Project Flags:
Webcompat Priority ?
Tracking Flags:
Tracking Status
firefox65 --- wontfix
firefox66 --- wontfix
firefox67 --- fix-optional
firefox68 --- fix-optional
firefox69 --- fix-optional

People

(Reporter: karlcow, Assigned: mikokm)

References

(
URL
)

Details

(Keywords: regression, Whiteboard: [webcompat])

Attachments

(1 file, 1 obsolete file)

hit-test-3d.html
(deleted), text/html
Details
This is a spin-off of https://webcompat.com/issues/21171 It seems to be a regression from Bug 1035774 https://hg.mozilla.org/integration/mozilla-inbound/pushloghtml?fromchange=6096baf109f977a5d2e64dc6c8216df6ad13863d&tochange=ff2c8e49bfb4d2344ad5b1333f2cce46f8f47701 Steps to reproduce When attempting to click on any of the article cards, the mouse very briefly will show the clickable state, and then as the animation takes place it is no longer clickable to redirect to the post. In most cards, it seems there is a very small spot where it is possible to click to redirect, but in other browsers it is possible to click anywhere on the cards to redirect to the respective post.
Flags: webcompat?
It seems to me that this is a Chrome bug. The site queries the hover media feature by matchMedia("(hover)"). On Chrome the result value is false but I believe it's wrong. Filed https://bugs.chromium.org/p/chromium/issues/detail?id=918758
Status: NEW → RESOLVED
Closed: 6 years ago
Resolution: --- → INVALID
Reopening since I was using RDM on Chrome which means that the result of matchMedia("(hover)") is correct. I will check the site on a real Android device.
Status: RESOLVED → REOPENED
Flags: needinfo?(hikezoe)
Resolution: INVALID → ---
This seems to be somewhat related to preserve-3d style. If I remove transform-style:preserve-3d for '.Shared-Card', the site works fine.
Attached file A reduced test case (obsolete) (deleted) —
The reduced test case no longer uses the hover media query.
No longer depends on: 1035774
Flags: needinfo?(hikezoe)

Being unable to click through to any blog posts on a real website seems pretty bad. Marking P2.

Priority: -- → P2
Summary: Clickable state disappears after animations effects → Can't click on links on blog.openai.com (animation and preserve-3d related)

Can someone try to find a regression range for the reduced test-case? I did a few preserve-3d changes lately. I have no time right now but can take a look in a bit when I'm back at my computer if nobody is faster.

Flags: needinfo?(emilio)
Keywords: regressionwindow-wanted

Regression window using attachment 9034360 [details]:
https://hg.mozilla.org/integration/mozilla-inbound/pushloghtml?fromchange=6c49bb716593014c07d3736ea2124f74bfe3bb06&tochange=691f2e687e46d1b166b88b0a3f9dbd480bff9afa

Regressed by: f950b7a04741 Thinker K.F. Li — Bug 1226904 - Fix boundary checking for leaves collecting. r=roc

Thanks Alice!

Blocks: 1226904
Flags: needinfo?(emilio)
Has Regression Range: --- → yes
Keywords: regressionwindow-wanted → regression
Whiteboard: [webcompat] → [webcompat][layout:triage-discuss]

Changing to "Web Painting" based on comment 8 (hit testing uses the same display list code as painting).

Miko, maybe you could take a look or know who could?

Component: Layout → Web Painting
Flags: needinfo?(mikokm)
Whiteboard: [webcompat][layout:triage-discuss] → [webcompat]

(In reply to Daniel Holbert [:dholbert] from comment #10)

Changing to "Web Painting" based on comment 8 (hit testing uses the same display list code as painting).

Miko, maybe you could take a look or know who could?

I can take a look when I have more time to work on this.

Flags: needinfo?(mikokm)
Flags: needinfo?(mikokm)

Migrating Webcompat whiteboard priorities to project flags. See bug 1547409.

Webcompat Priority: --- → ?

See bug 1547409. Migrating whiteboard priority tags to program flags.

I finally got to investigate this bug, and it seems that we are doing the right thing with hit testing.

When hovering over the white area of the testcase, there are two divs that are under the cursor: a preserve-3d parent with perspective, and a transformed child. The parent has z coordinate of 0. When the child is transformed in 3D, it can cross z=0 and intersect with its parent. This means that the parent element will be on top of the child element, where the points on child plane have z < 0.

I have further simplified the testcase to make the behavior more apparent.

Flags: needinfo?(mikokm)
Attached file hit-test-3d.html (deleted) —
Attachment #9034360 - Attachment is obsolete: true

I have filed a spec issue at https://github.com/w3c/csswg-drafts/issues/3997.

Assignee: nobody → mikokm
Status: REOPENED → RESOLVED
Closed: 6 years ago → 5 years ago
Resolution: --- → WONTFIX
Resolution: WONTFIX → INVALID
You need to log in before you can comment on or make changes to this bug.

Attachment

General

Creator:
Created:
Updated:
Size: