Fix parsing payload in devpanel

Author: zalmoxisus

src/browser/extension/background/messaging.js

@@ -1,5 +1,5 @@
 import { onConnect, onMessage, sendToTab } from 'crossmessaging';
-import { parse } from 'circular-json';
+import parseJSON from '../utils/parseJSON';
 import syncOptions from '../options/syncOptions';
 import createMenu from './contextMenus';
 import openDevToolsWindow from './openWindow';
@@ -22,15 +22,6 @@ onConnect((tabId) => {
   };
 }, {}, connections);
 
-function parseJSON(data) {
-  try {
-    return parse(data);
-  } catch (e) {
-    // console.error(data + 'is not a valid JSON', e);
-    return null;
-  }
-}
-
 // Receive message from content script and relay to the devTools page
 function messaging(request, sender, sendResponse) {
   const tabId = sender.tab ? sender.tab.id : sender.id;
@@ -63,15 +54,15 @@ function messaging(request, sender, sendResponse) {
       return true;
     }
 
-    const payload = typeof request.payload === 'string' ? parseJSON(request.payload) : request.payload;
+    const payload = parseJSON(request.payload);
     if (!payload) return true;
     store.liftedStore.setState(payload);
     if (request.init) {
       store.id = tabId;
       createMenu(sender.url, tabId);
     }
     if (tabId in connections) {
-      connections[ tabId ].postMessage({payload: payload});
+      connections[tabId].postMessage({ payload: request.payload });
     }
 
     // Notify when errors occur in the app

src/browser/extension/devpanel/index.js

@@ -3,6 +3,7 @@ import React from 'react';
 import { render } from 'react-dom';
 import DevTools from '../../../app/containers/DevTools';
 import createDevStore from '../../../app/store/createDevStore';
+import parseJSON from '../utils/parseJSON';
 
 const backgroundPageConnection = connect();
 
@@ -39,7 +40,9 @@ backgroundPageConnection.onMessage.addListener((message) => {
     );
     rendered = false;
   } else if (message.payload) {
-    store.liftedStore.setState(message.payload);
+    const payload = parseJSON(message.payload);
+    if (!payload) return;
+    store.liftedStore.setState(payload);
     showDevTools();
   } else if (message.action) {
     dispatch(message.action);

src/browser/extension/utils/parseJSON.js

@@ -0,0 +1,11 @@
+import { parse } from 'circular-json';
+
+export default function parseJSON(data) {
+  if (typeof data !== 'string') return data;
+  try {
+    return parse(data);
+  } catch (e) {
+    if (process.env.NODE_ENV !== 'production') console.error(data + 'is not a valid JSON', e);
+    return null;
+  }
+}