[Bug] Missing `mousedown` event bubbling after v10 upgrade
Nobody has claimed this yet.
Assessment
- Difficulty
- 2/5
- Estimated time
- 1-3 hours
- Newbie friendliness
- 45/100
- Issue type
- Bug
- Clarity
- Clearly specified
- Activity status
- Stale
- Tech stack
- react, typescript
- Domain
- frontend
Research direction
Start with src/Marks/Mark.tsx around lines 33-35 and inspect the stopPropagation() call mentioned in the issue. Reproduce the event sequence in the linked CodeSandbox or with browser event monitoring, then verify that clicking a handle produces the expected mousedown, mouseup, and click bubbling behavior.
Written by the indexing model from the issue text.
Description
Current behaviour
Currently, when version 10.x of rc-slider is being used, the mousedown event when clicking the handles is not bubbling. This causes issues with other libraries, for example react-modal:
react-modal uses the mousedown event to decide whether the user started a mouse action in the modal or outside, which should close the modal: https://github.com/reactjs/react-modal/blob/master/src/components/ModalPortal.js#L306-L310. Without the bubbling, dragging the handle outside the modal component of react-modal will always trigger the modal close since the mouseup and click events are still bubbling.
Expected behaviour
The mousedown event should bubble so other handlers can work as they used to in preceding versions. Otherwise, the mouseup and click events should also be intercepted for the sake of consistency - this would be a breaking change though.
Steps to reproduce
- Watch the
mousedown,mouseupandclickevents. There are multiple ways to do this, for example the monitorEvents() function in the browser console. - Click and let go of the handle of the rc-slider component with < v10 of rc-slider.
- Observe the reported events.
- Repeat steps 1 - 3 with >= v10 of rc-slider
- Compare the reported events and notice the missing
mousedownevent.
You can use this prepared CodeSandbox to reproduce the bug.
Reported events with < v10 of rc-slider:
Reported events with >= v10 of rc-slider:
Hints
This stopPropagation() call likely causes the missing mousedown event.
- Dominant language
- TypeScript
- Stars
- 3.1k
- Forks
- 767
- Avg merge
- 11m
- Merged PRs (30d)
- 1
Getting set up
This project ships no dev container, Dockerfile or contributing guide, so setting up is up to you: start from its README, and see our first-contribution guide for the general steps.
First steps
- Read the whole issue, then the project's contributing guide.
- Comment on the issue to say you are picking it up — it saves two people doing the same work.
- Fork the repository and make your change on a branch.
- Open a pull request that references the issue number.
More from react-component/slider
-
Docs site is brokenOpen
Difficulty 2/5 1-3 hours Newbie friendliness 68/100
react-component/slider#1067 · 1 comment ·
-
Difficulty 4/5 3-5 days Newbie friendliness 30/100
react-component/slider#1064 ·
-
Difficulty 3/5 1-2 days Newbie friendliness 35/100
react-component/slider#1061 ·
-
当Slider宽度超过外层容器时，点击Slider，滚动条位置异常Possibly taken @nrps9909 claimed this 40 days ago. Open
Difficulty 3/5 1-2 days Newbie friendliness 45/100
react-component/slider#1060 ·
-
Difficulty 2/5 1-3 hours Newbie friendliness 42/100
react-component/slider#1058 · 1 comment ·
All issues in react-component/slider
Similar issues
-
Difficulty 2/5 1-3 hours Newbie friendliness 78/100
Maintainers usually reply within 1 day
-
kind/chore priority/must
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
sidereal-io/sidereal#380 ·
Maintainers usually reply within 1 day
-
Mend: dependency security vulnerability
Difficulty 2/5 1-3 hours Newbie friendliness 62/100
opfab/operatorfabric-core#10653 ·
Maintainers usually reply within 1 day
-
backend bug size:sm
Difficulty 2/5 1-3 hours Newbie friendliness 82/100
chrisbenincasa/tunarr#2237 ·
Maintainers usually reply within 1 day
-
documentation
Difficulty 2/5 Half a day Newbie friendliness 69/100
Lam30ne/regulate-app#39 ·