[web] Add tests for js/components/common/ToggleInputButton.jsx

2 files changed, 74 insertions, 0 deletions

diff --git a/web/src/js/__tests__/components/common/ToggleInputButtonSpec.js b/web/src/js/__tests__/components/common/ToggleInputButtonSpec.js
new file mode 100644
index 00000000..39e555cd
--- /dev/null
+++ b/web/src/js/__tests__/components/common/ToggleInputButtonSpec.js
@@ -0,0 +1,43 @@
+import React from 'react'
+import renderer from 'react-test-renderer'
+import ToggleInputButton from '../../../components/common/ToggleInputButton'
+import { Key } from '../../../utils'
+
+describe('ToggleInputButton Component', () => {
+    let mockFunc = jest.fn(),
+        toggleInputButton = undefined,
+        tree = undefined
+
+    it('should render correctly', () => {
+        toggleInputButton = renderer.create(
+            <ToggleInputButton checked={true} name="foo" onToggleChanged={mockFunc}
+                               placeholder="bar">text</ToggleInputButton>)
+        tree = toggleInputButton.toJSON()
+        expect(tree).toMatchSnapshot()
+    })
+
+    it('should handle keydown and click action', () => {
+        toggleInputButton = renderer.create(
+            <ToggleInputButton checked={false} name="foo" onToggleChanged={mockFunc}
+                               placeholder="bar" txt="txt">text</ToggleInputButton>)
+        tree = toggleInputButton.toJSON()
+        let mockEvent = {
+            keyCode: Key.ENTER,
+            stopPropagation: jest.fn()
+        }
+
+        tree.children[1].props.onKeyDown(mockEvent)
+        expect(mockFunc).toBeCalledWith("txt")
+
+        tree.children[0].props.onClick()
+        expect(mockFunc).toBeCalledWith("txt")
+    })
+
+    it('should update state onChange', () => {
+        // trigger onChange
+        tree.children[1].props.onChange({ target: { value: "foo" }})
+        // update the tree
+        tree = toggleInputButton.toJSON()
+        expect(tree.children[1].props.value).toEqual("foo")
+    })
+})
diff --git a/web/src/js/__tests__/components/common/__snapshots__/ToggleInputButtonSpec.js.snap b/web/src/js/__tests__/components/common/__snapshots__/ToggleInputButtonSpec.js.snap
new file mode 100644
index 00000000..b8d80177
--- /dev/null
+++ b/web/src/js/__tests__/components/common/__snapshots__/ToggleInputButtonSpec.js.snap
@@ -0,0 +1,31 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`ToggleInputButton Component should render correctly 1`] = `
+<div
+  className="input-group toggle-input-btn"
+>
+  <span
+    className="input-group-btn"
+    onClick={[Function]}
+  >
+    <div
+      className="btn btn-primary"
+    >
+      <span
+        className="fa fa-check-square-o"
+      />
+       
+      foo
+    </div>
+  </span>
+  <input
+    className="form-control"
+    disabled={true}
+    onChange={[Function]}
+    onKeyDown={[Function]}
+    placeholder="bar"
+    type="text"
+    value=""
+  />
+</div>
+`;