Bug 273627 - preserve-3d doesn't work across shadow boundaries
Summary: preserve-3d doesn't work across shadow boundaries
Status: RESOLVED FIXED
Alias: None
Product: WebKit
Classification: Unclassified
Component: Layout and Rendering (show other bugs)
Version: Safari 17
Hardware: Unspecified Unspecified
: P2 Normal
Assignee: Matt Woodrow
URL:
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2024-05-02 09:36 PDT by Dan Schultz
Modified: 2024-05-08 02:19 PDT (History)
7 users (show)

See Also:

Attachments
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 Dan Schultz 2024-05-02 09:36:07 PDT 
When using the `transform-style: preserve-3d` CSS property in a custom element that's using templates and slots, the `preserve-3d` behavior doesn't get applied to slotted children. Both Firefox and Chrome will apply the `transform-style` to the contents of the slot. We've been able to reproduce this issue in Safari Version 16 and 17 on macOS and iOS.

Here's a CodePen that reproduces the issue: https://codepen.io/danschultz/pen/PogrNOW
Comment 1 Radar WebKit Bug Importer 2024-05-02 18:53:34 PDT 
<rdar://problem/127468969>
Comment 2 Matt Woodrow 2024-05-02 18:55:06 PDT 
Pull request: https://github.com/WebKit/WebKit/pull/28077
Comment 3 Matt Woodrow 2024-05-07 14:45:27 PDT 
Submitted web-platform-tests pull request: https://github.com/web-platform-tests/wpt/pull/46154
Comment 4 EWS 2024-05-08 02:19:51 PDT 
Committed 278499@main (adf1f00fb1ff): <https://commits.webkit.org/278499@main>

Reviewed commits have been landed. Closing PR #28077 and removing active labels.