parse json in settings

src/background/components/background.js

@@ -22,15 +22,7 @@ export default class BackgroundComponent {
   }
 
   update() {
-    let state = this.store.getState();
-    this.updateSettings(state);
-  }
-
-  updateSettings(setting) {
-    if (!setting.settings.json) {
-      return;
-    }
-    this.settings = JSON.parse(setting.settings.json);
+    this.settings = this.store.getState();
   }
 
   onMessage(message, sender) {
@@ -58,7 +50,7 @@ export default class BackgroundComponent {
         });
       });
     case messages.SETTINGS_QUERY:
-      return Promise.resolve(this.store.getState().settings);
+      return Promise.resolve(this.store.getState().value);
     case messages.CONSOLE_QUERY_COMPLETIONS:
       return commands.complete(message.text, this.settings);
     case messages.SETTINGS_RELOAD:

src/content/index.js

@@ -34,8 +34,7 @@ const reloadSettings = () => {
   return browser.runtime.sendMessage({
     type: messages.SETTINGS_QUERY,
   }).then((settings) => {
-    let keymaps = JSON.parse(settings.json).keymaps;
-    store.dispatch(inputActions.setKeymaps(keymaps));
+    store.dispatch(inputActions.setKeymaps(settings.keymaps));
   });
 };
 

src/settings/actions/setting.js

@@ -4,8 +4,9 @@ import DefaultSettings from 'shared/default-settings';
 
 const load = () => {
   return browser.storage.local.get('settings').then((value) => {
-    if (value.settings) {
-      return set(value.settings);
+    let settings = value.settings;
+    if (settings) {
+      return set(settings);
     }
     return set(DefaultSettings);
   }, console.error);
@@ -13,7 +14,7 @@ const load = () => {
 
 const save = (settings) => {
   return browser.storage.local.set({
-    settings
+    settings,
   }).then(() => {
     return browser.runtime.sendMessage({
       type: messages.SETTINGS_RELOAD
@@ -24,8 +25,9 @@ const save = (settings) => {
 const set = (settings) => {
   return {
     type: actions.SETTING_SET_SETTINGS,
-    settings,
+    json: settings.json,
+    value: JSON.parse(settings.json),
   };
 };
 
-export { load, save, set };
+export { load, save };

src/settings/components/setting.js

@@ -35,11 +35,12 @@ export default class SettingComponent {
   }
 
   update() {
-    let { settings } = this.store.getState();
+    let settings = this.store.getState();
 
     let doc = this.wrapper.ownerDocument;
     let form = doc.getElementById('vimvixen-settings-form');
     let plainJsonInput = form.elements['plain-json'];
     plainJsonInput.value = settings.json;
+
   }
 }

src/settings/reducers/setting.js

@@ -1,15 +1,17 @@
 import actions from 'settings/actions';
 
 const defaultState = {
-  settings: {}
+  json: '',
+  value: {}
 };
 
 export default function reducer(state = defaultState, action = {}) {
   switch (action.type) {
   case actions.SETTING_SET_SETTINGS:
-    return Object.assign({}, state, {
-      settings: action.settings,
-    });
+    return {
+      json: action.json,
+      value: action.value,
+    };
   default:
     return state;
   }

test/settings/reducers/setting.test.js

@@ -5,18 +5,18 @@ import settingReducer from 'settings/reducers/setting';
 describe("setting reducer", () => {
   it('return the initial state', () => {
     let state = settingReducer(undefined, {});
-    expect(state).to.have.deep.property('settings', {});
+    expect(state).to.have.deep.property('json', '');
+    expect(state).to.have.deep.property('value', {});
   });
 
   it('return next state for SETTING_SET_SETTINGS', () => {
     let action = {
       type: actions.SETTING_SET_SETTINGS,
-      settings: { value1: 'hello', value2: 'world' },
+      json: '{ "key": "value" }',
+      value: { key: 123 },
     };
     let state = settingReducer(undefined, action);
-    expect(state).to.have.deep.property('settings', {
-      value1: 'hello',
-      value2: 'world',
-    });
+    expect(state).to.have.deep.property('json', '{ "key": "value" }');
+    expect(state).to.have.deep.property('value', { key: 123 });
   });
 });