1235228 - animation on ::before/::after that is created by 'content' on :hover only runs the first time it is created

Status: RESOLVED FIXED

(Core :: CSS Parsing and Computation, defect)

Description

[cris]

User Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:46.0) Gecko/20100101 Firefox/46.0
Build ID: 20151226030212

Steps to reproduce:

goto www.sunsetclinicdfw.com
hover mice over "about us/services/contact us" menu
move mice away from menu, then hover over the same menu


Actual results:

the animation of tooltip (move upward, fadein) only plays during first mice hover over. It will not play when mice is moved away then moved back.


Expected results:

animation should play each time mice hovers over the menu (both Edge and Chrome display this properly.

note: tested on nightly too, same problem.

Comment 1

[Kelsey Gilbert [:jgilbert]]

I'm not positive this is the right place for this. Let's pass it around.

Comment 2

[Jeff Muizelaar [:jrmuizel]]

Attachment: reduced.html

Here's a reduced test case. It looks like it might have something to do with the lifetime of anonymous content for hover.

Comment 3

[Jeff Muizelaar [:jrmuizel]]

Brian, any thoughts on what's happening here?

Comment 4

[David Baron :dbaron: (⌚️UTC-5, no longer working on Mozilla)]

The spec actually isn't clear about what should happen here.  Perhaps it would make sense if we applied what the spec says about 'display:none' to having 'content:none' for ::before and ::after, but we don't do that.  I think this is likely correct based on what the spec says today, but it may not make sense.  And given the bug report, I'm guessing it doesn't match other browsers, although I didn't test.

Comment 5

[Brian Birtles (:birtles)]

Chrome 48 and Edge 25 run the animation each time. I'm unable to test Safari.

I'm not quite sure what is lacking in the spec or why a transition between content:none and content:'abc', should differ from a transition between content:'abc' and content:'def' (since the animation re-runs if I add '.tooltip:after { content: "abc"; }' to the stylesheet).

Comment 6

[Trevor Rowbotham [:rowbot]]

I've noticed that I can make this work as intended by significantly increasing the animation-duration.  A value of 6s worked fairly well for me most of the time, but it still doesn't work reliably 100% of the time even with the duration increase.

Comment 7

[Trevor Rowbotham [:rowbot]]

This was fixed somewhere in [1]. Unfortunately, mozregression couldn't narrow it down any further. If I had to guess, I would have to say the fix was either Bug 1380258 or Bug 1367278. Marking as fixed.

[1] https://hg.mozilla.org/mozilla-central/pushloghtml?fromchange=b4e656e5a996dd385e9af43a4d9e207553377c51&tochange=131e19a573e901fb4d01b471b11b7916420b9fee

Comment 8

[Brian Birtles (:birtles)]

(In reply to Trevor Rowbotham [:rowbot] from comment #7)

If I had to guess, I would have to say the fix was either Bug 1380258 or Bug 1367278. Marking as fixed.

Almost certainly bug 1367278.