Page 1 of 3 123 LastLast
Results 1 to 10 of 25

Thread: Bug Tree/Grid Scroller Stops Working

    Success! Looks like we've fixed this one. According to our records the fix was applied for EXTJS-3770 in a recent build.
  1. #1
    Ext JS Premium Member
    Join Date
    Nov 2009
    St Louis,MO

    Default Bug Tree/Grid Scroller Stops Working


    Ext version tested:
    • Ext 4.0 rev 5

    Browser versions tested against:
    • Chrome 12.0.742.122

    • Eventually the scroll bar stops working in a tree control (looking at the code it should happen on grids as well). The scroll bar will appear and move up and down but the tree content will not scroll with the bar.

    Steps to reproduce the problem:
    This is pretty "random" and sometimes very difficult but try doing the following.
    1. Point chrome to:
    2. Open a second chrome tab to:
    3. On the first tab, scroll the tree up and down with the mouse wheel then close the Ext node to make the scroll bar disappear
    4. Switch to the second tab, scroll the tree with the mouse wheel
    5. Switch to the first tab, expand the Ext node so the scroll bar reappears
    6. Scroll the tree with the mouse wheel
    7. Repeat steps 3-6 until the tree content stops moving with the scroll bar it may happen immediately or may take some time.

    The result that was expected:
    The tree should continue to scroll properly.

    The result that occurs instead:
    Eventually the tree content stops moving with the scroll bar. Others have also reported the scroll bar not appearing at all but I have not seen this personally.


    Screenshot or Video:
    You can see in the attached screen shot that the tree content is at the top (Ext node visibile) but the scroll bar is at the bottom.

    Debugging already done:
    I've played around with this some with no luck so far. I can tell you that if you set a breakpoint on Ext.grid.Scroller::onElScroll it no longer gets hit after the scroll bar stops working. I suspect it has something to do with the invalidate function on the same class. There are a lot of cases where it fails the if (!stretchEl || !me.ownerCt) condition. Sometimes me.ownerGrid is set, but not me.ownerCt. I tried changing the conditional to use me.onwerGrid but was still able to reproduce it.

    Additionally the last line of the invalidate function is rather suspect. Perhaps it was meant to do something else?

    PHP Code:
    elDom.scrollTop elDom.scrollTop
    This is for all intents a null statement.

    Additional CSS used:
    I have duplicated this with both standard scroll bars and the "webkit" scroll bars used in the documentations.

    Operating System:
    Windows 7

  2. #2
    Ext JS Premium Member
    Join Date
    Apr 2010


    FYI: I can confirm this Bug on Chrome 15.0.849.1 dev on Mac OS Lion.

  3. #3
    Ext JS Premium Member
    Join Date
    Apr 2011


    And I can confirm the same bug on Firefox 5.0 / Windows 7. Thanks.

  4. #4
    Sencha Premium User westy's Avatar
    Join Date
    Feb 2009
    Bath, UK


    Yeah, I can confirm as well. Quite an annoying one...
    Product Architect
    Altus Ltd.

  5. #5
    Ext JS Premium Member
    Join Date
    Sep 2009


    Thanks for posting the issue. I have a much similar problem. I have a tree with a refresh button which, when pressed, saves all the leaf nodes, collapses the tree, and re-expand the tree until all the leaf nodes are visible again. All goes well except that the scroll bar stops scrolling after the six or so refreshes.

  6. #6
    Sencha User
    Join Date
    Aug 2011


    Same thing happened to me. Browser: Chrome 13.0.782.220 / Windows 7.

  7. #7
    Ext JS Premium Member
    Join Date
    Jun 2010


    i'm getting the same problem with FF6 on XP

    why isn't normal scrolling used anymore?

    this new scrolling system gets really really slow and jerky when the computer is doing a lot of work....
    or especially on slower computers...

  8. #8
    Ext JS Premium Member
    Join Date
    Jun 2007


    +1. It happens on grids as well as trees in version 4.0.6. Super annoying.

  9. #9
    Sencha User
    Join Date
    May 2011


    I am using both jQuery and ExtJS in my project (historically), so I'm sorry for my workaround, may be it is a bit weird... May be someone can rewrite it using only ExtJS.

    // Override Ext.grid.Scroller object
    // to workaround ExtJS bug EXTJSIV-3770
    // more info at
    Ext.override(Ext.grid.Scroller, {
      afterRender: function() {
        var me = this;
        me.mon(me.scrollEl, 'scroll', me.onElScroll, me);
        Ext.cache[].skipGarbageCollection = true;
        // add another scroll event listener to check, if main listeners is active
        $(me.scrollEl.dom).scroll({scope: me}, me.onElScrollCheck);
      // flag to check, if main listeners is active
      wasScrolled: false,
      // synchronize the scroller with the bound gridviews
      onElScroll: function(event, target) {
        this.wasScrolled = true; // change flag -> show that listener is alive
        this.fireEvent('bodyscroll', event, target);
      // executes just after main scroll event listener and check flag state
      onElScrollCheck: function(event, target) {
        var me =;
        if (!me.wasScrolled)
          // Achtung! Event listener was disappeared, so we'll add it again
          me.mon(me.scrollEl, 'scroll', me.onElScroll, me);
        me.wasScrolled = false; // change flag to initial value
    It seems that this works for me, but I didn't test it a lot yet.

  10. #10


    Same issue with FF and Chrome on Ubuntu, also FF and Chrome on Snow Leopard...

Page 1 of 3 123 LastLast

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts