Issue metadata
Sign in to add a comment
|
Anchor Tag Behavior Does Not Work When Styled with a CSS Clip-Path property referencing an SVG clipPath definition
Reported by
ek...@nerdery.com,
Aug 21
|
||||||||||||||||||||
Issue descriptionUserAgent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_13_3) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/68.0.3440.106 Safari/537.36 Steps to reproduce the problem: 1. Create an HTML page with an anchor which points to another website 2. Add an SVG clip-path definition to an HTML page 3. Add a CSS selector for the anchor tag which applies the clip-path 4. Observe that the anchor tag does not trigger the hover state, or respond to mouse clicks, when the clip path is applied. 5. NOTE: this behaves correctly when using a CSS shape function (like polygon) instead of an SVG Clip Path What is the expected behavior? Anchor tags hover and click appropriately What went wrong? See the example here: https://codepen.io/anon/pen/GXgrBm Did this work before? Yes Unknown - didn't check before I upgraded Does this work in other browsers? Yes Chrome version: 68.0.3440.106 Channel: stable OS Version: OS X 10.13.3 Flash Version: Also does not work in Canary
,
Aug 22
Bisected to 081e02da202cd7394d4fdc2b47f0a6b4fb1957b7
,
Aug 23
I've been staring a bit at this today, and I think I've come to the conclusion that the change above exposed a mismatch in what the local coordinate space is (i.e where the 'transform' is applied) during paint and hit-test. Trying to figure out in which order 'transform' and the object-bounding-box transform should apply, I believe I landed at that we have it backwards (based on [1].) Doing it in that order has the nice benefit of making the transformations work out "by accident"... (applying in that order should make little visible difference in example at hand, and at also appears to be what Gecko does - although they seem to exhibit some weird behavior in some cases.) I'd welcome an additional interpretation of [1], but it's consistent with <*Gradient> and <pattern>. [1] https://drafts.csswg.org/css-transforms/#svg-user-coordinate-space
,
Aug 23
If you're saying that the object-bounding-box transform should apply on top of the gradient/pattern/transform then I would agree. It's always confusing to talk about this, so another way of saying it is that the gradient/pattern/transform is "closer" to the element than the object bounding box transform.
,
Aug 23
If M_transform is the "additional" transform and M_bbox is the bbox transform, then we'd do: M = M_bbox * M_transform [1] (which is what we do for gradients), but currently the order is the other way around (for clipPath.) [1] Or in AffineTransform parlance I think it'd be: AffineTransform t = OBBTransform(); t.Multiply(AdditionalTransform());
,
Aug 24
The following revision refers to this bug: https://chromium.googlesource.com/chromium/src.git/+/2a25370e4ddbaa7a291dc09dbda2241d7dc51ce6 commit 2a25370e4ddbaa7a291dc09dbda2241d7dc51ce6 Author: Fredrik Söderquist <fs@opera.com> Date: Fri Aug 24 22:42:48 2018 Align HitTestClippedOutByClipPath coordinate space with paint In the paint code (ClipPathClipper), the reference box used is the one computed by LocalReferenceBox(), and the coordinate space is adjusted for that. In the hit-testing code however, the reference box is adjusted instead, leading to incorrect results when the reference box is subjected to an additional transform (a 'transform' on a <clipPath>.) Instead, set up the reference box and coordinate space in the hit- testing code in the same way as for paint, by translating to the correct local coordinate space before performing the actual hit-test. Bug: 876390 Cq-Include-Trybots: luci.chromium.try:linux_layout_tests_slimming_paint_v2;master.tryserver.blink:linux_trusty_blink_rel Change-Id: I60acd616964a942893f0e256766aca728d14b494 Reviewed-on: https://chromium-review.googlesource.com/1188302 Reviewed-by: Stephen Chenney <schenney@chromium.org> Commit-Queue: Fredrik Söderquist <fs@opera.com> Cr-Commit-Position: refs/heads/master@{#586028} [add] https://crrev.com/2a25370e4ddbaa7a291dc09dbda2241d7dc51ce6/third_party/WebKit/LayoutTests/css3/masking/clip-path-hittest-reference-obb-w-transform.html [modify] https://crrev.com/2a25370e4ddbaa7a291dc09dbda2241d7dc51ce6/third_party/blink/renderer/core/paint/paint_layer.cc
,
Aug 27
|
|||||||||||||||||||||
►
Sign in to add a comment |
|||||||||||||||||||||
Comment 1 by dtapu...@chromium.org
, Aug 22