diff --git a/source/Masonry/Masonry.jest.js b/source/Masonry/Masonry.jest.js
index f7f189185..23a00189b 100644
--- a/source/Masonry/Masonry.jest.js
+++ b/source/Masonry/Masonry.jest.js
@@ -97,7 +97,10 @@ function getMarkup(props = {}) {
function simulateScroll(masonry, scrollTop = 0) {
const target = {scrollTop};
masonry._scrollingContainer = target; // HACK to work around _onScroll target check
- Simulate.scroll(findDOMNode(masonry), {target});
+
+ const masonryNode = findDOMNode(masonry);
+ masonryNode.scrollTop = scrollTop;
+ Simulate.scroll(masonryNode);
}
describe('Masonry', () => {
@@ -298,6 +301,35 @@ describe('Masonry', () => {
expect(node.style.right).toMatch(/px/);
});
});
+
+ it('should consider scroll only of the container element and not of any ancestor element', () => {
+ const cellMeasurerCache = createCellMeasurerCache();
+ const renderScrollableCell = index => (
+
+ );
+ const cellRenderer = createCellRenderer(
+ cellMeasurerCache,
+ renderScrollableCell,
+ );
+
+ const rendered = findDOMNode(
+ render(
+ getMarkup({
+ overscanByPixels: 0,
+ cellMeasurerCache,
+ cellRenderer,
+ }),
+ ),
+ );
+ assertVisibleCells(rendered, '0,1,2,3,4,5');
+ const cellEl = rendered.querySelector('#scrollable-cell-1');
+ Simulate.scroll(cellEl, {target: {scrollTop: 100}});
+ assertVisibleCells(rendered, '0,1,2,3,4,5');
+ });
});
describe('recomputeCellPositions', () => {
diff --git a/source/Masonry/Masonry.js b/source/Masonry/Masonry.js
index aad79dd68..095722162 100644
--- a/source/Masonry/Masonry.js
+++ b/source/Masonry/Masonry.js
@@ -410,7 +410,7 @@ class Masonry extends React.PureComponent {
_onScroll = event => {
const {height} = this.props;
- const eventScrollTop = event.target.scrollTop;
+ const eventScrollTop = event.currentTarget.scrollTop;
// When this component is shrunk drastically, React dispatches a series of back-to-back scroll events,
// Gradually converging on a scrollTop that is within the bounds of the new, smaller height.