- Add mock for the 'bootstrap-slider-without-jquery' module.

- Change snapshot was decreased from 360 lines to 100.
- Add test for slide and slideStop

src/components/Slider/Slider.test.js

@@ -1,22 +1,44 @@
 import React from 'react';
-import { mount } from 'enzyme';
-import { Slider } from './index';
-import BootstrapSlider from './BootstrapSlider';
-
-test('horizontal slider match snapshot and respond to simulated events', () => {
-  const props = {
-    id: 'slider-pf',
-    label: 'Size',
-    value: 50,
-    min: 0,
-    max: 100,
-    tooltip: 'show',
-    inputFormat: 'MB',
-    dropdownList: ['MB', 'GB']
-  };
-  const wrapper = mount(<Slider dropup input showBoundaries {...props} />);
-  expect(wrapper).toMatchSnapshot();
+import { shallow, mount } from 'enzyme';
+import BSSlider from 'bootstrap-slider-without-jquery';
+import Slider from './Slider';
+import BSSliderWrapper from './BootstrapSlider';
+
+jest.mock('bootstrap-slider-without-jquery');
+
+beforeEach(() => {
+  BSSlider.mockClear();
+});
+
+const props = {
+  id: 'slider-pf',
+  label: 'Size',
+  value: 50,
+  min: 0,
+  max: 100,
+  tooltip: 'show',
+  inputFormat: 'MB',
+  dropdownList: ['MB', 'GB']
+};
+
+test('listens for slide', () => {
+  shallow(<BSSliderWrapper {...props} />);
+  expect(BSSlider.mock.instances[0].on).toBeCalledWith(
+    'slide',
+    expect.any(Function)
+  );
+});
+
+test('listens for slideStop', () => {
+  shallow(<BSSliderWrapper {...props} />);
+  expect(BSSlider.mock.instances[0].on).toBeCalledWith(
+    'slideStop',
+    expect.any(Function)
+  );
+});
 
+test('listens for input change', () => {
+  const wrapper = mount(<Slider dropup input showBoundaries {...props} />);
   const inputValue = 5;
   wrapper
     .find('.slider-input-pf')
@@ -25,12 +47,9 @@ test('horizontal slider match snapshot and respond to simulated events', () => {
 
   const { value } = wrapper.state();
   expect(value).toEqual(inputValue);
+});
 
-  const BSSlider = mount(<BootstrapSlider {...props} />);
-  const componentWillReceiveProps = jest.spyOn(
-    BSSlider.instance(),
-    'componentWillReceiveProps'
-  );
-  BSSlider.setProps({ value: 60 });
-  expect(componentWillReceiveProps).toHaveBeenCalled();
+test('Slider match snapshot', () => {
+  const wrapper = shallow(<Slider {...props} />);
+  expect(wrapper).toMatchSnapshot();
 });

src/components/Slider/__mocks__/bootstrap-slider-without-jquery.js

@@ -0,0 +1,27 @@
+const mockSlider = jest.fn(function MockSlider(el, props) {
+  this.props = props;
+  this.value = props.value;
+  this.handlers = {};
+  this.tooltip = getMockElement();
+  this.tickLabelContainer = getMockElement();
+
+  this.on = jest.fn((evt, handler) => {
+    this.handlers[evt] = handler;
+  });
+  this.setValue = jest.fn(value => {
+    this.value = value;
+  });
+  this.setAttribute = jest.fn();
+});
+
+function getMockElement() {
+  return {
+    offsetWidth: 0,
+    offsetHeight: 0,
+    style: {
+      marginTop: 0
+    }
+  };
+}
+
+export default mockSlider;