RESOLVED WORKSFORME105843
CSS transitions weird rendering bugs 
https://bugs.webkit.org/show_bug.cgi?id=105843
Summary CSS transitions weird rendering bugs
Michał Gołębiowski-Owczarek
Reported 2012-12-28 18:46:31 PST
Created attachment 180908 [details] A video showing two issues - left-over lines and flickering of the non-transitioned element Look at provided jsFiddle and hover the left element a few times. You'll see left-over lines being left as the element transitions its top position. I couldn't really reduce it much further - a lot of things are important - the ".bookmark" element having opacity transitioned, width, height & left being non-integer, hidden overflow etc. I don't know why but this jsFiddle doesn't show the second issue I have if I open the local site with provided code - the right element flickers when you hover the left one (see attached video). I can reproduce it in both Webkit Nightly and Chrome Canary. Chrome stable & Safari 6.0.2 doesn't exhibit the issue, the code works correctly in Firefox & Opera, too.
Attachments
A video showing two issues - left-over lines and flickering of the non-transitioned element (51.55 KB, video/quicktime)
2012-12-28 18:46 PST, Michał Gołębiowski-Owczarek 		no flags
Details
A video showing the issue on the original site (note flickering and the star moving from left to right) (1.99 MB, video/quicktime)
2012-12-28 18:58 PST, Michał Gołębiowski-Owczarek 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Michał Gołębiowski-Owczarek
Comment 1 2012-12-28 18:58:30 PST
Created attachment 180909 [details] A video showing the issue on the original site (note flickering and the star moving from left to right) The flickering issue (but not the left-over lines) are much more visible on the site I first encountered the problem; I've just reduced the code significantly to help in debugging. I'm attaching screencast of part of the original site during CSS transitions. You might see that not only elements flicker but the star icon moves slightly to the right when transitioned from opacity 0 to 1 and it should stay put.
Michał Gołębiowski-Owczarek
Comment 2 2013-01-16 15:21:31 PST
The bug has spread to Chrome stable now. :( Can anyone at least confirm it? I provided the test case and a quite detailed description and still no one responds.
Simon Fraser (smfr)
Comment 3 2013-01-16 15:25:25 PST
Looks like a subpixel issue, esp. since you have elements with fractional sizes.
Michał Gołębiowski-Owczarek
Comment 4 2013-01-16 15:26:31 PST
Seems like it. You agree it's a WebKit bug, though?
Simon Fraser (smfr)
Comment 5 2013-01-16 15:42:19 PST
Certainly.
Michał Gołębiowski-Owczarek
Comment 6 2013-02-17 13:22:45 PST
Can't reproduce it anymore, has sth related to this bug changed?
Dean Jackson
Comment 7 2013-02-17 21:03:16 PST
Still reproduces for me.
Radar WebKit Bug Importer
Comment 8 2013-02-17 21:03:45 PST
<rdar://problem/13233135>
Simon Fraser (smfr)
Comment 9 2013-02-18 11:11:14 PST
I can't reproduce this in recent builds on 1x or 2x displays.
Dean Jackson
Comment 10 2013-02-18 11:14:14 PST
Not sure what build I was looking at, but it's working ok now.
Note You need to log in before you can comment on or make changes to this bug.