Setting :isScrolling immediately (rather than waiting on RAF) in :onScroll handler

Author: bvaughn

dist/react-virtualized.js

@@ -353,10 +353,9 @@ var Grid = function (_Component) {
 
           for (var columnIndex = columnStartIndex; columnIndex <= columnStopIndex; columnIndex++) {
             var columnDatum = this._columnMetadata[columnIndex];
-            var child = renderCell({ columnIndex: columnIndex, rowIndex: rowIndex });
+            var renderedCell = renderCell({ columnIndex: columnIndex, rowIndex: rowIndex });
             var key = rowIndex + '-' + columnIndex;
-
-            child = React.createElement(
+            var child = React.createElement(
               'div',
               {
                 key: key,
@@ -368,7 +367,7 @@ var Grid = function (_Component) {
                   width: this._getColumnWidth(columnIndex)
                 }
               },
-              child
+              renderedCell
             );
 
             childrenToDisplay.push(child);
@@ -727,8 +726,18 @@ var Grid = function (_Component) {
       // The mouse may move faster then the animation frame does.
       // Use requestAnimationFrame to avoid over-updating.
       if (this.state.scrollLeft !== scrollLeft || this.state.scrollTop !== scrollTop) {
+        // Browsers with cancelable scroll events (eg. Firefox) interrupt scrolling animations if scrollTop/scrollLeft is set.
+        // Other browsers (eg. Safari) don't scroll as well without the help under certain conditions (DOM or style changes during scrolling).
+        // All things considered, this seems to be the best current work around that I'm aware of.
+        // For more information see https://github.com/bvaughn/react-virtualized/pull/124
         var scrollPositionChangeReason = event.cancelable ? SCROLL_POSITION_CHANGE_REASONS.OBSERVED : SCROLL_POSITION_CHANGE_REASONS.REQUESTED;
 
+        if (!this.state.isScrolling) {
+          this.setState({
+            isScrolling: true
+          });
+        }
+
         this._setNextState({
           isScrolling: true,
           scrollLeft: scrollLeft,

dist/react-virtualized.js.map

@@ -430,10 +430,9 @@ export default class Grid extends Component {
 
         for (let columnIndex = columnStartIndex; columnIndex <= columnStopIndex; columnIndex++) {
           let columnDatum = this._columnMetadata[columnIndex]
-          let child = renderCell({ columnIndex, rowIndex })
+          let renderedCell = renderCell({ columnIndex, rowIndex })
           let key = `${rowIndex}-${columnIndex}`
-
-          child = (
+          let child = (
             <div
               key={key}
               className='Grid__cell'
@@ -444,7 +443,7 @@ export default class Grid extends Component {
                 width: this._getColumnWidth(columnIndex)
               }}
             >
-              {child}
+              {renderedCell}
             </div>
           )
 
@@ -780,6 +779,12 @@ export default class Grid extends Component {
         ? SCROLL_POSITION_CHANGE_REASONS.OBSERVED
         : SCROLL_POSITION_CHANGE_REASONS.REQUESTED
 
+      if (!this.state.isScrolling) {
+        this.setState({
+          isScrolling: true
+        })
+      }
+
       this._setNextState({
         isScrolling: true,
         scrollLeft,