ZestfulNation / vue-hotel-datepicker

A VueJS v2 responsive date range picker. Displays the number of nights selected and allow several useful options like custom check-in/check-out rules, localization support and more.
https://zestfulnation.github.io/vue-hotel-datepicker/
MIT License
841 stars 220 forks source link

Vue 3 compatibility #213

Open mariusa opened 4 years ago

mariusa commented 4 years ago

Description

Would like to use this component in a Vue 3 project generated by https://github.com/vitejs/vite

Note, this is just about being usable, not porting the component to Vue 3 composition APIs.

Steps to Reproduce

$ npm init vite-app <project-name>
$ cd <project-name>
$ npm install
$ npm install vue-hotel-datepicker --save
$ npm run dev

Add component to App.vue as noted in https://github.com/krystalcampioni/vue-hotel-datepicker

Expected behavior: [What you expected to happen]

component to work

Actual behavior: [What actually happened]

Error in browser console:

vue.js:1228 TypeError: Cannot read property '_c' of undefined
    at Proxy.a (vue-hotel-datepicker.js:22)
    at renderComponentRoot (vue.js:1481)
    at componentEffect (vue.js:4317)
    at reactiveEffect (vue.js:295)
    at effect (vue.js:270)
    at setupRenderEffect (vue.js:4309)
    at mountComponent (vue.js:4267)
    at processComponent (vue.js:4223)
    at patch (vue.js:3883)
    at mountChildren (vue.js:4039)

Datepicker Version

3.0.10

stale[bot] commented 4 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

matiasperrone commented 4 years ago

Check v4.0.0-beta.2

mariusa commented 4 years ago

Would you please publish to npm so we can start using it? https://www.npmjs.com/package/vue-hotel-datepicker

Also, the README here points to another repo with an old version, very confusing: https://github.com/krystalcampioni/vue-hotel-datepicker/tree/v4.0.0-dev

matiasperrone commented 4 years ago

I rewrite the Readme so... check that out

matiasperrone commented 4 years ago

Please check the v4 version, we are deprecating the v3 version.

mariusa commented 4 years ago

V4 version doesn't work with vue3. https://github.com/vuejs/vue-next

superbiche commented 4 years ago

I think what's best would be:

If @matiasperrone agrees I'll reopen this one and we'll work on it as soon as Vue 3 lands (maybe before depending on how complicated the changes are).

matiasperrone commented 4 years ago

Vue 3 just landed... 😅

superbiche commented 4 years ago

Yup, saw that. They are playing with my nerves :sweat_smile: . I'll try to give it some time next week

matiasperrone commented 4 years ago

@mariusa Thank you very much for the feedback!! It's very important!!

matiasperrone commented 4 years ago

Can we give v3 support on 4.1? and close this issue?

mariusa commented 4 years ago

Can we give v3 support on 4.1?

That's a good plan.

and close this issue?

After it's done :)

stale[bot] commented 4 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

stale[bot] commented 3 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

matiasperrone commented 3 years ago

v4.1 is now live! Soon v5.... I don't know when...

bzd2000 commented 3 years ago

Hi, Does 4.1 includes vue 3 support?

thx, Filip.

bzd2000 commented 3 years ago

@matiasperrone , an idea when vue 3 will be supported? It is not to put pressure, but just to have an idea if it will be in coming days, weeks or months.

matiasperrone commented 3 years ago

Still don't know, in the next few days I am going to start checking the changes needed, but there are many improvements to be made to the code. I will focus on this from now on. Think more in one month or more, the other collaborators are occupied.

bzd2000 commented 3 years ago

@matiasperrone , I'm available if you need help

matiasperrone commented 3 years ago

Sure! I just created the v5 branch so we may start working on the code. There are several not very good practices (not my fault) within... I would say that we should fix that before start. Also we should separate the javascript with different responsabilities: Month, Day, DatePicker, to make the maintance easier.

bzd2000 commented 3 years ago

@matiasperrone ,

When I run the unit tests it fails:

vue-hotel-datepicker git:(v5) ✗ npm run test:unit

