Pinia state undefined in vue dev tools

Reproduction

Yes

Steps to reproduce the bug

Defined store with following:

import { defineStore } from 'pinia';

export const useUsersStore = defineStore({
  id: 'user',
  state: (): UserState => ({
    user: {} as User,
  }),
  getters: {
    token: (state) => state.user.token,
  },
  actions: {
    async addUserToken(token: string | null) {
      this.user = { token: token };
    },
  },
});

Access the store in component

const usersStore = useUsersStore();
const { user } = storeToRefs(usersStore);

Open dev tools

Expected behavior

I expect the store state to be visible in the dev tools.

Actual behavior

The _custom object contains the values, however it doesn’t look like it works as expected.

Additional information

No response

[CreativeWarlock]

On a side note, the property of a state also becomes undefined when you a) use a getter method has the same name as one of the props defined in the state, b) use async modifier at the state definition, like so: async state: () => { let userId = await axios.get('urlToMyFancyUserService') return { id: userId } },

[bartduisters]

@posva The reproduction is posted in my previous comment. Is it sufficient?