survey-library icon indicating copy to clipboard operation
survey-library copied to clipboard

Support Vue 3 in SurveyJS library

Open tsv2013 opened this issue 3 years ago • 33 comments

We need to support Vue 3 in our products. But we need to check whether survey-vue library will be compatible with Vue 2.X\

migrating tool: https://github.com/surveyjs/survey-library/issues/2756#issuecomment-987624404

tsv2013 avatar Mar 31 '21 07:03 tsv2013

This currently does not work with Vue 3.

bapaynter avatar May 07 '21 23:05 bapaynter

@bapaynter yes

tsv2013 avatar May 11 '21 08:05 tsv2013

@tsv2013 is there any ETA on supporting Vue 3?

outerstorm avatar Jun 14 '21 13:06 outerstorm

@outerstorm Right now we don't have this task in the nearest plans. We're working on SurveyJS Creator V2. After that in case of all VueJS v3 ecosystem has been released we could return to this issue.

tsv2013 avatar Jun 14 '21 14:06 tsv2013

Has anyone tried it with Vue 3.1 and compatibility mode??

opiispanen avatar Jul 02 '21 16:07 opiispanen

This is a big deal to us as well, and we were seriously considering purchasing this product. Can we at least get some roadmap/timelines? Our app is all vue3 and mixing the two is going to be a mess.

timritzer avatar Jul 15 '21 15:07 timritzer

Any schedule for this upgrade? Our company is going to purchase this product.

moonose avatar Aug 19 '21 08:08 moonose

@moonose - We have yet to hear any details on a schedule and are in the same position - our company will be purchasing the product and implementing in a Vue3 application. Since we haven't heard anything yet we moved forward with wrapping the Knockout library with a Vue3 wrapper of our own. Not sure if that approach would work for you, but something to consider.

outerstorm avatar Aug 19 '21 11:08 outerstorm

Hello guys, Let us to find out, how many changes is required for supporting V3 and is it possible to support V2&V3 at the same time. We will comeback in several days.

Thank you, Andrew

andrewtelnov avatar Aug 19 '21 11:08 andrewtelnov

@outerstorm , thanks for your info. We think SurveyJS is set of awesome products and creator seems works fine under vue3 env. That's why we are planning to purchase this product. But unfortunately, current library does not support vue3. We prefer to get a version supporting vue3 officially. So, I wait for a while to see the progress.

moonose avatar Aug 20 '21 01:08 moonose

I think, that for now, we can't easily change the Vue version from 2 to 3. We are using vue-class-component for example and I can't guarantee that it will work in Vue3 and so on.

I think that it is would be reasonable not to have two versions of Vue in the SurveyJS project. As I understand Vue3 is not the default version. It is @next version and even the documentation site opens with Vue2 by default.

Does anyone have information about Vue3 official release and when it becomes a standard? @bapaynter @outerstorm @opiispanen @timritzer @moonose

When Vue3 will become a standard I think that we abandon Vue2 support and converted survey-library to V3 and then probably implemented creatorV2 for Vue3 too.

dmitry-kurmanov avatar Aug 20 '21 09:08 dmitry-kurmanov

