MitsuhaKitsune / vuex-webextensions

A Vuex plugin to share store through webextensions components
MIT License
83 stars 30 forks source link

Dont work in Firefox, after extension is reloaded #31

Closed Rightusername closed 3 years ago

Rightusername commented 4 years ago

Firefox version: 76.0.1 OS: windows 10 64-bit

import Vue from 'vue';
import Vuex from 'vuex';
import VuexWebExtensions from 'vuex-webextensions';

import { STORAGE } from './../background/storage';

Vue.use(Vuex);

export default new Vuex.Store({
  plugins: [
    VuexWebExtensions({
      persistentStates: ['storage'],
      ignoredMutations: ['SET_CLOCK'],
      syncActions: false,
      loggerLevel: 'debug',
    }),
  ],
  state: {
    storage: STORAGE,
    isClock: false,
  },

...

After reloading extension or turn off/on, "storage" object is undefined In Chrome and Edge it works fine

RomainLK commented 3 years ago

I had to investigate this for my extension and I have found that the function browser.storage.local.set of Firefox doesn't work properly when giving the state of the store. I think it just doesn't support the proxy which Vue uses for the reactivity of its object. My solution was to modify the library and add a JSON.stringify followed by JSON.parse

browser.js:

else if (this.browser == browsers.firefox) {
      try {
        browser.storage.local.set({
          '@@vwe-persistence': JSON.parse(JSON.stringify(datas))
        });
      } catch (err) {
        Logger.error(`Can't write persistent states to local storage. Did you grant storage permission to your WebExtension?`);
      }
MitsuhaKitsune commented 3 years ago

I should investigate it, on the past, I remove any extra serialization because Firefox handle it automatically and just do redundant steps decreasing the performance of the plugin.

MitsuhaKitsune commented 3 years ago

On my investigation, seems related with issue #29, I still debugging and trying to fix this, we continue this on issue #29