Anchor background and text color appear randomly on page load

• Component: CSS
• Status: RESOLVED CONFIGURATION CHANGED

[Kevin Muncie]

Created attachment 250458 [details]
Screenshot of color bug

Hesitant to submit this bug as I have found it hard to diagnose over the months and have not found a way to create a simple test case for it.

Platform:
AT&T iPhone 6
Model MG4W2LL/A
Software Version 8.3 (12F70)

Overview: 

When using the Safari web browser and viewing the page http://tv.jw.org the first "Play" button that is within the image slider will sometimes appear with random background and text colors.

Steps to Reproduce:

1) View http://tv.jw.org from iOS 8 devices using the Safari browser

2) Notice first "Play" button is incorrectly colored.

3) Refresh page. Button color will appear differently colored and various page loads.

4) Cause repaint by letting slider slide or opening the navigation panel. The button will quickly change to the correct colors. 

Actual Results:

Button background and text color are incorrect

Expected Results:

The button should have a background-color: #4a6da7 and text color: #4a6da7

Build Date & Platform:

Seen since launch of website in October 2014 on a variety of iOS 8 devices using the Safari browser

Additional Builds and Platforms: 

Some other developers have seen it in past releases of Google Chrome, but we can not currently replicate it in the latest release.

Notes:

I have verified this behavior on other iPhones and iPads running iOS 8.X.X; however I have also seen devices that do not display the bug as described above.
 
Any action that causes a repaint will immediately fix the coloring. Examples include the slider image moving, opening the navigation panel, inspecting the element, ect.

The bug is not present when viewing the same page in a third party browser like Chrome for iOS.

[Kevin Muncie]

Created attachment 250459 [details]
Button color bug after refresh

[Benjamin Poulain]

Awesome, thanks for filling this bug report.

Next I'll get a bunch of devices and try to reproduce.
Since you have an iPhone 6, I'll start with 64bits devices as this may be specific to some CPUs.

[Benjamin Poulain]

(In reply to comment #2)
> Awesome, thanks for filling this bug report.
> 
> Next I'll get a bunch of devices and try to reproduce.
> Since you have an iPhone 6, I'll start with 64bits devices as this may be
> specific to some CPUs.

I have been reloading that page a few hundred times :)

On iPhone 6+, I have not managed to get the bug.

On iPhone 6, I get it from time to time. I also get an other variation where the button is darker.

Disabling all JITs does not seem to have any effect. I wonder if this could have anything to do with accelerated drawing on the GPU.

Simon, is there a way to disable GPU rendering to try this?

[Kevin Muncie]

Not sure if this is helpful in tracking down the root cause but I saw this bug happening last night on my Ubuntu 14.04 laptop running Chrome.

[Benjamin Poulain]

(In reply to comment #4)
> Not sure if this is helpful in tracking down the root cause but I saw this
> bug happening last night on my Ubuntu 14.04 laptop running Chrome.

Ok, that is really really odd. Chrome has our two years old codebase for style, it is quite different from what we use now.

That definitely rule out problems with the GPU accelerator. It is either the website or the style engine doing something weird.

[Brent Fulgham]

It's difficult to confirm this bug without a test case. We don't believe there is an ongoing issue here. If you do feel there is a problem, please REOPEN this bug and include a test case illustrating the issue.