diff --git a/src/ScrollBar.tsx b/src/ScrollBar.tsx index ec4e5a4..6894002 100644 --- a/src/ScrollBar.tsx +++ b/src/ScrollBar.tsx @@ -134,20 +134,17 @@ const ScrollBar = React.forwardRef((props, ref) => nextTop = pagePosition - rect.top - spinSize / 2; } - onScroll( - getScrollOffsetByThumbTop(nextTop, enableScrollRange, enableOffsetRange), - horizontal, - ); + onScroll(getScrollOffsetByThumbTop(nextTop, enableScrollRange, enableOffsetRange), horizontal); }; const onContainerMouseDown: React.MouseEventHandler = (e) => { - e.stopPropagation(); - e.preventDefault(); - if (e.button !== 0 || isThumbTarget(e.target)) { return; } + e.stopPropagation(); + e.preventDefault(); + scrollToTrackPosition(e); }; @@ -156,6 +153,10 @@ const ScrollBar = React.forwardRef((props, ref) => stateRef.current = { top, dragging, pageY: pageXY, startTop }; const onThumbMouseDown = useEvent((e: React.MouseEvent | React.TouchEvent | TouchEvent) => { + if ('button' in e && e.button !== 0) { + return; + } + setDragging(true); setPageXY(getPageXY(e, horizontal)); setStartTop(stateRef.current.top); diff --git a/tests/scroll.test.js b/tests/scroll.test.js index 57ea5d5..d4368fa 100644 --- a/tests/scroll.test.js +++ b/tests/scroll.test.js @@ -393,6 +393,29 @@ describe('List.Scroll', () => { expect(container.querySelector('ul').scrollTop).toEqual(950); }); + it('ignores right mouse button', () => { + const { container } = genList({ + itemHeight: 20, + height: 100, + data: genData(100), + }); + const holder = getHolder(container); + const scrollbar = container.querySelector('.rc-virtual-list-scrollbar-vertical'); + const thumb = container.querySelector('.rc-virtual-list-scrollbar-thumb'); + + const trackEvent = createEvent.mouseDown(scrollbar, { button: 2 }); + fireEvent(scrollbar, trackEvent); + + expect(trackEvent.defaultPrevented).toBeFalsy(); + expect(holder.scrollTop).toEqual(0); + + const thumbEvent = createEvent.mouseDown(thumb, { button: 2 }); + fireEvent(thumb, thumbEvent); + + expect(thumbEvent.defaultPrevented).toBeFalsy(); + expect(holder.style.pointerEvents).toEqual(''); + }); + it('should show scrollbar when element has showScrollBar prop set to true', () => { jest.useFakeTimers(); const listRef = React.createRef();