From: Eduardo San Martin Morote <posva13@gmail.com>
Date: Thu, 17 Jun 2021 10:57:11 +0000 (+0200)
Subject: docs: note about custom properties in devtools
X-Git-Tag: v2.0.0-beta.3~1
X-Git-Url: http://git.ipfire.org/cgi-bin/gitweb.cgi?a=commitdiff_plain;h=872a351bfae50540d112a7fc4970a41e0fed9a6b;p=thirdparty%2Fvuejs%2Fpinia.git

docs: note about custom properties in devtools
---

diff --git a/docs/core-concepts/plugins.md b/docs/core-concepts/plugins.md
index 9a0676cf..3d4776a1 100644
--- a/docs/core-concepts/plugins.md
+++ b/docs/core-concepts/plugins.md
@@ -53,7 +53,7 @@ You can add properties to every store by simply returning an object of them in a
 pinia.use(() => ({ hello: 'world' }))
 ```
 
-You can also set the property directly on the `store`:
+You can also set the property directly on the `store` but **if possible use the return version so they can be automatically tracked by devtools**:
 
 ```js
 pinia.use(({ store }) => {
@@ -108,6 +108,17 @@ pinia.use(({ store }) => {
 })
 ```
 
+Any property _returned_ by a plugin will be automatically tracked by devtools so in order to make `hasError` visible in devtools, make sure to add it to `store._customProperties` **in dev mode only** if you want to debug it in devtools:
+
+```js
+// from the example above
+pinia.use(({ store }) => {
+  store.$state.secret = globalSecret
+  store.secret = globalSecret
+  store._customProperties.add('secret')
+})
+```
+
 :::warning
 If you are using **Vue 2**, Pinia is subject to the [same reactivity caveats](https://vuejs.org/v2/guide/reactivity.html#Change-Detection-Caveats) as Vue. You will need to use `set` from `@vue/composition-api`: