Closed
Bug 1435902
Opened 7 years ago
Closed 7 years ago
Animations of elements that have transform-style: preserve-3d are even more broken in Firefox 58
Categories
(Firefox :: Untriaged, defect)
Tracking
()
RESOLVED
DUPLICATE
of bug 1425213
People
(Reporter: nrajbhan, Unassigned)
Details
Attachments
(2 files)
User Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/64.0.3282.140 Safari/537.36
Steps to reproduce:
CSS translate animations are not working in ads on Firefox 58 when transform-style: preserve-3d is set. This might be related to bug https://bugzilla.mozilla.org/show_bug.cgi?id=1431893 but I think it's more common than the overflow-hidden case because ads are served within iframes which clip the ad content by default. Animations of content that slide into view no longer work in Firefox 58.
Create a file named FirefoxAnimationBug.html with the following text:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<style type="text/css">
div {
position: absolute;
background-color: green;
left: 0px;
top: 50px;
height: 100px;
width: 100px;
transform-style: preserve-3d;
transform: translate3d(-100px, 0px, 0px);
animation: slide-in 1s linear 0s 1 normal forwards;
}
@keyframes slide-in {
0% {
transform: translate3d(-100px, 0px, 0px);
animation-timing-function: linear;
}
100% {
transform: translate3d(200px, 00px, 0px);
animation-timing-function: linear;
}
}
</style>
</head>
<body>A green DIV should slide into view.
<div></div>
</body>
</html>
Create another file named loader.html with the following text:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
</head>
<body>
<iframe src="FirefoxAnimationBug.html" style="border: 1px solid black;" width="300" height="250"></iframe>
</body>
</html>
Open loader.html in Chrome and note that a green DIV animates across the iframe.
Open loader.html in Firefox and note that the green DIV just shows up at the right-side of the iframe without any animation.
Actual results:
Animations of content that slide into view no longer work in Firefox 58.
Expected results:
Animations of content that slide into view should continue working like in previous versions of Firefox. They do work in the release version of all major browsers.
|
||
Comment 1•7 years ago
|
||
I haven't tried the test case in comment 0, but it looks like a dup of bug 1424506?
|
||
Comment 2•7 years ago
|
||
|
|
||
Comment 3•7 years ago
|
||
|
|
||
Comment 4•7 years ago
|
||
It seems to be fixed in beta 59.
@reporter,
Could you test this with beta 59[1]?
[1]
https://www.mozilla.org/en-US/firefox/channel/desktop/
|
|
||
Updated•7 years ago
|
Flags: needinfo?(nrajbhan)
|
|
||
Comment 5•7 years ago
|
||
(In reply to Alice0775 White from comment #4)
> It seems to be fixed in beta 59.
Thank you Alice! Then I think it's a dup of bug 1425213.
|
|
||
Comment 6•7 years ago
|
||
(In reply to Hiroyuki Ikezoe (:hiro) from comment #5)
> (In reply to Alice0775 White from comment #4)
> > It seems to be fixed in beta 59.
>
> Thank you Alice! Then I think it's a dup of bug 1425213.
yep, I confirmed.
Status: UNCONFIRMED → RESOLVED
Closed: 7 years ago
Resolution: --- → DUPLICATE
Thanks! This is indeed fixed in Firefox 59 beta. Unfortunately, the other bug with animations not playing correctly when setting 'overflow: hidden' still happens in Firefox 59 beta - https://bugzilla.mozilla.org/show_bug.cgi?id=1431893. Do you know when that will be fixed? A lot of our customers are running into these issues.
Flags: needinfo?(nrajbhan)
You need to log in
before you can comment on or make changes to this bug.
Description
•