diff --git a/source/Grid/Grid.jest.js b/source/Grid/Grid.jest.js index 8eaa745cf..3da5330dd 100644 --- a/source/Grid/Grid.jest.js +++ b/source/Grid/Grid.jest.js @@ -105,6 +105,78 @@ describe("Grid", () => { expect(rendered.textContent).not.toContain("column:0"); expect(rendered.textContent).not.toContain("row:0"); }); + + it("should scroll to the last existing point when rows are removed", () => { + const grid = render( + getMarkup({ + rowCount: 15 + }) + ); + + simulateScroll({ + grid, + scrollTop: 200 + }); + + const updatedGrid = render( + getMarkup({ + rowCount: 10 + }) + ); + + expect(updatedGrid.state.scrollTop).toEqual(100); + }); + + it("should scroll to the last existing point when columns are removed", () => { + const grid = render( + getMarkup({ + columnCount: 12 + }) + ); + + simulateScroll({ + grid, + scrollLeft: 400 + }); + + const updatedGrid = render( + getMarkup({ + columnCount: 8 + }) + ); + + expect(updatedGrid.state.scrollLeft).toEqual(200); + }); + + it("should not scroll unseen rows are removed", () => { + render( + getMarkup({ + rowCount: 15 + }) + ); + const updatedGrid = render( + getMarkup({ + rowCount: 10 + }) + ); + + expect(updatedGrid.state.scrollTop).toEqual(0); + }); + + it("should not scroll when unseen columns are removed", () => { + render( + getMarkup({ + columnCount: 12 + }) + ); + const updatedGrid = render( + getMarkup({ + columnCount: 8 + }) + ); + + expect(updatedGrid.state.scrollLeft).toEqual(0); + }); }); describe("shows and hides scrollbars based on rendered content", () => { diff --git a/source/Grid/Grid.js b/source/Grid/Grid.js index bdf48156b..97da1ccb4 100644 --- a/source/Grid/Grid.js +++ b/source/Grid/Grid.js @@ -512,17 +512,19 @@ export default class Grid extends React.PureComponent { // Don't adjust scroll offset for single-column grids (eg List, Table). // This can cause a funky scroll offset because of the vertical scrollbar width. - if (columnCount > 1) { + if (columnCount > 1 && columnIndex !== undefined) { this._updateScrollLeftForScrollToColumn({ ...props, scrollToColumn: columnIndex }); } - this._updateScrollTopForScrollToRow({ - ...props, - scrollToRow: rowIndex - }); + if (rowIndex !== undefined) { + this._updateScrollTopForScrollToRow({ + ...props, + scrollToRow: rowIndex + }); + } } componentDidMount() { @@ -1261,11 +1263,12 @@ export default class Grid extends React.PureComponent { } = props; const { scrollLeft } = state; - if (scrollToColumn >= 0 && columnCount > 0) { - const targetIndex = Math.max( - 0, - Math.min(columnCount - 1, scrollToColumn) - ); + if (columnCount > 0) { + const finalColumn = columnCount - 1; + const targetIndex = + scrollToColumn < 0 + ? finalColumn + : Math.min(finalColumn, scrollToColumn); const totalRowsHeight = this._rowSizeAndPositionManager.getTotalSize(); const scrollBarSize = totalRowsHeight > height ? this._scrollbarSize : 0; @@ -1304,8 +1307,10 @@ export default class Grid extends React.PureComponent { const { height, rowCount, scrollToAlignment, scrollToRow, width } = props; const { scrollTop } = state; - if (scrollToRow >= 0 && rowCount > 0) { - const targetIndex = Math.max(0, Math.min(rowCount - 1, scrollToRow)); + if (rowCount > 0) { + const finalRow = rowCount - 1; + const targetIndex = + scrollToRow < 0 ? finalRow : Math.min(finalRow, scrollToRow); const totalColumnsWidth = this._columnSizeAndPositionManager.getTotalSize(); const scrollBarSize = totalColumnsWidth > width ? this._scrollbarSize : 0;