]> git.ipfire.org Git - thirdparty/vuejs/pinia.git/commitdiff
fix(types): pass custom properties to stores
authorEduardo San Martin Morote <posva13@gmail.com>
Wed, 31 Mar 2021 10:05:55 +0000 (12:05 +0200)
committerEduardo San Martin Morote <posva13@gmail.com>
Wed, 31 Mar 2021 10:05:55 +0000 (12:05 +0200)
__tests__/storePlugins.spec.ts
docs/introduction.md
src/index.ts
src/rootStore.ts
src/store.ts
src/types.ts

index fbfca39ffe6ce8a4c427add5a482c99c8b905c01..25508c742d4f6b72f82d34603ca78971425666b5 100644 (file)
@@ -11,7 +11,21 @@ declare module '../src' {
 }
 
 describe('store plugins', () => {
-  const useStore = defineStore({ id: 'test' })
+  const useStore = defineStore({
+    id: 'test',
+
+    actions: {
+      incrementN() {
+        return this.n++
+      },
+    },
+
+    getters: {
+      doubleN() {
+        return this.n * 2
+      },
+    },
+  })
   it('adds properties to stores', () => {
     const pinia = createPinia()
 
@@ -26,6 +40,8 @@ describe('store plugins', () => {
 
     expect(store.n).toBe(20)
     expect(store.uid).toBeDefined()
+    // @ts-expect-error: n is a number
+    store.n.notExisting
   })
 
   it('can install plugins before installing pinia', () => {
@@ -44,4 +60,33 @@ describe('store plugins', () => {
     expect(store.uid).toBeDefined()
     expect(store.hasApp).toBe(true)
   })
+
+  it('can be used in actions', () => {
+    const pinia = createPinia()
+
+    // must call use after installing the plugin
+    pinia.use(() => {
+      return { n: 20 }
+    })
+
+    mount({ template: 'none' }, { global: { plugins: [pinia] } })
+
+    const store = useStore(pinia)
+
+    expect(store.incrementN()).toBe(20)
+  })
+
+  it('can be used in getters', () => {
+    const pinia = createPinia()
+
+    // must call use after installing the plugin
+    pinia.use(() => {
+      return { n: 20 }
+    })
+
+    mount({ template: 'none' }, { global: { plugins: [pinia] } })
+
+    const store = useStore(pinia)
+    expect(store.doubleN).toBe(40)
+  })
 })
index d9f5a70fb6f1350cbd4dfdd826ae0cd4c9f99f42..46bcea17885b62320f77dc5045935fb3c728f717 100644 (file)
@@ -83,3 +83,5 @@ export const todos = defineStore({
   },
 })
 ```
+
+## Comparison with other
index 2db614d86392d3d95c3dd2f815425b0af7708363..718d9f8e57ab5f4a8342e1a8f5221f5ba964e627 100644 (file)
@@ -3,7 +3,6 @@ export {
   createPinia,
   Pinia,
   PiniaStorePlugin,
-  PiniaCustomProperties,
 } from './rootStore'
 export { defineStore } from './store'
 export {
@@ -12,6 +11,7 @@ export {
   StoreWithGetters,
   StoreWithActions,
   StoreWithState,
+  PiniaCustomProperties,
 } from './types'
 
 // TODO: remove in beta
index 9ca316aa098c551be5b4848dfa9651225231ab27..492d755dcba0edf493ac18e4e628b25a16312bc0 100644 (file)
@@ -1,6 +1,11 @@
 import { App, InjectionKey, Plugin, Ref, ref, warn } from 'vue'
 import { IS_CLIENT } from './env'
-import { StateTree, StoreWithState, StateDescriptor } from './types'
+import {
+  StateTree,
+  StoreWithState,
+  StateDescriptor,
+  PiniaCustomProperties,
+} from './types'
 
 /**
  * setActivePinia must be called to handle SSR at the top of functions like
@@ -148,8 +153,3 @@ export function createPinia(): Pinia {
 
   return pinia
 }
-
-/**
- * Properties that are added to every store by `pinia.use()`
- */
-export interface PiniaCustomProperties {}
index 4b6a2a4abf27acef8e190ef4e8f3e15f9a72dbf9..bbc83308af44fe3425528e9a3cd8c386fecd77b9 100644 (file)
@@ -10,6 +10,7 @@ import {
   StoreWithActions,
   StateDescriptor,
   Method,
+  PiniaCustomProperties,
 } from './types'
 import {
   getActivePinia,
@@ -18,7 +19,6 @@ import {
   getClientApp,
   piniaSymbol,
   Pinia,
-  PiniaCustomProperties,
 } from './rootStore'
 import { addDevtools } from './devtools'
 import { IS_CLIENT } from './env'
@@ -247,9 +247,16 @@ export function defineStore<
 >(options: {
   id: Id
   state?: () => S
-  getters?: G & ThisType<S & StoreWithGetters<G>>
+  getters?: G & ThisType<S & StoreWithGetters<G> & PiniaCustomProperties>
   // allow actions use other actions
-  actions?: A & ThisType<A & S & StoreWithState<Id, S> & StoreWithGetters<G>>
+  actions?: A &
+    ThisType<
+      A &
+        S &
+        StoreWithState<Id, S> &
+        StoreWithGetters<G> &
+        PiniaCustomProperties
+    >
 }) {
   const { id, state, getters, actions } = options
 
index eee9dd3a3deedd3c44b85c56a899b4bac11badb4..9e72b1444a0b9bb309b83d7f346e29e46280b319 100644 (file)
@@ -136,7 +136,11 @@ export type Store<
   S extends StateTree,
   G,
   A
-> = StoreWithState<Id, S> & S & StoreWithGetters<G> & StoreWithActions<A>
+> = StoreWithState<Id, S> &
+  S &
+  StoreWithGetters<G> &
+  StoreWithActions<A> &
+  PiniaCustomProperties
 
 /**
  * Generic store type
@@ -147,3 +151,8 @@ export type GenericStore = Store<
   Record<string, Method>,
   Record<string, Method>
 >
+
+/**
+ * Properties that are added to every store by `pinia.use()`
+ */
+export interface PiniaCustomProperties {}