Error while using the library with Vuex in Quasar App

[sandeeppsmys]

Mutations are called when used with Store

My code looks like this..

[In App.vue]

import VueSocketio from 'vue-socket.io-extended'
import io from 'socket.io-client'
import store from './store'
Vue.use(VueSocketio, io(`http://${window.location.hostname}`), { store });

My mutation is like this in my store's mutations

SOCKET_message (state, data) {
    console.log(data)
  }

From the server, we are emitting ('message', data)
Please be noted that I am using Quasar and initializing it in App.vue. Works fine with components but not with Vuex store.

[probil]

Hi @sandeeppsmys
your mutation should look like so

SOCKET_MESSAGE (state, data) {  // everything is in upper case
   console.log(data)
}

Can you try that?

[sandeeppsmys]

Thanks Probil for the quick response.

Yeah I tried that one too.. But not getting mutated on the store.

Here is my store

export default function (/* { ssrContext } */) {
  const Store = new Vuex.Store({
    modules: {
      notificationManager
    },
    state: {
    },
    mutations: {
      SOCKET_MESSAGE (state, data) {
        console.log('SOCKET_MESSAGE')
        console.log(data)
      }
    },
    actions: {
      socket_message (context, data) {
        console.log('action SOCKET_MESSAGE')
        console.log(data)
      }
    },

    // enable strict mode (adds overhead!)
    // for dev mode only
    // strict: process.env.DEV
    strict: false
  })

  return Store
}

Please note that I am using a module 'notificationManager' and I tried placing the mutations there also but no luck.

[probil]

Hi @sandeeppsmys

Are you using server side rendering?
Are you sure path to socket io client is correct and connection with BE server is established?
Is there any errors in console?

[sandeeppsmys]

I am using Quasar Development Server locally.
Yeah socket connection is established and also it works fine within the component using sockets{}
No errors on the console. It is just not calling the mutation.

[probil]

@sandeeppsmys Can you show me how do you trigger socket event on the server?

[sandeeppsmys]

Service is in python.. Following line emits the socket event.
socketio.emit("delete_event", {"id": '12'})
I can receive it on the UI. But it is not just directly calling the mutation..

[probil]

@sandeeppsmys Then mutation should look like this:

SOCKET_DELETE_EVENT (state, data) {
   console.log(data); // prints -> {"id": '12'} 
}

[probil]

@sandeeppsmys If it doesn't help, can you please create a repo with a minimal reproduction of the bug? I'd like to resolve it

[badders]

Getting exactly the same issue, no socket mutation calls are working, but directly listending to the message on a component is fine

[probil]

Hi @badders 👋

Sound strange 🤔

Can you please create a repo with bug reproduction? I will be a HUGE step ahead.
I will be glad to fix!

[KodeStar]

@probil I think if you just install a base quasar build and select vuex during installation that will give you what you need https://quasar.dev/quasar-cli/cli-documentation/vuex-store