Dialog jank during signin animation on Chrome only

[jaredhirsch]

When the chevron ( div.arrow or div.arrowContainer ) animates rightward after a successful login, you can see a flashing dark vertical line move across the dialog, too.

I can't repro on Safari or FF, but it's bad on Chrome/Mac. I'm not having luck getting a screen capture of the animation in progress.

[edwindotcom]

i'm see a hard line at all times on FF beta with Retina

[vladikoff]

http://screencast.com/t/QBjoWJ64Tam uploaded a video demo, you can see the line show up right in the end

[mattbasta]

+1 on this. I see this on every browser that I use. Seems like a rounding error; increasing the value by half a pixel should probably fix it.

[jaredhirsch]

@mattbasta This animation is based on CSS transitions, I think we've got a funky webkit bug here.

Not sure what you mean about a rounding error--this vertical line isn't visible (for me) except during the slide animation. Care to elaborate?

[jaredhirsch]

@mattbasta actually, I think I get what you were saying. If I reposition the arrow 1 px to the left, I can't repro the line. Probably a subpixel rendering error because there's no overlap between the elements--I guess this is what you were talking about. Thanks for the hint 🍻

[mattbasta]

If I reposition the arrow 1 px to the left, I can't repro the line.

Yep, that's it. Thanks for this, I tried digging for the CSS and fixing it myself but mucking with production stylesheets made me lose interest :)

[bnolan]

Im still getting this in safari.

[shane-tomlinson]

This is still seen, re-opening.