Bug 68659 - -webkit-box-reflect not rendering in -webkit-keyframes > -webkit-animation
Summary: -webkit-box-reflect not rendering in -webkit-keyframes > -webkit-animation
Status: NEW
Alias: None
Product: WebKit
Classification: Unclassified
Component: Animations (show other bugs)
Version: 528+ (Nightly build)
Hardware: All All
: P2 Normal
Assignee: Nobody
URL: http://jsbin.com/itukeq/7
Keywords: InRadar
Depends on:
Blocks:
 
Reported: 2011-09-22 15:07 PDT by Andrew Henderson
Modified: 2022-09-12 10:45 PDT (History)
9 users (show)

See Also:


Attachments

Note You need to log in before you can comment on or make changes to this bug.
Description Andrew Henderson 2011-09-22 15:07:41 PDT
I can apply the following style rule to a class and it renders:

-webkit-box-reflect: below 0px -webkit-gradient(linear, 0% 0%, 0% 100%, from(transparent), color-stop(0.55, transparent), to(white)) 0 0 0 0 stretch stretch;}}

 but when I move that same rule within a -webkit-keyframes as part of -webkit-animation, it no longer renders.  See style rules in the URL doc head: http://jsbin.com/itukeq/7
Comment 1 Andrew Henderson 2011-09-22 15:31:46 PDT
To see a version in which the object renders with a box reflection, see: http://jsbin.com/itukeq/8 which sets the rule on the object outside of the keyframe and animation rules.
Comment 2 Ahmad Saleem 2022-09-10 15:24:33 PDT
By using the test case from URL field - http://output.jsbin.com/itukeq/7, I am able to reproduce this in Safari Technology Preview 153 and it does not show "reflection" below the A and B pills while Chrome Canary 107 does. Firefox Nightly will ignore because of -webkit- prefixes so I am not posting result about it and comparing with Chrome only.

I am going to change it to "New" and will tag others to confirm the issue and change the Component to "Animation" as well. Thanks!
Comment 3 Radar WebKit Bug Importer 2022-09-12 10:45:30 PDT
<rdar://problem/99828709>