Show Set and Map expanded views #490
Conversation
We have access to it, so we should show it.
Y'all made me think there was a bug in my stringifier and regenerator
shells/dev/target/Other.vue
Outdated
| h: 'I am a really long string mostly just to see how the horizontal scrolling works.' | ||
| h: 'I am a really long string mostly just to see how the horizontal scrolling works.', | ||
| i: new Set([1, 2, 3, 4, new Set([5, 6, 7, 8])]), | ||
| j: new Map([[1, 2], [3, 4], [5, new Map([[6, 7,]])]]) |
There was a problem hiding this comment.
Did you try to put a Set inside a Map and the other way around?
There was a problem hiding this comment.
Yes; I've added a more complex test case in db270b3.
src/devtools/index.js
Outdated
| @@ -81,7 +81,7 @@ function initApp (shell) { | |||
| }) | |||
|
|
|||
| bridge.on('instance-details', details => { | |||
| store.commit('components/RECEIVE_INSTANCE_DETAILS', parse(details)) | |||
| store.commit('components/RECEIVE_INSTANCE_DETAILS', parse(details, true)) | |||
There was a problem hiding this comment.
You shouldn't revive data on devtools side.
There was a problem hiding this comment.
Objects, Arrays, Numbers, Strings, and null are already revived on master. Is there any reason we don't want to do this for Sets, Maps, INF, undefined, and NaN?
There was a problem hiding this comment.
We only revive JSON-compatible data (which means no 'reviving', just like a standard JSON.parse()) because we may need to send it back again (state edition and Vuex time traveling).
There was a problem hiding this comment.
Also, the upcoming State edition system expects JSON-compatible data to work (even if the user doesn't send any change).
There was a problem hiding this comment.
Ah, that makes sense. I've moved the set reconstruction logic into the component, so the store should only contain JSON-compatible data now.
| }, | ||
| formattedValue () { | ||
| const value = this.field.value | ||
| if (value === null) { | ||
| return 'null' | ||
| } else if (value === UNDEFINED) { | ||
| } else if (value === UNDEFINED || value === undefined) { |
There was a problem hiding this comment.
(See below, data shouldn't be revived on devtools side.)
| return 'undefined' | ||
| } else if (value === NAN) { | ||
| } else if (value === NAN || Number.isNaN(value)) { |
| return 'NaN' | ||
| } else if (value === INFINITY) { | ||
| } else if (value === INFINITY || value === Number.POSITIVE_INFINITY) { |
Initial PR vuejs#490 by AdamNiederer
|
For now, we will continue with #523 |
* More fault tolerant * Display stores with CustomValue API * Dsiplay VueRouter instances with CustomValue API * CustomValue API: new 'tooltip' option, supports functions, component def * Test router & store * Open in editor Component defs * Fix #528 * Comments * Encode cache clear * Large array test * CustomValue API: respect fields order * Switch props and data sections to follow style guide * New 'grey' and 'red' classes DataField: allowing to reproduce current available styling using CustomValue API * Add support for Map and Set - Fix #349 Initial PR #490 by AdamNiederer * Set and Map test case * Fix Map key/value inverted * Optimizations * Fix tooltip * DataField style changes * Env: added isLinux & isWindows + function 'f' style fixes * gps-not-fixed icon is ugly on Windows * Style tweaks * Typo * Added more function test cases
Adds a drop-down for sets and maps, and also shows the number of entries in Objects to maintain uniformity.
Partially _resolves #354 and resolves #349.