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

Update codebase to vue 3 #21

Merged
merged 3 commits into from Mar 22, 2021
Merged

Update codebase to vue 3 #21

merged 3 commits into from Mar 22, 2021

Conversation

kaelonR
Copy link
Contributor

@kaelonR kaelonR commented Mar 20, 2021

This PR converts the code for vue-functional-data-merge to the new Vue 3 format for VNode props ($attrs object in component instances), addressing PRs #18 and #19.

To make this possible, the following changes have been made:

  • VNodeData interface is now Record<string, unknown>, as per Vue's internal typing of the $attrs object.
  • directives case has been removed (is now a withDirectives wrapper function in vue 3, and no longer part of the vnode binding)
  • staticClass case has been removed, as this is now part of the class binding in Vue 3
  • introduced a new mergeClass function which can merge class objects in the new vue 3 format
  • attrs, props, domProps, scopedSlots, staticStyle, hook, transition, slot, and tag cases have been removed, as these properties are now either obsolete or have been flattened to sit directly under $attrs. only id, key, ref and keepAlive props have been retained to avoid overwriting these.
  • nativeOn case has been removed, as in vue 3 the .native modifier no longer exists (events are now native by default when the component does not recognize them)
  • a new check has been added outside the switch checking if a property starts with 'on', signifying that it's an event listener. event listeners use the same merge strategy as the 'on' object in Vue 2.
  • Updated unit tests to match the new situation in Vue 3.
  • removed vue from the package.json dependencies, as vue-functional-data-merge now no longer depends on anything from vue in order to function.

I did not update the version number in package.json, as I feel that it's your authority to decide what the next version number should be.

@coveralls
Copy link

coveralls commented Mar 20, 2021

Coverage Status

Coverage increased (+3.8%) to 100.0% when pulling a80299d on J141:feat/vue3 into 7a217ca on alexsasharegan:master.

@alexsasharegan alexsasharegan changed the base branch from master to vue-3.x March 22, 2021 20:00
@alexsasharegan
Copy link
Owner

Thanks for the work on this! I'll go ahead and merge it into a new branch for Vue 3, and then review it and publish.

@alexsasharegan alexsasharegan merged commit 3077a3e into alexsasharegan:vue-3.x Mar 22, 2021
@alexsasharegan
Copy link
Owner

introduced a new mergeClass function which can merge class objects in the new vue 3 format

What do you mean by this? It appears to me that this new behavior is incorrect from maintaining a pure concatenation in order to preserve order for overrides.

@alexsasharegan
Copy link
Owner

https://github.com/vuejs/vue-next/blob/master/packages/shared/src/normalizeProp.ts#L59-L78

I believe this is the relevant code for Vue's internals to collapse class bindings. You'll notice it's recursive and should handle the old concat strategy and not require the object merge strategy here. I'm going to revert that behavior.

No worries on this of course, I'm super thankful you took the initiative to get everything started!

@alexsasharegan
Copy link
Owner

Available as vue-functional-data-merge@next

npm info vue-functional-data-merge@next

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.

None yet

3 participants