Overflow:auto causes redraw issues when scrolling

[Bill Brown]

Binary package hint: firefox-3.0

When a box has overflow:auto specified in the CSS rules, Firefox redraws the overflow box slower than other parts of the page, leaving behind momentary fragments which are replaced quite quickly but result in a sort of jumping effect.

It can be tested by visiting http://cyber-sandbox.com and scrolling down. The tabbed panels on that page will jump at the top and bottom borders during scrolling. It's more pronounced with one of the HUD tabs open as well.

To verify that this was indeed related to Gecko and not my video card (Nvidia GeForce 8600 GT) and that I had the most recent drivers (177.76) installed for my OS (Ubuntu Intrepid Ibex), I also installed the Epiphany browser, which has the same effect when using the Gecko mode, but not when using the Webkit mode.

Compiz is installed and running, but was running for the Webkit test as well. Same effect in Metacity.
Smooth scrolling enabled/disabled has no effect.
Using Gnome, not KDE (untested).

I wrote this bookmarklet to disable overflow:auto and it seems to eliminate the jumping:
javascript:(function(){var alltags,i;alltags=document.getElementsByTagName('body')[0].getElementsByTagName('*');i=alltags.length;while(i--)alltags[i].style.overflow='hidden'})();

ProblemType: Bug
Architecture: amd64
DistroRelease: Ubuntu 8.10
NonfreeKernelModules: ath_hal nvidia
Package: firefox-3.0 3.0.3+nobinonly-0ubuntu2
ProcEnviron:
 PATH=/usr/local/sbin:/usr/local/bin:/usr/sbin:/usr/bin:/sbin:/bin:/usr/games
 LANG=en_US.UTF-8
 SHELL=/bin/bash
SourcePackage: firefox-3.0
Uname: Linux 2.6.27-7-generic x86_64

[Bill Brown (macnimble)]

Forgot to mention...

Running /usr/bin/firefox -safe-mode and disabling extensions had no impact on this bug.

[Alexander Sack (asac)]

could you please test the free "nv" driver instead of the proprietary nvidia driver please.

[Bill Brown (macnimble)]

Completely removed driver 173, tested with only 177 installed and active:
 - No noticeable change.
Disabled 177 and switched to NV driver:
 - Effect (seemingly) _diminished_, but perhaps only very slightly, or maybe I've just been staring at it too long.
Completely removed all traces of Nvidia and switched to NV driver:
 - Again, somewhat lessened, but still pronounced enough to be noticeable even when not scrutinizing it.
For kicks, I also tried the Vesa driver:
 - No improvement.

Not using Nvidia drivers means I can't use Compiz, so I've reinstalled the latest driver in Synaptic (177) and reactivated Compiz for now. Firefox is my browser of choice because it's just all-around awesome. This tiny flaw is not enough to force me away from either Mozilla (I use Thunderbird as well) or Ubuntu, but testing other browsers and applications seemed to indicate (from my POV at least) that it's Gecko-related. That's the only reason I'm reporting it. It's an annoying but non-critical issue for me.

I'll try to get around to doing some screen vids later today and see if the problem can be captured on video.
Thanks for the quick reply.

[Bill Brown (macnimble)]

Here's a video of the issue using the NV driver. I'll post the Nvidia driver in the next message.

[Bill Brown (macnimble)]

Same problem, this time with the Nvidia display driver.

[Alexander Sack (asac)]

ok, could you please test the latest 3.1 preview packages from https://edge.launchpad.net/~fta/+archive PPA? you should be able to use those in parallel. just remember that once you started 3.1 once, your profiles for 3.0 and 3.1 wont be identical (to preserve your 3.0 profile from dataloss). But for testing its definitly fine.

[Bill Brown (macnimble)]

Problem persists in 3.1b2pre (Shiretoko) using Nvidia driver and Compiz.
I'll try uninstalling the Nvidia driver and using the NV driver later tonight or tomorrow.
Thanks again for another quick reply -- seems your weekends are as action packed as mine.

[Alexander Sack (asac)]

if the issue persists with NV driver please file your bug in bugzilla.mozilla.org against the Core -> Layout component and tell that you tested latest trunk as well.

[Alexander Sack (asac)]

give us your bug id too.

[Bill Brown (macnimble)]

