Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Support native Date type, Components, improved RegExp, new CustomValue API #474

Merged
merged 6 commits into from
Jan 12, 2018

Conversation

Akryum
Copy link
Member

@Akryum Akryum commented Dec 19, 2017

Fix #475 Fix #460

This PR improves Date and components support:

  • Dates are now treated as native (like RegExp) and are fomated as such.
  • Dates and reg exps are now correctly revived when time traveling in vuex.
  • Import/Export of dates and reg exps now works too.

image

  • New _custom API.

Example for components:

{
    _custom: {
      type: 'component',
      id: instance.__VUE_DEVTOOLS_UID__,
      display: getInstanceName(instance),
      value: { /* component state */ },
      fields: {
        abstract: true
      }
    }
  }

Other example: https://gist.github.com/Akryum/f2e08df47088d5be0f933b67e90261dc

  • Components are now handled in a specific way using above new feature:

capture d ecran du 2017-12-25 18 52 28

@@ -43,7 +43,8 @@ export function stringify (data) {
return CircularJSON.stringify(data, replacer)
}

function replacer (key, val) {
function replacer (key) {
const val = this[key]
Copy link
Member Author

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

@yyx990803 This is to prevent the default replacer to turn Dates into Strings before calling the custom replacer. See WebReflection/circular-json#4

@Akryum Akryum requested review from posva and yyx990803 December 22, 2017 15:57
@Akryum
Copy link
Member Author

Akryum commented Dec 25, 2017

I added a new _custom object API to be able to send complex customizable data to the devtools state inspector. This currently allows displaying components in a specific way. See OP.

@Akryum Akryum changed the title Support native Date type Support native Date type + Components Dec 25, 2017
@Akryum Akryum mentioned this pull request Dec 27, 2017
9 tasks
@Akryum Akryum changed the title Support native Date type + Components Support native Date type + Components, improved RegExp Dec 27, 2017
@michalsnik michalsnik added this to the 🎄Holiday Update milestone Jan 3, 2018
@Akryum
Copy link
Member Author

Akryum commented Jan 6, 2018

I have made some changes on #486 to make the CustomValue API much more powerful. For example: https://gist.github.com/Akryum/f2e08df47088d5be0f933b67e90261dc

@Akryum Akryum changed the title Support native Date type + Components, improved RegExp Support native Date type, Components, improved RegExp, new CustomValue API Jan 6, 2018
}

export function reduceStateList (list) {
if (!list.length) {
Copy link
Member

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

minor, but you can write this as if (!list.length) return

Copy link
Member

@posva posva left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Looks good to me, tested too 🙂
I think some of the code in the devtools could use some comments as my personal experience with it is always a bit hard: it's not easy to get into it to do a small feature. I wonder if you felt that way too at the beginning @Akryum

@yyx990803 yyx990803 merged commit 9b06716 into vuejs:master Jan 12, 2018
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

4 participants