Bug reportAug 31, 2026· 0:23· 9 views
FluentUI ColorPicker: slider breaks when channel value is 0 (|| vs ?? in adjustChannel)
0:23 total
Comments · 0
Be the first to comment.
Bug report— by SceneRecap AI
mediumColorPicker
os: macOSbrowser: Chromium 151.0.7922.34viewport: 1280x720
Repro steps
- 1.Open the ColorPicker component in Storybook.
- 2.Click on the Hue slider to focus it.
- 3.Press the Home key to set the hue channel value to 0.
- 4.Press the ArrowRight key repeatedly to increment the channel from 0.
Expected
Adjusting the channel value when it is 0 should correctly increment the value and reposition the slider thumb without treating 0 as undefined/falsy.
Actual
When the channel value is 0, falsy checks (`||` instead of `??`) cause channel adjustment logic to miscalculate or fail to handle the zero baseline properly.
Evidence
visualAt 7.0s, clicking the hue slider sets cyan (#00e6e6). Pressing Home sets the hue to 0 (#e60000) at 9.0s.
visualAt 11.0s and 13.0s, pressing ArrowRight from 0 results in unexpected channel increments (#e60800, #e60b00) while the slider thumb position fails to align properly.
visualControl test at 19.6s: clicking on non-zero hue values (80% / purple #cf00e6) correctly positions the thumb and updates RGB/Hex channels.
Issue markdown (copy-paste ready)
### Summary When adjusting color channels in `ColorPicker` (specifically when a channel is set to `0`), logical OR fallback checks (`channel || fallback`) treat `0` as falsy instead of utilizing nullish coalescing (`channel ?? fallback`), breaking channel adjustment calculations from a 0 baseline. ### Steps to Reproduce 1. Open the FluentUI `ColorPicker` component. 2. Click the Hue slider at 6.45s to focus it. 3. Press the `Home` key at 7.83s to set the hue value to `0` (`#e60000`). 4. Press `ArrowRight` at 10.08s to increment the hue value. ### Expected Result The hue channel should increment smoothly from `0` and update the slider position accurately. ### Actual Result Because `0` evaluates to falsy in `||` expressions, default or fallback values are incorrectly triggered during channel adjustment (`adjustChannel`), producing incorrect calculations when incrementing from zero. *Recorded with SceneRecap.*
Your recordings could explain themselves too.
Free plan · silent recordings welcome · bug reports included.
Try SceneRecap free →