[slider]: Can use text input to enter value outside slider range

[kccox]

What package(s) are you using?

• carbon-components
• carbon-components-react

Detailed description

The Slider component has properties for a min, max, and step value.

The text input can be used to enter values that are not allowed by those properties, for example:

• A number outside the min/max range, as shown in the attached image
• A number that does not match the step, for example entering 10.5 when the step is 1

I expected that the value would not be accepted. Instead the slider's onChange event is fired with the invalid value. If you hover over the text input, a tooltip shows that the value is invalid, but the behavior I expect is that onChange not be called. If the input is not parsable as a number ("cat" for example) onChange is not called.

In our application we were able to work around this by having onChange call a method that checks the value and marks the slider as invalid if it is illegal.

Browsers: Same behavior on Firefox, Chrome, Edge, IE.

Carbon version: carbon-components 10.11.1, carbon-components-react 7.13.0

Steps to reproduce the issue

1. Create a sandbox slider component with <Slider value={10} min={1} max={20} step={1} onChange={target => console.log(target.value)} />
2. Type invalid values into the text box, such as -5, 25, 17.5. Note that the onChange is called with the value, and there is no indication that the value is invalid.

Additional information