Package Exports

react-range
react-range/lib/types

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (react-range) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

react-range

See all the other examples and their source code!

Installation

yarn add react react-dom react-range

End to end testing

This library is tightly coupled to many DOM APIs. It would be very hard to write unit tests that would not involve a lot of mocking. Or we could re-architect the library to better abstract all DOM interfaces but that would mean more code and bigger footprint.

Instead of that, react-range is thoroughly tested by end to end tests powered by puppeteer. It tests all user interactions:

All tests are automatically ran in Travis CI with headless chromium. This way, the public API is well tested, including pixel-perfect positioning. Also, the tests are pretty fast, reliable and very descriptive.

Do you want to run them in the dev mode (slows down operations, opens the browser)?

yarn storybook #start the storybook server
yarn test:e2e:dev #run the e2e tests

CI mode (storybook started on the background, quick, headless)

yarn test:e2e

Browser support

Chrome (latest, mac, windows, iOS, Android)
Firefox (latest, mac, windows)
Safari (latest, mac, iOS)
Edge (latest, windows)
MSIE 11 (windows)

Contributing

This is how you can spin up the dev environment:

git clone https://github.com/tajo/react-range
cd react-range
yarn
yarn storybook

Shoutouts 🙏

Big big shoutout to Tom MacWright for donating the react-range npm handle! ❤️

Big thanks to BrowserStack for letting the maintainers use their service to debug browser issues.

Author

Vojtech Miksu 2019, miksu.cz, @vmiksu