Skip to content

Commit 65e9246

Browse files
author
Guillaume Chau
committed
feat(vuex): inspect specific module
1 parent bb75e3f commit 65e9246

File tree

6 files changed

+121
-22
lines changed

6 files changed

+121
-22
lines changed

‎package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -57,4 +57,4 @@
5757
"engines": {
5858
"node": ">=8.10"
5959
}
60-
}
60+
}

‎packages/app-backend/src/vuex.js

Lines changed: 4 additions & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -342,7 +342,10 @@ class VuexBackend {
342342
stringifyStore () {
343343
return stringify({
344344
state: this.store.state,
345-
getters: getCatchedGetters(this.store)
345+
getters: getCatchedGetters(this.store),
346+
modules: Object.keys(this.store._modulesNamespaceMap)
347+
.map(m => m.substr(0, m.length - 1))
348+
.sort()
346349
})
347350
}
348351

‎packages/app-frontend/package.json

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -3,7 +3,7 @@
33
"version": "0.0.0",
44
"private": true,
55
"dependencies": {
6-
"@vue/ui": "^0.10.5",
6+
"@vue/ui": "^0.11.5",
77
"@vue-devtools/shared-utils": "^0.0.0",
88
"circular-json-es6": "^2.0.2",
99
"d3": "^5.9.2",

‎packages/app-frontend/src/views/vuex/VuexStateInspector.vue

Lines changed: 24 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -8,6 +8,14 @@
88
placeholder="Filter inspected state"
99
>
1010
</div>
11+
<VueTypeAhead
12+
:value="inspectedModule"
13+
:suggestions="moduleSuggestions"
14+
placeholder="(Root)"
15+
show-all
16+
restrict-choice
17+
@update="value => setInspectedModule(value)"
18+
/>
1119
<a
1220
v-tooltip="'Export Vuex State'"
1321
class="button export"
@@ -114,7 +122,7 @@ import StateInspector from '@front/components/StateInspector.vue'
114122
import { searchDeepInObject, sortByKey, stringify, parse } from '@utils/util'
115123
import debounce from 'lodash/debounce'
116124
import groupBy from 'lodash/groupBy'
117-
import { mapState, mapGetters, mapActions } from 'vuex'
125+
import { mapState, mapGetters, mapActions, mapMutations } from 'vuex'
118126
119127
export default {
120128
components: {
@@ -145,13 +153,15 @@ export default {
145153
...mapState('vuex', [
146154
'activeIndex',
147155
'inspectedIndex',
148-
'lastReceivedState'
156+
'lastReceivedState',
157+
'inspectedModule'
149158
]),
150159
151160
...mapGetters('vuex', [
152161
'inspectedState',
153162
'filteredHistory',
154-
'inspectedEntry'
163+
'inspectedEntry',
164+
'modules'
155165
]),
156166
157167
filteredState () {
@@ -214,6 +224,13 @@ export default {
214224
215225
isActive () {
216226
return this.activeIndex === this.inspectedIndex
227+
},
228+
229+
moduleSuggestions () {
230+
return [
231+
{ value: null, label: '(Root)' },
232+
...this.modules.map(m => ({ value: m }))
233+
]
217234
}
218235
},
219236
@@ -249,6 +266,10 @@ export default {
249266
},
250267
251268
methods: {
269+
...mapMutations('vuex', {
270+
setInspectedModule: 'INSPECTED_MODULE'
271+
}),
272+
252273
...mapActions('vuex', [
253274
'inspect'
254275
]),

‎packages/app-frontend/src/views/vuex/module.js

Lines changed: 30 additions & 3 deletions
Original file line numberDiff line numberDiff line change
@@ -1,4 +1,4 @@
1-
import { parse } from '@utils/util'
1+
import { parse, get } from '@utils/util'
22
import * as actions from './actions'
33
import { snapshotsCache } from './cache'
44
import SharedData from '@utils/shared-data'
@@ -20,7 +20,8 @@ const state = {
2020
filterRegex: ANY_RE,
2121
filterRegexInvalid: false,
2222
inspectedState: null,
23-
lastReceivedState: null
23+
lastReceivedState: null,
24+
inspectedModule: null
2425
}
2526

2627
const mutations = {
@@ -106,6 +107,10 @@ const mutations = {
106107
state.filterRegexInvalid = false
107108
state.filterRegex = new RegExp(escapeStringForRegExp(filter), 'i')
108109
}
110+
},
111+
112+
'INSPECTED_MODULE' (state, module) {
113+
state.inspectedModule = module
109114
}
110115
}
111116

@@ -122,7 +127,7 @@ function escapeStringForRegExp (str) {
122127
}
123128

124129
const getters = {
125-
inspectedState ({ base, inspectedIndex, inspectedState }, getters) {
130+
inspectedState ({ base, inspectedIndex, inspectedState, inspectedModule }, getters) {
126131
const entry = getters.filteredHistory[inspectedIndex]
127132
const res = {}
128133

@@ -137,6 +142,19 @@ const getters = {
137142
if (data) {
138143
res.state = data.state
139144
res.getters = data.getters
145+
146+
if (inspectedModule) {
147+
res.state = get(res.state, inspectedModule.replace(/\//g, '.'))
148+
149+
if (res.getters) {
150+
res.getters = Object.keys(res.getters)
151+
.filter(key => key.startsWith(inspectedModule))
152+
.reduce((obj, key) => {
153+
obj[key.substr(inspectedModule.length + 1)] = res.getters[key]
154+
return obj
155+
}, {})
156+
}
157+
}
140158
}
141159

142160
if (SharedData.vuexGroupGettersByModule && res.getters) {
@@ -177,6 +195,15 @@ const getters = {
177195

178196
inspectedEntry ({ inspectedIndex }, { filteredHistory }) {
179197
return filteredHistory[inspectedIndex]
198+
},
199+
200+
modules ({ base, inspectedIndex, inspectedState }, getters) {
201+
const entry = getters.filteredHistory[inspectedIndex]
202+
const data = entry ? inspectedState : base
203+
if (data) {
204+
return data.modules
205+
}
206+
return []
180207
}
181208
}
182209

‎yarn.lock

Lines changed: 61 additions & 13 deletions
Original file line numberDiff line numberDiff line change
@@ -119,6 +119,11 @@
119119
resolved "https://registry.yarnpkg.com/@types/node/-/node-12.11.7.tgz#57682a9771a3f7b09c2497f28129a0462966524a"
120120
integrity sha512-JNbGaHFCLwgHn/iCckiGSOZ1XYHsKFwREtzPwSGCVld1SGhOlmZw2D4ZI94HQCrBHbADzW9m4LER/8olJTRGHA==
121121

122+
"@types/[email protected]":
123+
version "2.3.2"
124+
resolved "https://registry.yarnpkg.com/@types/sizzle/-/sizzle-2.3.2.tgz#a811b8c18e2babab7d542b3365887ae2e4d9de47"
125+
integrity sha512-7EJYyKTL7tFR8+gDbB6Wwz/arpGa0Mywk1TJbNzKzHtzbwVmY4HR9WqS5VV7dsBUKQmPNr192jHr/VpBluj/hg==
126+
122127
"@vue/component-compiler-utils@^3.0.0":
123128
version "3.0.0"
124129
resolved "https://registry.yarnpkg.com/@vue/component-compiler-utils/-/component-compiler-utils-3.0.0.tgz#d16fa26b836c06df5baaeb45f3d80afc47e35634"
@@ -134,13 +139,13 @@
134139
source-map "~0.6.1"
135140
vue-template-es2015-compiler "^1.9.0"
136141

137-
"@vue/ui@^0.10.5":
138-
version "0.10.5"
139-
resolved "https://registry.yarnpkg.com/@vue/ui/-/ui-0.10.5.tgz#e20e71e42ad83e4632c34d51473d71b5b6cfa15e"
140-
integrity sha512-MfVCDKttQKcpIp1ibf41esIU7NqDGB1K+998rbrj9Mef61dGHdBww1K7UiH9nFcVzV/ej55p6s3Kic+MuSBYgA==
142+
"@vue/ui@^0.11.5":
143+
version "0.11.6"
144+
resolved "https://registry.yarnpkg.com/@vue/ui/-/ui-0.11.6.tgz#4b249774812e0025812adeb74b7078a4be43dfaf"
145+
integrity sha512-wYM3j3+mY7VcfpRNRMVXMwPjYHmYy90TDbOi5RXA7Vj3E0fkX9Pd+Mb0KxMmcIbIfWNJVTBzCFX6uzI0nBWCyg==
141146
dependencies:
142147
focus-visible "^4.1.5"
143-
v-tooltip "^3.0.0-alpha.10"
148+
v-tooltip "^3.0.0-alpha.11"
144149
vue-resize "^0.4.5"
145150

146151
"@webassemblyjs/[email protected]":
@@ -1341,9 +1346,9 @@ core-js@^2.6.5:
13411346
integrity sha512-I39t74+4t+zau64EN1fE5v2W31Adtc/REhzWN+gWRRXg6WH5qAsZm62DHpQ1+Yhe4047T55jvzz7MUqF/dBBlA==
13421347

13431348
core-js@^3.3.3:
1344-
version "3.3.4"
1345-
resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.3.4.tgz#6b0a23392958317bfb46e40b090529a923add669"
1346-
integrity sha512-BtibooaAmSOptGLRccsuX/dqgPtXwNgqcvYA6kOTTMzonRxZ+pJS4e+6mvVutESfXMeTnK8m3M+aBu3bkJbR+w==
1349+
version "3.3.5"
1350+
resolved "https://registry.yarnpkg.com/core-js/-/core-js-3.3.5.tgz#58d20f48a95a07304b62ff752742b82b56431ed8"
1351+
integrity sha512-0J3K+Par/ZydhKg8pEiTcK/9d65/nqJOzY62uMkjeBmt05fDOt/khUVjDdh8TpeIuGQDy1yLDDCjiWN/8pFIuw==
13471352

13481353
[email protected], core-util-is@~1.0.0:
13491354
version "1.0.2"
@@ -1503,7 +1508,7 @@ cyclist@^1.0.1:
15031508
resolved "https://registry.yarnpkg.com/cyclist/-/cyclist-1.0.1.tgz#596e9698fd0c80e12038c2b82d6eb1b35b6224d9"
15041509
integrity sha1-WW6WmP0MgOEgOMK4LW6xs1tiJNk=
15051510

1506-
cypress@=3.4.1, cypress@^3.1.0:
1511+
cypress@=3.4.1:
15071512
version "3.4.1"
15081513
resolved "https://registry.yarnpkg.com/cypress/-/cypress-3.4.1.tgz#ca2e4e9864679da686c6a6189603efd409664c30"
15091514
integrity sha512-1HBS7t9XXzkt6QHbwfirWYty8vzxNMawGj1yI+Fu6C3/VZJ8UtUngMW6layqwYZzLTZV8tiDpdCNBypn78V4Dg==
@@ -1539,6 +1544,44 @@ cypress@=3.4.1, cypress@^3.1.0:
15391544
url "0.11.0"
15401545
yauzl "2.10.0"
15411546

1547+
cypress@^3.1.0:
1548+
version "3.5.0"
1549+
resolved "https://registry.yarnpkg.com/cypress/-/cypress-3.5.0.tgz#e188bc8f48782953f6865d8830a4dc342334b81c"
1550+
integrity sha512-I1iSReD2C8CTP6s4BvQky4gEqHBnKLmhBIqFyCUZdj6BQ6ZDxGnmIbQPM5g79E2iP60KTIbTK99ZPSDVtsNUUg==
1551+
dependencies:
1552+
"@cypress/listr-verbose-renderer" "0.4.1"
1553+
"@cypress/xvfb" "1.2.4"
1554+
"@types/sizzle" "2.3.2"
1555+
arch "2.1.1"
1556+
bluebird "3.5.0"
1557+
cachedir "1.3.0"
1558+
chalk "2.4.2"
1559+
check-more-types "2.24.0"
1560+
commander "2.15.1"
1561+
common-tags "1.8.0"
1562+
debug "3.2.6"
1563+
execa "0.10.0"
1564+
executable "4.1.1"
1565+
extract-zip "1.6.7"
1566+
fs-extra "5.0.0"
1567+
getos "3.1.1"
1568+
is-ci "1.2.1"
1569+
is-installed-globally "0.1.0"
1570+
lazy-ass "1.6.0"
1571+
listr "0.12.0"
1572+
lodash "4.17.15"
1573+
log-symbols "2.2.0"
1574+
minimist "1.2.0"
1575+
moment "2.24.0"
1576+
ramda "0.24.1"
1577+
request "2.88.0"
1578+
request-progress "3.0.0"
1579+
supports-color "5.5.0"
1580+
tmp "0.1.0"
1581+
untildify "3.0.3"
1582+
url "0.11.0"
1583+
yauzl "2.10.0"
1584+
15421585
d3-array@1, d3-array@^1.1.1, d3-array@^1.2.0:
15431586
version "1.2.4"
15441587
resolved "https://registry.yarnpkg.com/d3-array/-/d3-array-1.2.4.tgz#635ce4d5eea759f6f605863dbcfc30edc737f71f"
@@ -6109,9 +6152,9 @@ source-map-resolve@^0.5.0, source-map-resolve@^0.5.2:
61096152
urix "^0.1.0"
61106153

61116154
source-map-support@~0.5.12:
6112-
version "0.5.13"
6113-
resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.13.tgz#31b24a9c2e73c2de85066c0feb7d44767ed52932"
6114-
integrity sha512-SHSKFHadjVA5oR4PPqhtAVdcBWwRYVd6g6cAXnIbRiIwc2EhPrTuKUBdSLvlEKyIP3GCf89fltvcZiP9MMFA1w==
6155+
version "0.5.15"
6156+
resolved "https://registry.yarnpkg.com/source-map-support/-/source-map-support-0.5.15.tgz#20fe16f16e74644e21a396c78c841fa66e35df6c"
6157+
integrity sha512-wYF5aX1J0+V51BDT3Om7uXNn0ct2FWiV4bvwiGVefxkm+1S1o5jsecE5lb2U28DDblzxzxeIDbTVpXHI9D/9hA==
61156158
dependencies:
61166159
buffer-from "^1.0.0"
61176160
source-map "^0.6.0"
@@ -6785,6 +6828,11 @@ unset-value@^1.0.0:
67856828
has-value "^0.3.1"
67866829
isobject "^3.0.0"
67876830

6831+
[email protected]:
6832+
version "3.0.3"
6833+
resolved "https://registry.yarnpkg.com/untildify/-/untildify-3.0.3.tgz#1e7b42b140bcfd922b22e70ca1265bfe3634c7c9"
6834+
integrity sha512-iSk/J8efr8uPT/Z4eSUywnqyrQU7DSdMfdqK4iWEaUVVmcP5JcnpRqmVMwcwcnmI1ATFNgC5V90u09tBynNFKA==
6835+
67886836
upath@^1.1.1:
67896837
version "1.2.0"
67906838
resolved "https://registry.yarnpkg.com/upath/-/upath-1.2.0.tgz#8f66dbcd55a883acdae4408af8b035a5044c1894"
@@ -6873,7 +6921,7 @@ uuid@^3.0.1, uuid@^3.3.2:
68736921
resolved "https://registry.yarnpkg.com/uuid/-/uuid-3.3.3.tgz#4568f0216e78760ee1dbf3a4d2cf53e224112866"
68746922
integrity sha512-pW0No1RGHgzlpHJO1nsVrHKpOEIxkGg1xB+v0ZmdNH5OAeAwzAVrCnI2/6Mtx+Uys6iaylxa+D3g4j63IKKjSQ==
68756923

6876-
v-tooltip@^3.0.0-alpha.10:
6924+
v-tooltip@^3.0.0-alpha.11:
68776925
version "3.0.0-alpha.11"
68786926
resolved "https://registry.yarnpkg.com/v-tooltip/-/v-tooltip-3.0.0-alpha.11.tgz#e278dfb068246acdd7b633baba2135599b3b22ab"
68796927
integrity sha512-n95vxc1fBZrCkmkJTuH/O0if+8r7r+dFfZpOYCysYT+bIJiK4gxMiEo8olTMoIM1uxikiOGN+CMURcW764m6Xw==

0 commit comments

Comments
 (0)