> vue-hotel-datepicker@4.3.0 test:unit /Users/filipdelperdange/Projects/stuff/cotly/vue-hotel-datepicker
> vue-cli-service test:unit

 FAIL  tests/unit/datepickerDay.spec.js
  ● Test suite failed to run

    Cannot find module '@/DatePicker/components/Day.vue' from 'datepickerDay.spec.js'

      2 | import { expect } from 'chai'
      3 | 
    > 4 | import Day from '@/DatePicker/components/Day.vue'
        | ^
      5 | 
      6 | describe('Datepicker Day', () => {
      7 |   let wrapper

      at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:259:17)
      at Object.<anonymous> (tests/unit/datepickerDay.spec.js:4:1)

 FAIL  tests/unit/datepicker.spec.js
  ● Test suite failed to run

    Cannot find module '@/DatePicker/HotelDatePicker.vue' from 'datepicker.spec.js'

      2 | import { mount } from '@vue/test-utils'
      3 | 
    > 4 | import Datepicker from '@/DatePicker/HotelDatePicker.vue'
        | ^
      5 | 
      6 | describe('Datepicker Calendar', () => {
      7 |   const wrapper = mount(Datepicker)

      at Resolver.resolveModule (node_modules/jest-resolve/build/index.js:259:17)
      at Object.<anonymous> (tests/unit/datepicker.spec.js:4:1)

 PASS  tests/unit/datepickerHelpers.spec.js

Test Suites: 2 failed, 1 passed, 3 total
Tests:       9 passed, 9 total
Snapshots:   0 total
Time:        2.688s
Ran all test suites.
npm ERR! code ELIFECYCLE
npm ERR! errno 1
npm ERR! vue-hotel-datepicker@4.3.0 test:unit: `vue-cli-service test:unit`
npm ERR! Exit status 1
npm ERR! 
npm ERR! Failed at the vue-hotel-datepicker@4.3.0 test:unit script.
npm ERR! This is probably not a problem with npm. There is likely additional logging output above.

npm ERR! A complete log of this run can be found in:
npm ERR!     /Users/filipdelperdange/.npm/_logs/2021-02-18T08_00_00_526Z-debug.log

Is there a build procedure I should follow?

Thx, Filip.

stale[bot] commented 3 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

newbie2005 commented 3 years ago

I use "vue": "^3.0.0", "vue-hotel-datepicker": "^4.4.2"

and still found error runtime-core.esm-bundler.js?5c40:218 Uncaught TypeError: Cannot read property '_c' of undefined at Proxy.render (vueHotelDatepicker.common.js?ffea:1473) at renderComponentRoot (runtime-core.esm-bundler.js?5c40:1168) at componentEffect (runtime-core.esm-bundler.js?5c40:5214) at reactiveEffect (reactivity.esm-bundler.js?a1e9:42) at effect (reactivity.esm-bundler.js?a1e9:17) at setupRenderEffect (runtime-core.esm-bundler.js?5c40:5167) at mountComponent (runtime-core.esm-bundler.js?5c40:5126) at processComponent (runtime-core.esm-bundler.js?5c40:5084) at patch (runtime-core.esm-bundler.js?5c40:4690) at componentEffect (runtime-core.esm-bundler.js?5c40:5221)

matiasperrone commented 3 years ago

We don't support Vue3 at the moment...

matiasperrone commented 3 years ago

I'll be actively working on this in two months, it probably will take 2 weeks or maybe more. We are committed to this package so rest assure that this year will be resolved

bzd2000 commented 3 years ago

@matiasperrone, Any news?

matiasperrone commented 3 years ago

Hi, sorry not yet. I may be working on this feature along with the rewrite by the end of 2021, I least is what I hope for. @superbiche you?

matiasperrone commented 2 years ago

Hi guys and gals! (and others! why not?) I am going to move this project to a different namespace for the v3... more new I hope soon...

My current day job and some topics in my personal life didn't allow me to pursue the Vue 3 development and the team is a little bit offline now... so I hope to push it to 2022 with some hardwork.

I'll be searching for devs to push this to the next level, so I'll be asking those who help me to help once again to be part of something bigger that yourselves.

ahmedshaheen201400721 commented 2 years ago

any news

matiasperrone commented 2 years ago

No news on this. Do you want to help me building the Vue3 version in a new repo?

matiasperrone commented 2 years ago

I didn't have the time... too much work on my daily paid work.

matiasperrone commented 2 years ago

still in the same situation. Sorry

stale[bot] commented 2 years ago

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions.

adnanashraf1 commented 2 years ago

Any news on this???

matiasperrone commented 2 years ago

Hi... I think I am going to open a donations box... because I can't work on this right now...

I have bills to pay... BUT I think I'll start some time this year.

But probably I move this repo to global-innovation organization.

matiasperrone commented 2 years ago

I am the only one maintaining this... I am pretty swamped... sorry guys

I used to use time from my former work to work on this. I believe that a lot of the work needs to be redone.

I am going to seek for another package that is in the same as this one and maybe we can accomplish something.

cornelRaiu commented 2 years ago

I can probably have a go at this.

There's a project I am working on where we started using this package on Vue2 and then, when we upgraded to Vue3, I had to make this code Vue3 compatible.

I will have some time in the next couple of weeks.

matiasperrone commented 1 year ago

Good news!! I am going to be working in the v5, this version I hope will be Vue 3 compatible! :D 🥇

matiasperrone commented 7 months ago

Finally I decided to use a new repo, maybe it will be merged to this one, but it is very early yet to know.

If anyone wants to help you're welcome!!