From 1d7e5544876b111e96358247435ba6dfb674b861 Mon Sep 17 00:00:00 2001
From: Matthew Shao <me@matshao.com>
Date: Fri, 26 May 2017 17:25:51 +0800
Subject: [PATCH] [web] Add tests for
 js/components/Header/ConnectionIndicator.jsx

---
 .../Header/ConnectionIndicatorSpec.js         | 57 +++++++++++++++++++
 .../components/Header/ConnectionIndicator.jsx |  2 +-
 2 files changed, 58 insertions(+), 1 deletion(-)
 create mode 100644 web/src/js/__tests__/components/Header/ConnectionIndicatorSpec.js

diff --git a/web/src/js/__tests__/components/Header/ConnectionIndicatorSpec.js b/web/src/js/__tests__/components/Header/ConnectionIndicatorSpec.js
new file mode 100644
index 000000000..88527d915
--- /dev/null
+++ b/web/src/js/__tests__/components/Header/ConnectionIndicatorSpec.js
@@ -0,0 +1,57 @@
+import React from 'react'
+import renderer from 'react-test-renderer'
+import ConnectedIndicator, { ConnectionIndicator } from '../../../components/Header/ConnectionIndicator'
+import { ConnectionState } from '../../../ducks/connection'
+import { Provider } from 'react-redux'
+import configureStore from 'redux-mock-store'
+
+const mockStore = configureStore()
+
+describe('ConnectionIndicator Component', () => {
+
+    it('should render INIT', () => {
+        let connectionIndicator = renderer.create(
+            <ConnectionIndicator state={ConnectionState.INIT}/>),
+            tree = connectionIndicator.toJSON()
+        expect(tree).toMatchSnapshot()
+    })
+
+    it('should render FETCHING', () => {
+        let connectionIndicator = renderer.create(
+            <ConnectionIndicator state={ConnectionState.FETCHING}/>),
+            tree = connectionIndicator.toJSON()
+        expect(tree).toMatchSnapshot()
+    })
+
+    it('should render ESTABLISHED', () => {
+        let connectionIndicator = renderer.create(
+            <ConnectionIndicator state={ConnectionState.ESTABLISHED}/>),
+            tree = connectionIndicator.toJSON()
+        expect(tree).toMatchSnapshot()
+    })
+
+    it('should render ERROR', () => {
+        let connectionIndicator = renderer.create(
+            <ConnectionIndicator state={ConnectionState.ERROR} message="foo"/>),
+            tree = connectionIndicator.toJSON()
+        expect(tree).toMatchSnapshot()
+    })
+
+    it('should render OFFLINE', () => {
+        let connectionIndicator = renderer.create(
+            <ConnectionIndicator state={ConnectionState.OFFLINE} />),
+            tree = connectionIndicator.toJSON()
+        expect(tree).toMatchSnapshot()
+    })
+
+    it('should connect to state', () => {
+        let store = mockStore({ connection: {state: ConnectionState.INIT} }),
+            provider = renderer.create(
+            <Provider store={store}>
+                <ConnectedIndicator/>
+            </Provider>),
+        tree = provider.toJSON()
+        expect(tree).toMatchSnapshot()
+    })
+})
+
diff --git a/web/src/js/components/Header/ConnectionIndicator.jsx b/web/src/js/components/Header/ConnectionIndicator.jsx
index 1ee42e259..bbf0dd81e 100644
--- a/web/src/js/components/Header/ConnectionIndicator.jsx
+++ b/web/src/js/components/Header/ConnectionIndicator.jsx
@@ -9,7 +9,7 @@ ConnectionIndicator.propTypes = {
     message: PropTypes.string,
 
 }
-function ConnectionIndicator({ state, message }) {
+export function ConnectionIndicator({ state, message }) {
     switch (state) {
         case ConnectionState.INIT:
             return <span className="connection-indicator init">connecting…</span>;