Slider component only allows adjusting in increments of 10 via drag gesture

[iamthomasbishop]

Describe the bug
Slider component only allows adjusting in increments of 10 via drag gesture.

To Reproduce
Steps to reproduce the behavior:

1. Add a Spacer block
2. Open block settings by tapping on the cog/gear icon
3. Try dragging to adjust the height of the block
4. Notice that you can only adjust in increments of 10

Expected behavior
I expect to adjust by increments of 1.

Screenshots

Smartphone (please complete the following information):

• Device: iPhone 11 Pro
• OS: iOS 13.3.1
• Version: Tested via build 26428 via this PR (cc @lukewalczak), but I'm also seeing this issue on the latest primary internal beta. Not seeing this on production, so it must have been a recent change.

[pinarol]

@lukewalczak Could you check what’s going on here? Let’s try to fix this one as soon as possible.

[lukewalczak]

It looks like it's the effect/result of PR related to sharing edit method with web, where step was unified and set to 10 probably to match the web behaviour.
If there is no reason to keep that I will suggest using Platform API and set the correct step value according to platform e.g:

import { Platform } from '@wordpress/element';

...
<RangeControl
	...
	step={ Platform.OS === 'web' ? 10 : 1 }
/>

[iamthomasbishop]

Ah, okay, thanks for investigating @lukewalczak! Maybe I'm missing some rationale that the web folks have for single increments to be 10px vs. 1px, but it feels really odd to me (even on the web, but esp in the context of a slider on mobile). Are we able to override that to apply increments of 1?

[lukewalczak]

I didn't take part in refactoring Spacer block, so it looks incorrectly for me as well!

Are we able to override that to apply increments of 1?

Sure, my suggestion above is fixing that in this way (mobile: step = 1, web: step = 10),however let's wait for @pinarol opinion on that ✌️

[iamthomasbishop]

Sure, my suggestion above is fixing that in this way (mobile: step = 1, web: step = 10),however let's wait for @pinarol opinion on that ✌️

Sounds good! To be fair, it is a nice thing to have the ability to set step values (particularly something that has a smaller range but a Stepper isn't desirable — like image sizes or something along those lines), but the default unit, imo, should be 1.

FYI @SergioEstevao (who worked on the Spacer refactoring recently, although I don't think he changed anything w/ this step value 😄)

[lukewalczak]

Sounds good! To be fair, it is a nice thing to have the ability to set step values (particularly something that has a smaller range but a Stepper isn't desirable — like image sizes or something along those lines), but the default unit, imo, should be 1.

Agree on that!

[pinarol]

Sure, my suggestion above is fixing that in this way (mobile: step = 1, web: step = 10),however let's wait for @pinarol opinion on that ✌️

Sounds good to me considering that @iamthomasbishop is giving the 👍

[SergioEstevao]

I defer to you @iamthomasbishop but I don't think it makes sense increments of 1, do you think our users will increment/want spacers with 1px difference?

Can we check with the web folks what is the rationale there? Or you already checked with them?

[SergioEstevao]

I talked a bit with @pinarol and @lukewalczak and I changed my mind because of two things:

• On the web there is the option to directly manipulate the spacer size,
• and also write a custom value, so we can have values that are different from multiples of 10

So I agree that we should have steps of 1 on mobile.

[iamthomasbishop]

I talked a bit with @pinarol and @lukewalczak and I changed my mind because of two things:

👍 Sounds good. It'd still make sense to touch base w/ the web folks to see what their rationale may have been.