1382742 - stylo: site issue: Broken hover transition on fastaim.de

Status: VERIFIED FIXED

(Core :: CSS Parsing and Computation, defect, P3)

Description

[Darkspirit]

STR: 
1. https://fastaim.de/test/
2. Scroll down to the bottom
3. Hover from the left to the right over these buttons: Youtube, Twitter, Facebook, Steam
4. only with stylo enabled, the text+icon color sometimes remains white or pink. It can be fixed with hovering again the broken button (wait until the transition finished).

Code seems to be okay: https://validator.w3.org/nu/?acceptlanguage=&doc=https%3A%2F%2Ffastaim.de%2Ftest%2F

Off topic: I have read that xhtml (with a strong Content-Security-Policy) could be processed a bit more performant which could be good for mobile devices, can you confirm this?

Comment 1

[Emilio Cobos Álvarez (:emilio)]

This looks like the flickering issue bug 1380133 is fixing...

> Off topic: I have read that xhtml (with a strong Content-Security-Policy) could be processed a bit more performant which could be good for mobile devices, can you confirm this?

(No clue about where this comes from, nor whether it's true)

Comment 2

[Hiroyuki Ikezoe (:hiro)]

Yeah, I only see the flickering issue and confirmed that the patches for bug 1380133 fixed the flicker.
I am going to make this as a duplicate of bug 1380133.

Darkspirit, please feel free to reopen this if there is another problem in the site.
Thank you for testing!

Comment 3

[Hiroyuki Ikezoe (:hiro)]

Doh! I've lost duplicate field during midair collision.

Comment 4

[Darkspirit]

Attachment: 2017-07-20_20-18-10.mp4

Exceptionally I was on Windows now and only had a flickering there.

Just to let you know what's happening in my main profile on Debian (comment 0) I uploaded a small video.

I will retest when bug 1380133 landed.

Comment 5

[Hiroyuki Ikezoe (:hiro)]

It looks like bug 1381431 or bug 1371450 but they have been already fixed..

Comment 6

[Darkspirit]

Attachment: 2017-07-21_01-35-48.mp4

Both videos are:
Nightly 56 x64 20170720100139 @ Debian Testing (Linux 4.11.0-1-amd64, Radeon RX480).

This one is with a fresh profile. I'm a bit desperate what differences could be the cause for different behavings. It's not hw acceleration. I have to dig deeper if bug 1380133 doesn't bring the solution.

Comment 7

[Darkspirit]

Summary:
icon font = fontawesome, http://fontawesome.io/icon/twitter/ for example

The link text (icon font + text) is immediately white if I hover it. With servo disabled, there is a smooth transition from a red text color to a white one.
In my main profile, both "icon font" and "regular text" color remain white sometimes.
In a fresh profile, only the icon font color remains white sometimes.
On Windows, there is some flickering, but not a smooth transition.

Comment 8

[Hiroyuki Ikezoe (:hiro)]

OK, I can confirm the white icon on debug build.

Comment 9

[Jeremy Chen ([e-mail])]

According to Cameron's manual testing, looks like this can be fixed by bug 1380133.

Comment 10

[Darkspirit]

Nightly 56 x64 20170724100304 @ Debian Testing (Linux 4.11.0-1-amd64, Radeon RX480).

bug 1380133 fixed this partially.
This bug still happens with visited links. I hope bug 1383307 will fix this in the next Nightly. (I will re-test.)

Comment 11

[Jeremy Chen ([e-mail])]

If the issue still remains for the visited links, I suspect this might be something related to bug 1381235.

Comment 12

[Jeremy Chen ([e-mail])]

I can confirm that my patch in bug 1381235 can fix the remaining issues in this bug. \o/

Comment 13

[Darkspirit]

This is fixed in the "Linux x64 opt" try build of bug 1381235 comment 14. I tested both unvisited an visited links in a fresh profile with Stylo enabled.
All the bugs are dying :)

Comment 14

[Hiroyuki Ikezoe (:hiro)]

https://hg.mozilla.org/mozilla-central/rev/5894beca0ec2

Comment 15

[Darkspirit]

Verified fixed in Nightly 56 x64 20170729100254 @ Debian Testing.
Thank you!