Correctly detect changes to background state (#8435)

Changes to the background state were being detected in the `update`
event handler in `ui/index.js` that receives state updates from the
background. However this doesn't catch every update; some state
changes are received by the UI in-between these `update` events.

The background `getState` function is callable directly from the UI,
and many action creators call it via `forceUpdateMetamaskState` to
update the `metamask` state immediately without waiting for the next
`update` event. These state updates skip this change detection in
`ui/index.js`.

For example, if a 3Box state restoration resulted in a `currentLocale`
change, and then a `forceUpdateMetamaskState` call completed before the
next `update `event was received, then `updateCurrentLocale` wouldn't
be called, and the `locale` store would not be updated correctly with
the localized messages for the new locale.

We now check for background state changes in the `updateMetamaskState`
action creator. All `metamask` state updates go through this function,
so we aren't missing any changes anymore.

test/unit/actions/tx_test.js

@@ -35,7 +35,7 @@ describe('tx confirmation screen', function () {
           cb()
         },
         getState (cb) {
-          cb()
+          cb(null, {})
         },
       })
 

ui/app/store/actions.js

@@ -1086,9 +1086,20 @@ export function unlockSucceeded (message) {
 }
 
 export function updateMetamaskState (newState) {
-  return {
+  return (dispatch, getState) => {
+    const { metamask: currentState } = getState()
+
+    const { currentLocale } = currentState
+    const { currentLocale: newLocale } = newState
+
+    if (currentLocale && newLocale && currentLocale !== newLocale) {
+      dispatch(updateCurrentLocale(newLocale))
+    }
+
+    dispatch({
       type: actionConstants.UPDATE_METAMASK_STATE,
       value: newState,
+    })
   }
 }
 

ui/index.js

@@ -76,14 +76,6 @@ async function startApp (metamaskState, backgroundConnection, opts) {
   }
 
   backgroundConnection.on('update', function (metamaskState) {
-    const currentState = store.getState()
-    const { currentLocale } = currentState.metamask
-    const { currentLocale: newLocale } = metamaskState
-
-    if (currentLocale && newLocale && currentLocale !== newLocale) {
-      store.dispatch(actions.updateCurrentLocale(newLocale))
-    }
-
     store.dispatch(actions.updateMetamaskState(metamaskState))
   })