[web] Introduce redux-mock-store and minor fix.

web/package.json

@@ -14,23 +14,24 @@
     "unmockedModulePathPatterns": [
       "react"
     ],
-    "coverageDirectory":"./coverage",
+    "coverageDirectory": "./coverage",
     "collectCoverage": true,
     "coveragePathIgnorePatterns": [
-        "<rootDir>/src/js/filt/filt.js"
+      "<rootDir>/src/js/filt/filt.js"
     ]
   },
   "dependencies": {
     "bootstrap": "^3.3.7",
     "classnames": "^2.2.5",
     "lodash": "^4.17.4",
-    "react": "^15.4.2",
     "prop-types": "^15.5.0",
+    "react": "^15.4.2",
     "react-codemirror": "^0.3.0",
     "react-dom": "^15.4.2",
     "react-redux": "^5.0.2",
     "redux": "^3.6.0",
     "redux-logger": "^2.8.1",
+    "redux-mock-store": "^1.2.3",
     "redux-thunk": "^2.2.0",
     "shallowequal": "^0.2.2"
   },

web/src/js/__tests__/urlStateSpec.js

@@ -3,64 +3,77 @@ import initialize from '../urlState'
 import reduceFlows from '../ducks/flows'
 import reduceUI from '../ducks/ui/index'
 import reduceEventLog from '../ducks/eventLog'
+import * as flowsActions from '../ducks/flows'
 
-import * as flowsAction from '../ducks/flows'
+import configureStore from 'redux-mock-store'
-import * as uiFlowAction from '../ducks/ui/flow'
-import * as eventLogAction from '../ducks/eventLog'
 
-import {createStore} from './ducks/tutils'
+const mockStore = configureStore()
-
-
-describe('test updateStoreFromUrl and updateUrlFromStore', () => {
-
-    let store = createStore({
-        flows: reduceFlows,
-        ui: reduceUI,
-        eventLog: reduceEventLog
-    })
 
+describe('updateStoreFromUrl', () => {
     history.replaceState = jest.fn()
+    let initialState = {
+            flows:    reduceFlows(undefined, {}),
+            ui:       reduceUI(undefined, {}),
+            eventLog: reduceEventLog(undefined, {})
+    }
 
     it('should handle search query', () => {
         window.location.hash = "#/flows?s=foo"
-        let setFilter = jest.spyOn(flowsAction, 'setFilter')
+        let store = mockStore(initialState)
-
         initialize(store)
-        expect(setFilter).toBeCalledWith('foo')
+        expect(store.getActions()).toEqual([{ filter: "foo", type: "FLOWS_SET_FILTER" }])
     })
 
     it('should handle highlight query', () => {
         window.location.hash = "#/flows?h=foo"
-        let setHighlight = jest.spyOn(flowsAction, 'setHighlight')
+        let store = mockStore(initialState)
-
         initialize(store)
-        expect(setHighlight).toBeCalledWith('foo')
+        expect(store.getActions()).toEqual([{ highlight: "foo", type: "FLOWS_SET_HIGHLIGHT" }])
     })
 
     it('should handle show event log', () => {
         window.location.hash = "#/flows?e=true"
-        let toggleVisibility = jest.spyOn(eventLogAction, 'toggleVisibility')
+        let store = mockStore(initialState)
-
         initialize(store)
-        expect(toggleVisibility).toHaveBeenCalled()
+        expect(store.getActions()).toEqual([{ type: "EVENTS_TOGGLE_VISIBILITY" }]) })
-    })
 
     it('should handle unimplemented query argument', () => {
         window.location.hash = "#/flows?foo=bar"
         console.error = jest.fn()
-
+        let store = mockStore(initialState)
         initialize(store)
         expect(console.error).toBeCalledWith("unimplemented query arg: foo=bar")
     })
 
     it('should select flow and tab', () => {
         window.location.hash = "#/flows/123/request"
-        let select      = jest.spyOn(flowsAction, 'select'),
+        let store = mockStore(initialState)
-            selectTab   = jest.spyOn(uiFlowAction, 'selectTab')
-
         initialize(store)
-        expect(select).toBeCalledWith('123')
+        expect(store.getActions()).toEqual([
-        expect(selectTab).toBeCalledWith('request')
+            {
+                flowIds: ["123"],
+                type: "FLOWS_SELECT"
+            },
+            {
+                tab: "request",
+                type: "UI_FLOWVIEW_SET_TAB"
+            }
+        ])
+    })
+})
+
+describe('updateUrlFromStore', () => {
+    history.replaceState = jest.fn()
+    let flows = reduceFlows(undefined, flowsActions.select(123)),
+    initialState = {
+        flows:    reduceFlows(flows, flowsActions.setFilter('~u foo')),
+        ui:       reduceUI(undefined, {}),
+        eventLog: reduceEventLog(undefined, {})
+    }
+
+    it('should update url', () => {
+        let store = mockStore(initialState)
+        initialize(store)
+        expect(history.replaceState).toBeCalledWith(undefined, '', '/#/flows/123/request?s=~u foo')
     })
-
 })