User-Agent: Mozilla/5.0 (X11; U; Linux x86_64; en-US; rv:1.9.0.4) Gecko/2008110400 Ubuntu/8.10 (intrepid) Firefox/3.0.4
Build Identifier: Mozilla/5.0 (X11; U; Linux x86_64; en-US; rv:1.9.0.4) Gecko/2008110400 Ubuntu/8.10 (intrepid) Firefox/3.0.4

While scrolling a page, elements with the css rule overflow:auto or overflow:scroll are rendering with a pronounced flicker. I filed a report through the Firefox/Ubuntu Launchpad system. We uninstalled my Nvidia driver and tried the newest version of the Shiretoko version -- all with the same flickering. An additional test on my laptop using a completely different video driver also had the same results. Running the Epiphany browser in Webkit mode did not display the same flickering. Opera, Konqueror and Midori have no flickering, seemingly isolating this problem to Gecko.

Reproducible: Always

Steps to Reproduce:
1. Visit cyber-sandbox.com or any website with an overflow:auto element.
2. Scroll.
3. See flicker.
Actual Results:
I whined a little, like when my girlfriend wants to spend more time at the mall.

Expected Results:
Shown me the sweet, smooth, screen love I've come to expect from my favorite browser.

Launchpad reference: https://bugs.launchpad.net/bugs/292282
Note that this problem existed in FF2 on Ubuntu, but I was kinda ignoring it. It's really the only bug the causes me grief (except for the random right click action -- already reported by someone else).
Also note that Bugzilla was returning errors on every bug I clicked and that there is no Core -> Layout component as indicated in your component definition and A. Sack's email to me, so I'm listing it in General.

[Bill Brown (macnimble)]

Issue persists. Also evident on my laptop which does not use the Nvidia drivers.
Attempted to file against Core -> Layout component, but could not find it, so I filed it under General.
Link to this exchange was included.

[Ria-klaassen (ria-klaassen)]

Testing on Windows XP I do see a problem but only on trunk (Minefield). I see a peculiar movement of the scrollbar in the update box. Is that what you mean?

[Bill Brown (macnimble)]

Ahh, sorry. I should have made it more clear that this bug is not found on Windows, only on my Ubuntu systems (I haven't tested other distros). In fact, running Firefox/Win through Wine or VirtualBox Windows eliminates this bug.

[Alexander Sack (asac)]

moving to Layout component for now.

[Alexander Sack (asac)]

Bill Brown wrote:
> Issue persists. Also evident on my laptop which does not use the Nvidia drivers.
> Attempted to file against Core -> Layout component, but could not find it, so I filed it under General.
> Link to this exchange was included.
>
>
please give us the bug id ... so i can properly bring this on track
there ... otherwise nobody will probably loook at it (being filed
against general now :))

Thanks!

[Bill Brown (macnimble)]

Sorry about that.

Bug ID: 463341
Link: https://bugzilla.mozilla.org/show_bug.cgi?id=463341

[Alexander Sack (asac)]

confirmed upstream bug and moved to layout component.

[Niklas-blohm (niklas-blohm)]

this behaviour is present in windows xp too. when dragging a layer over a div with overflow auto there is sort of a "jump" over the border of the div. not very nice, and interestingly enough not present in firefox 2.

[Daniellehuntrods (daniellehuntrods)]

I would like to second the comment about the behaviour occurring in Windows XP.
I am running XP with an NVIDIA Quadro display driver, and on a page I am currently developing I have encountered this problem.

A similar effect is also displaying quite clearly here when I follow the instructions on the page and add more text: http://mihai.bazon.net/blog/firefox-slowness-identified/test.html

The page I am creating uses jQuery to slide a panel with a child box that has overflow:auto set, and when the panel slides the jumping and slow re-draw is evident. If I set the overflow to hidden the problem goes away.

[Sandwich (sandwiched)]

I'm also affected by this. I have an NVIDIA card as well... is there any way I can help fix this?

[T-rosenau (t-rosenau)]

Created an attachment (id=410060)
Simple testcase

[Loïc Alejandro (loic-alejandro)]

Same for me on Karmic with FF3.5.5 (3.5.5+nobinonly-0ubuntu0.9.10.1)
Bug is visible with this example :
<html>
 <head>
 </head>
 <body>
  <div style="position:absolute;top:42px;bottom:38px;left:50px;right:50px;overflow:auto">ZFFZDZFDZFZFF</div>
 </body>
</html>

[Loïc Alejandro (loic-alejandro)]

Ups, I think I am talking about another bug. Forget my comment.