(test): ensure props are set and updated correctly

- that defaults, mounted initial props and options, and updated props
  and options match
  - took me a bit to figure out I should use `toMatchObject` and then
    how to use `toMatchObject` properly

- add fixtures for props and split them into sigPad vs. rSC for
  different uses

Author: agilgur5

src/index.spec.js

@@ -3,7 +3,7 @@ import { mount } from 'enzyme'
 import React from 'react'
 
 import SignatureCanvas from './index.js'
-import { dotData, canvasProps, trimmedSize } from '../test-utils/fixtures.js'
+import { props, sigPadOptions, dotData, canvasProps, trimmedSize } from '../test-utils/fixtures.js'
 
 test('mounts canvas and instance properly', () => {
   const wrapper = mount(<SignatureCanvas />)
@@ -12,6 +12,36 @@ test('mounts canvas and instance properly', () => {
   expect(instance.isEmpty()).toBe(true)
 })
 
+describe('props are set and updated correctly', () => {
+  test('default props should match', () => {
+    const instance = mount(<SignatureCanvas />).instance()
+    expect(instance.props).toStrictEqual(SignatureCanvas.defaultProps)
+  })
+
+  test('mounted initial props and options should match', () => {
+    const instance = mount(<SignatureCanvas {...props} />).instance()
+    const sigPad = instance.getSignaturePad()
+
+    expect(instance.props).toMatchObject(props)
+    expect(sigPad).toMatchObject(sigPadOptions)
+  })
+
+  test('updated props and options should match', () => {
+    const wrapper = mount(<SignatureCanvas />)
+    const instance = wrapper.instance()
+    const sigPad = instance.getSignaturePad()
+
+    // default props and options should not match new ones
+    expect(instance.props).not.toMatchObject(props)
+    expect(sigPad).not.toMatchObject(sigPadOptions)
+
+    // should match when updated
+    wrapper.setProps(props)
+    expect(instance.props).toMatchObject(props)
+    expect(sigPad).toMatchObject(sigPadOptions)
+  })
+})
+
 describe('SigCanvas wrapper methods return equivalent to SigPad', () => {
   const rSigPad = mount(<SignatureCanvas />).instance()
   const sigPad = rSigPad.getSignaturePad()

test-utils/fixtures.js

@@ -1,3 +1,23 @@
+// signature_pad options
+export const sigPadOptions = {
+  velocityFilterWeight: 0.8,
+  minWidth: 0.6,
+  maxWidth: 2.6,
+  minDistance: 4,
+  dotSize: 2,
+  penColor: 'green',
+  throttle: 17,
+  onEnd: () => { return 'onEnd' },
+  onBegin: () => { return 'onBegin' }
+}
+// props specific to React wrapper
+const rSCProps = {
+  canvasProps: { width: 500, height: 500 },
+  clearOnResize: false
+}
+// should all be different from the defaults
+export const props = { ...sigPadOptions, ...rSCProps }
+
 export const dotData = [
   [{ x: 466.59375, y: 189, time: 1564339579755, color: 'black' }]
 ]