zillow / react-slider

Accessible, CSS agnostic, slider component for React.
https://zillow.github.io/react-slider
MIT License
891 stars 232 forks source link

Examples how to write tests? #88

Closed sean-clayton closed 4 years ago

sean-clayton commented 8 years ago

I want to test my component (that uses this one) to make sure that the correct handlers are being invoked. Currently my test looks like this (Using Jest, expect.js, and Enzyme):

it('Calls the onAfterChange prop function on drag', () => {
  const action = expect.createSpy()
  // the onAfterChange prop binds directly to react-slider's onAfterChange prop
  const wrapper = mount(<MyReactSlider range={{ min: 0, max: 1000 }} onAfterChange={action} debounceTime={0} />)
  const handle = wrapper.find('.slider-handle-0')
  handle
    .simulate('mouseDown', { clientX: 0, clientY: 0, pageX: 500, pageY: 500 })
    .simulate('mouseMove', { pageX: 0 })
    .simulate('mouseUp')
})

Unfortunately, action is never invoked. I'm curious to how this component should be tested correctly?

stale[bot] commented 5 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.