v3 has already officially released. together with cli, router, vuex, eslint and other core components, v3 has had its own ecosystem now. It is not a new thing (latest version is 3.2.4) and it is mature with clear official documentation (https://v3.vuejs.org/). But I think both v2 and v3 will coexist in a while, because the two are important milestones with different architectures.

for the new projects, we have enough reasons to choose v3, but for v2 projects, it is really a hard decision to migrate. Hope to see a release of v3 for survey.js soon.

moonose avatar Aug 23 '21 03:08 moonose

v3 has already officially released

Since the differences between Vue2 and Vue3 are dramatical and Vue3 package still has the @next tag, we prefer to wait until Vue3 will be the default package installed via the npm i vue or similar yarn command.

tsv2013 avatar Aug 23 '21 11:08 tsv2013

It is estimated that Vue will not remove the @ next tag in the later stage, because the UI framework based on vue3 has acquiesced vue@next In fact, what I want to see most is the creator of vue3

jlhejs avatar Sep 03 '21 07:09 jlhejs

@kouhunzhe What is actually you are going to do with the survey-creator-vue? What scenarios can't be covered with the survey-creator (V1) or survey-creator-react (-knockout) (V2)?

And concerning Vue3 permanent @ next tag as you said - it's very strange for me. In this case all npm i vue will be install the Vue2.

tsv2013 avatar Oct 08 '21 06:10 tsv2013

This is also critical for my company: Testimonial Tree. We are in the midst of building out a product and are the point where we were hoping to use survey js, but this is a bit of a blocker.

I've read through some various tickets and the priorities are a bit confusing. It seems like you are working on:

  • survey creator (but this is only for react/knockout) is there plans for a vue2/3 instantiation of this?
  • surveyjs-library to cleanup and remove code duplication
  • adding angular support to I assume surveyjs-library
  • then you'll revisit this vue3 situation

I understand your point about vue3 being on the @next branch. However, most "frameworks" and "libraries" are already using vue3 as their default. For instance, we are a use of the https://quasar.dev project and their default command quasar create uses vue3. This is also the case with vue-cli and others. All documentation for vue and related ecosystems default to vue3 with an option to look at vue2 if need be. So, I'm not sure that "waiting" till vue3 is not on the @next branch is a good idea.

I think this should be a higher priority, than it currently is. That being said, I totally understand being limited on human resources.

I'd appreciate any update and/or thoughts as this hasn't been updated in about a month.

EDIT:

I thought of a separate question. Do you have just a plain old vanilla js version of this? If you do I can just use that. I guess I could use the jquery version and just render it into a div from within a component... however, I just despise jquery.

jpgilchrist avatar Nov 12 '21 19:11 jpgilchrist

@outerstorm I understand your concern. I wish I can deliver you good news. Unfortunately, I can't. We have 7 developers on board, including me. We are busy with the following tasks right now: Creator V2 - at the current stage, except working on adaptivity, we are mostly testing, fixing bugs and add e2e tests Improve our rendering - reuse our own components - remove custom code/rendering, render better html, add html snapshots tests.

Next tasks in the queue: Better support for accessibility and add checks for accessibility support into our CI Angular rendering for SurveyJS Library Creator V2 angular version Creator V2 vue2 version Here we believe we can go with vue3 (library and creator). We will review vue3 situation one more time before working on creator for vue2.

The good news, after finishing with current two tasks, other tasks should be done fast. We have more than 85% of our code as platform independent and less than 15% is rendering, platform specific. We have many e2e tests for Creator and Library and they are running for all platforms. We are working on html snapshot tests, making sure all platforms generate the same html after removing platform specific tags and sorting attributes. All we need is to write code for angular and vue3 and make sure all tests are running for new platforms as well.

Thank you, Andrew

andrewtelnov avatar Nov 12 '21 20:11 andrewtelnov

@andrewtelnov thanks for the info.

Just for reference this could help in the short term?

https://www.npmjs.com/package/@vue/compat

jpgilchrist avatar Nov 13 '21 12:11 jpgilchrist

A good path to making this work might be to use Vue-Demi. Thanks for the good work.

dougalg avatar Dec 07 '21 06:12 dougalg

we prefer to wait until Vue3 will be the default package

Update: this will be the case as of February 7.

luukdv avatar Jan 26 '22 14:01 luukdv

@luukdv Good news :-)

tsv2013 avatar Jan 26 '22 14:01 tsv2013

A good path to making this work might be to use Vue-Demi. Thanks for the good work.

because we are using so many additional features like vue-class-component and typescript I think we can't just use this library for migrating. But we will try. Thanks for sharing

dmitry-kurmanov avatar Jan 26 '22 17:01 dmitry-kurmanov

https://blog.vuejs.org/posts/vue-3-as-the-new-default.html

dmitry-kurmanov avatar Feb 07 '22 10:02 dmitry-kurmanov

because we are using so many additional features like vue-class-component and typescript I think we can't just use this library for migrating. But we will try.

Vue-demi works well with TS if you use the composition api (available from the @vue/composition-api package), but class component syntax is strongly discouraged moving forward in Vue last I read, and it is recommended to adopt the standard object syntax or the new composition api.

So you might have to do the class-component to composition-api migration first.

dougalg avatar Mar 03 '22 06:03 dougalg

see https://github.com/surveyjs/survey-library/issues/4133

dmitry-kurmanov avatar Mar 29 '22 13:03 dmitry-kurmanov

Is there any news about this ? The MVP has been closed in version 1.9.22 if I am not mistaken and I cannot find the Vue 3 official support in the current sprint progress roadmap (which is references just above).

lowgos avatar Jun 24 '22 15:06 lowgos

Hello, you are right we've made the mvp and it was successful. We proofed the concept. This enhancement is in our todo list.

We are working on native Angular implementation and then we are going to start work for Vue3 support.

Unfortunately, we can't give a concrete estimations. But we are trying to do our best to make it happen as soon as possible.

Thanks, Dmitry SurveyJS team

dmitry-kurmanov avatar Jun 27 '22 09:06 dmitry-kurmanov

Hi, excellent news @dmitrykurmanov thank you.

This MVP was uploaded in a commit?

jag2kn avatar Aug 17 '22 16:08 jag2kn

Hi, excellent news @dmitrykurmanov thank you.

This MVP was uploaded in a commit?

yes, here is the branch: https://github.com/surveyjs/survey-library/tree/feature/4133-vue3-mvp

dmitry-kurmanov avatar Aug 29 '22 09:08 dmitry-kurmanov

My team is also looking forward for this library being supported by Vue3. This will be critical to our open source project.

Having some feedback from time to time would be great in the next months. Thank you!

lucavenir avatar Aug 30 '22 14:08 lucavenir