Bug reportNov 15, 2026· 0:35· 9 views
@radix-ui/react-slider: Home/End moves the wrong thumb on a range slider
0:35 total
Comments · 0
Be the first to comment.
Bug reportby SceneRecap AI
mediumSlider keyboard handling for Home/End in range (multi-thumb) mode. The thumb index used for the Home/End value update appears to come from a value-based lookup, such as the closest thumb to min or max, rather than from the focused thumb index. Arrow and PageUp/PageDown handling was not tested in this recording.
os: macOSdpr: 1locale: en-USbrowser: Chromium 151.0.7922.34package: @radix-ui/react-slider (latest, per page subtitle)timezone: Europe/Berlinviewport: 1280x720related_issue: radix-ui/primitives#4280
Repro steps
- 1.Open the repro page. Both range sliders start at value [20, 80].
- 2.In Test 1, click the slider thumb named 'Minimum'.
- 3.Press End.
- 4.In Test 2, click the slider thumb named 'Maximum'.
- 5.Press Home.
Expected
Home and End should change only the focused thumb. With the Minimum thumb focused, End should move the Minimum thumb and the Maximum thumb should stay at 80. With the Maximum thumb focused, Home should move the Maximum thumb and the Minimum thumb should stay at 20. The Test 1 card states the expected result as 'min→10'. The Test 2 card states it as 'max→0'.
Actual
With the Minimum thumb focused, End moved the Maximum thumb to 100. The value became [20,100] and the Minimum thumb stayed at 20. With the Maximum thumb focused, Home moved the Minimum thumb to 0. The value became [0,80] and the Maximum thumb stayed at 80.
Evidence
visualBoth sliders show value: [20, 80] before any interaction.
visualAfter End is pressed with 'Minimum' focused, the Test 1 value reads [20,100]. The right thumb sits at the track end.
visualTest 1 overlay labels read 'Minimum=20' and 'Maximum=100 ✗ moved (wrong)'.
visualThe Test 2 right thumb ('Maximum') shows a focus ring after the click.
visualAfter Home is pressed with 'Maximum' focused, the Test 2 value reads [0,80]. The left thumb sits at the track start.
visualTest 2 overlay labels read 'Minimum=0 ✗ moved (wrong)' and 'Maximum=80'.
visualBoth wrong states persist unchanged until the end of the recording.
Issue markdown (copy-paste ready)
## Range slider: Home/End moves the opposite thumb instead of the focused thumb Related: radix-ui/primitives#4280 ### Environment - Browser: Chromium 151.0.7922.34 - OS: macOS - Viewport: 1280x720, DPR 1 - Package: @radix-ui/react-slider (latest, per the page subtitle) ### Steps to reproduce 1. Open the repro page. Both range sliders start at `[20, 80]` (1.0s). 2. In Test 1, click the thumb named `Minimum` (11.4s). 3. Press `End` (13.0s). 4. In Test 2, click the thumb named `Maximum` (22.0s). 5. Press `Home` (23.5s). ### Expected Home and End change only the focused thumb. - Test 1: the Minimum thumb moves. Maximum stays at 80. The card states the expected result as `min→10`. - Test 2: the Maximum thumb moves. Minimum stays at 20. The card states the expected result as `max→0`. ### Actual - Test 1 (13.0s): pressing `End` with `Minimum` focused moves the **Maximum** thumb to 100. The value becomes `[20,100]` and Minimum stays at 20. The labels at 17.0s read `Minimum=20` and `Maximum=100 ✗ moved (wrong)`. - Test 2 (25.0s): pressing `Home` with `Maximum` focused moves the **Minimum** thumb to 0. The value becomes `[0,80]` and Maximum stays at 80. The labels at 27.0s read `Minimum=0 ✗ moved (wrong)` and `Maximum=80`. Both wrong states persist through 31.0s. ### Evidence - 1.0s: both sliders show `value: [20, 80]`. - 13.0s: Test 1 shows `value: [20,100]`. The right thumb is at the track end. - 23.0s: the Test 2 Maximum thumb shows a focus ring before Home is pressed. - 25.0s: Test 2 shows `value: [0,80]`. The left thumb is at the track start. No console or network activity was captured. ### Suggested area Check Home/End handling in multi-thumb mode. The thumb index for the update seems to come from a value-based lookup, such as the closest thumb to min or max. It should use the focused thumb's index. Arrow keys and PageUp/PageDown were not tested in this recording. *Recorded with SceneRecap.*
Your recordings could explain themselves too.
Free plan · silent recordings welcome · bug reports included.
Try SceneRecap free →