Feature/vue3

[Botz]

This PR adds basic support for Vue3
#123

[lavrton]

That is a very good Pull Request.

It will not work with vue@2, right?

[Botz]

Thx, yeah it will not work with vue2...

[lavrton]

@Botz can you also take a look into tests? Are there any simple way to fix them to just enable npm run test again?

[Botz]

@lavrton yes of course... i think it's only a karma konfiguration problem and an old vue-test-utils dependency... i will try to fix it...

[Botz]

@lavrton
I managed to get the tests running. But i had to disable a few tests. Because there is a API change in vue and i can't access the child components with the related konvaNode to update the zIndex in checkOrder()

Maybe you can have a look and find another way?

This function was a little bit confusing for me at first, so maybe we can discuss if it is really necessary?!
Because, if i got it right, the zIndex which i define in an item gets overwritten by this function thats not what i would expect.

[nohns]

Awesome stuff. I'm looking forward to the see Vue 3 support!

[cristianvasquez]

Looking forward to starting using Konva in Vue 3!

[sinasita]

Any news on this PR? Will it get merged? Thanks for all your work @lavrton and @Botz!

[lavrton]

I am happy to merge it. But the PR needs to be finished. I don't have enough time to dive in right now. But that order issue must be fixed, all tests should pass.

[lavrton]

I fixed some tests here: https://github.com/konvajs/vue-konva/tree/Botz-feature/vue3
But still not all.

[Botz]

@lavrton thx for your help
I fixed the deep order tests(had to make the findKonvaNode function recursive again),
and fixed the validation tests.

But there is still one failing test: checking for loop order

[Vue warn]: Unhandled error during execution of scheduler flush. This is likely a Vue internals bug. Please open an issue 

Because the render function doesn't really render a Node the Node.insertBefore() function failes. I think this is a problem with vue3 internals.

[Nukron]

Really looking forward to use Konva with Vue3! Thanks for the amazing work @lavrton and @Botz!
Are there any news?

[lavrton]

I am not sure I will be able to finish that issue from my side.

With vue3 I want to change how vue-konva works. vue3 has some new API for custom renders. But I wasn't able to find any good demos, examples.

If someone can help here, it will be extremely useful.
I saw this example: https://github.com/huruji/vuvas, but as I can see it creates a completely new renderer. But what we need is canvas renderer inside DOM renderer (usual vue). I didn't see any examples of that.

[h-guliyev]

Hi as for example you might look at vugel

Also, they have just released vue 3.1 which has vue2 compatibility api

Vue 3.1 is release is dedicated to the Migration Build: a build of Vue 3 that offers Vue 2 compatible behavior to help migrating Vue 2 codebases to Vue 3.

This might be just the right time to add vue 3 support

[wulucxy]

HI，thanks for the project。How is the progress now？

[DavidVaness]

Thank you for the work guys! keep it up 💪🏼
would love to use this with vue 3

[jgiovanni]

Looking forward to this being merged also! initKonva has a debugger statement in it.

initKonva: function initKonva() {
      debugger;

[boboldehampsink]

Other than the debugger; mentioned above this seems to work fine. Can we remove this statement from the package to make it usable?

[lavrton]

Closing by #172