react-power-select Added code and test to clear selected field using backspace

Adding functionality to clear selected field using keyboard to support accessibility standards.

"Some people cannot use a mouse, including many older users with limited fine motor control. An accessible website does not rely on the mouse; it makes all functionality available from a keyboard." source: https://www.w3.org/standards/webdesign/accessibility

Dec 02 '18 20:12 Suvra19

Coverage increased (+0.08%) to 81.45% when pulling d8f2157a31cbf2311c71249bb37277c598ee3398 on mediasuitenz:add-keyboard-support-to-clear-selected-option into e26f4902a9c6e1cd531d4f9818da69852cf1b7f4 on selvagsz:master.

Dec 02 '18 20:12 coveralls

Coverage increased (+0.3%) to 81.681% when pulling 27bbe91a419a461385a7b1c1e9593f9fcddd1a15 on mediasuitenz:add-keyboard-support-to-clear-selected-option into e26f4902a9c6e1cd531d4f9818da69852cf1b7f4 on selvagsz:master.

Dec 02 '18 20:12 coveralls

Is this a normal behavior in selects ? Can you cite some examples that have this behavior ?

Also, the disabled should be respected. Meaning, when the powerselect is disabled, pressing backspace should not clear it

Dec 04 '18 05:12 selvagsz

Yes. Actually it's a common practice to have valid keyboard alternatives to meet accessibility standards. For our case, just clearing the selected field using keyboard was missing. Example: https://jedwatson.github.io/react-select/

And yes, disabled check is a good catch. Thanks.

Dec 04 '18 05:12 Suvra19

@selvagsz I have added the check and also a test case, just in case.

Dec 04 '18 06:12 Suvra19

@selvagsz sorry to bother you again, did you have a chance to look at this PR ? I have a dependency on this little functionality. Thanks!

Dec 05 '18 04:12 Suvra19

We have showClear to show the close icon on the rhs of the powerselect. Setting it to false will allow to you change the value but you can't clear them.

But with backspace, this gets bypassed as well

I'm still unsure whether this behavior should respect showClear option or should behind a clearOnBackspace flag

Though I hate to increase the api surface.

Dec 05 '18 10:12 selvagsz

However, you can achieve the same functionality by composing the component & handling the keyDown event.

I'd prefer to wait for more feedbacks on this feature

Dec 05 '18 10:12 selvagsz

However, you can achieve the same functionality by composing the component & handling the keyDown event.

I'd prefer to wait for more feedbacks on this feature

No worries. Thanks for letting me know.

On another note. The TetherComponent changes are merged, so when can I expect the next release ?

Dec 11 '18 02:12 Suvra19

We have showClear to show the close icon on the rhs of the powerselect. Setting it to false will allow to you change the value but you can't clear them.

But with backspace, this gets bypassed as well

I'm still unsure whether this behavior should respect showClear option or should behind a clearOnBackspace flag

Though I hate to increase the api surface.

So, the way I see it, backspace is just an alternate way of clearing the selected field. So any scenario where you should not be able to clear the selected field, the backspace should honour that. I am making the changes right now to not bypass the showClear flag. Since you know the api best, let me know if you see any problem with that.

Also, I don't believe there is a need to use another flag for this specifically as that will be confusing for the user.

Dec 11 '18 02:12 Suvra19

@Suvra1990 published 1.0.0-beta.15 🎉

Dec 12 '18 12:12 selvagsz