2 files changed, 105 insertions, 0 deletions
diff --git a/web/src/js/__tests__/components/Header/MenuToggleSpec.js b/web/src/js/__tests__/components/Header/MenuToggleSpec.js
new file mode 100644
index 00000000..dabaaa4e
--- /dev/null
+++ b/web/src/js/__tests__/components/Header/MenuToggleSpec.js
@@ -0,0 +1,55 @@
+import React from 'react'
+import renderer from 'react-test-renderer'
+import { MenuToggle, SettingsToggle, EventlogToggle } from '../../../components/Header/MenuToggle'
+import { Provider } from 'react-redux'
+import { REQUEST_UPDATE } from '../../../ducks/settings'
+import { TStore } from '../../ducks/tutils'
+
+global.fetch = jest.fn()
+
+describe('MenuToggle Component', () => {
+    it('should render correctly', () => {
+        let changeFn = jest.fn(),
+            menuToggle = renderer.create(
+                <MenuToggle onChange={changeFn} value={true}>
+                    <p>foo children</p>
+                </MenuToggle>),
+            tree = menuToggle.toJSON()
+        expect(tree).toMatchSnapshot()
+    })
+})
+
+describe('SettingToggle Component', () => {
+    let store = TStore(),
+        provider = renderer.create(
+            <Provider store={store}>
+                <SettingsToggle setting='anticache'>
+                    <p>foo children</p>
+                </SettingsToggle>
+            </Provider>),
+        tree = provider.toJSON()
+
+    it('should render and connect to state', () => {
+        expect(tree).toMatchSnapshot()
+    })
+
+    it('should handle change', () => {
+        let menuToggle = tree.children[0].children[0]
+        menuToggle.props.onChange()
+        expect(store.getActions()).toEqual([{ type: REQUEST_UPDATE }])
+    })
+})
+
+describe('EventlogToggle Component', () => {
+    let store = TStore(),
+        changFn = jest.fn(),
+        provider = renderer.create(
+            <Provider store={store}>
+                <EventlogToggle value={false} onChange={changFn}/>
+            </Provider>
+        ),
+        tree = provider.toJSON()
+    it('should render and connect to state', () => {
+        expect(tree).toMatchSnapshot()
+    })
+})
diff --git a/web/src/js/__tests__/components/Header/__snapshots__/MenuToggleSpec.js.snap b/web/src/js/__tests__/components/Header/__snapshots__/MenuToggleSpec.js.snap
new file mode 100644
index 00000000..a0859081
--- /dev/null
+++ b/web/src/js/__tests__/components/Header/__snapshots__/MenuToggleSpec.js.snap
@@ -0,0 +1,50 @@
+// Jest Snapshot v1, https://goo.gl/fbAQLP
+
+exports[`EventlogToggle Component should render and connect to state 1`] = `
+<div
+  className="menu-entry"
+>
+  <label>
+    <input
+      checked={true}
+      onChange={[Function]}
+      type="checkbox"
+    />
+    Display Event Log
+  </label>
+</div>
+`;
+
+exports[`MenuToggle Component should render correctly 1`] = `
+<div
+  className="menu-entry"
+>
+  <label>
+    <input
+      checked={true}
+      onChange={[Function]}
+      type="checkbox"
+    />
+    <p>
+      foo children
+    </p>
+  </label>
+</div>
+`;
+
+exports[`SettingToggle Component should render and connect to state 1`] = `
+<div
+  className="menu-entry"
+>
+  <label>
+    <input
+      checked={true}
+      onChange={[Function]}
+      type="checkbox"
+    />
+    <p>
+      foo children
+    </p>
+  </label>
+</div>
+`;