diff --git a/src/components/structures/ScrollPanel.js b/src/components/structures/ScrollPanel.js index 36dbf041e8..31ac59c730 100644 --- a/src/components/structures/ScrollPanel.js +++ b/src/components/structures/ScrollPanel.js @@ -25,7 +25,10 @@ var DEBUG_SCROLL = false; // The amount of extra scroll distance to allow prior to unfilling. // See _getExcessHeight. -const UNPAGINATION_PADDING = 500; +const UNPAGINATION_PADDING = 1500; +// The number of milliseconds to debounce calls to onUnfillRequest, to prevent +// many scroll events causing many unfilling requests. +const UNFILL_REQUEST_DEBOUNCE_MS = 200; if (DEBUG_SCROLL) { // using bind means that we get to keep useful line numbers in the console @@ -361,7 +364,15 @@ module.exports = React.createClass({ } if (markerScrollToken) { - this.props.onUnfillRequest(backwards, markerScrollToken); + // Use a debouncer to prevent multiple unfill calls in quick succession + // This is to make the unfilling process less aggressive + if (this._unfillDebouncer) { + clearTimeout(this._unfillDebouncer); + } + this._unfillDebouncer = setTimeout(() => { + this._unfillDebouncer = null; + this.props.onUnfillRequest(backwards, markerScrollToken); + }, UNFILL_REQUEST_DEBOUNCE_MS); } }, diff --git a/test/components/structures/TimelinePanel-test.js b/test/components/structures/TimelinePanel-test.js index 52b9185f18..b2cdfbd590 100644 --- a/test/components/structures/TimelinePanel-test.js +++ b/test/components/structures/TimelinePanel-test.js @@ -341,8 +341,9 @@ describe('TimelinePanel', function() { var events = scryEventTiles(panel); expect(events[0].props.mxEvent).toBe(timeline.getEvents()[0]); - // Expect to be able to paginate forwards, having unpaginated a few events - expect(panel.state.canForwardPaginate).toBe(true); + // At this point, we make no assumption that unpagination has happened. This doesn't + // mean that we shouldn't be able to scroll all the way down to the bottom to see the + // most recent event in the timeline. // scroll all the way to the bottom return scrollDown();