web/src/js/urlState.js

@@ -78,6 +78,6 @@ function updateUrlFromStore(store) {
 }
 
 export default function initialize(store) {
-    updateStoreFromUrl(store)
     store.subscribe(() => updateUrlFromStore(store))
+    updateStoreFromUrl(store)
 }

web/yarn.lock

@@ -1279,14 +1279,14 @@ content-type@~1.0.1:
   version "1.0.2"
   resolved "https://registry.yarnpkg.com/content-type/-/content-type-1.0.2.tgz#b7d113aee7a8dd27bd21133c4dc2529df1721eed"
 
-convert-source-map@1.X, convert-source-map@^1.2.0:
+convert-source-map@1.X, convert-source-map@^1.1.0, convert-source-map@~1.1.0:
-  version "1.4.0"
-  resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.4.0.tgz#e3dad195bf61bfe13a7a3c73e9876ec14a0268f3"
-
-convert-source-map@^1.1.0, convert-source-map@~1.1.0:
   version "1.1.3"
   resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.1.3.tgz#4829c877e9fe49b3161f3bf3673888e204699860"
 
+convert-source-map@^1.2.0:
+  version "1.4.0"
+  resolved "https://registry.yarnpkg.com/convert-source-map/-/convert-source-map-1.4.0.tgz#e3dad195bf61bfe13a7a3c73e9876ec14a0268f3"
+
 core-js@^1.0.0:
   version "1.2.7"
   resolved "https://registry.yarnpkg.com/core-js/-/core-js-1.2.7.tgz#652294c14651db28fa93bd2d5ff2983a4f08c636"
@@ -1860,7 +1860,7 @@ fb-watchman@^2.0.0:
   dependencies:
     bser "^2.0.0"
 
-fbjs@^0.8.1, fbjs@^0.8.4:
+fbjs@^0.8.1, fbjs@^0.8.4, fbjs@^0.8.9:
   version "0.8.9"
   resolved "https://registry.yarnpkg.com/fbjs/-/fbjs-0.8.9.tgz#180247fbd347dcc9004517b904f865400a0c8f14"
   dependencies:
@@ -2461,14 +2461,10 @@ https-browserify@~0.0.0:
   version "0.0.1"
   resolved "https://registry.yarnpkg.com/https-browserify/-/https-browserify-0.0.1.tgz#3f91365cabe60b77ed0ebba24b454e3e09d95a82"
 
-iconv-lite@0.4.13:
+iconv-lite@0.4.13, iconv-lite@~0.4.13:
   version "0.4.13"
   resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.13.tgz#1f88aba4ab0b1508e8312acc39345f36e992e2f2"
 
-iconv-lite@~0.4.13:
-  version "0.4.15"
-  resolved "https://registry.yarnpkg.com/iconv-lite/-/iconv-lite-0.4.15.tgz#fe265a218ac6a57cfe854927e9d04c19825eddeb"
-
 ieee754@^1.1.4:
   version "1.1.8"
   resolved "https://registry.yarnpkg.com/ieee754/-/ieee754-1.1.8.tgz#be33d40ac10ef1926701f6f08a2d86fbfd1ad3e4"
@@ -4068,6 +4064,12 @@ promise@^7.1.1:
   dependencies:
     asap "~2.0.3"
 
+prop-types@^15.5.0:
+  version "15.5.8"
+  resolved "https://registry.yarnpkg.com/prop-types/-/prop-types-15.5.8.tgz#6b7b2e141083be38c8595aa51fc55775c7199394"
+  dependencies:
+    fbjs "^0.8.9"
+
 prr@~0.0.0:
   version "0.0.0"
   resolved "https://registry.yarnpkg.com/prr/-/prr-0.0.0.tgz#1a84b85908325501411853d0081ee3fa86e2926a"
@@ -4289,6 +4291,10 @@ redux-logger@^2.8.1:
   dependencies:
     deep-diff "0.3.4"
 
+redux-mock-store@^1.2.3:
+  version "1.2.3"
+  resolved "https://registry.yarnpkg.com/redux-mock-store/-/redux-mock-store-1.2.3.tgz#1b3ad299da91cb41ba30d68e3b6f024475fb9e1b"
+
 redux-thunk@^2.2.0:
   version "2.2.0"
   resolved "https://registry.yarnpkg.com/redux-thunk/-/redux-thunk-2.2.0.tgz#e615a16e16b47a19a515766133d1e3e99b7852e5"