Support Vue devtools better in composition API

[segevfiner]

Try https://stackblitz.com/edit/vitejs-vite-9epxrd?file=src%2FApp.vue and open the app in a new tab with the Vue devtools installed. When the popover is shown, you can't see its component in the Vue devtools. This is when using the composition API, not sure if the directive or component fare any better, though they might.

[KABBOUCHI]

added in ^6.3.0-beta.2

u can also change the app name:

useTippy(document.body, {
  content: h("button",{}, "Hello")
}, 
{
  appName: 'Tippy #1'
});

[segevfiner]

But using a separate app means you won't have access to plugins and global state on he original app?

[segevfiner]

I have seen some other code that avoids this by using Teleport into a disconnected DOM element. But the Teleport does need to exist in a template somewhere, though it can be one component that renders multiple teleports from some global/injected state, see Tiptap's VueRenderer.

[KABBOUCHI]

But using a separate app means you won't have access to plugins and global state on he original app?

I'm cloning the appContext, it should have all the plugins and stuff, feel free to test it

[KABBOUCHI]

I have seen some other code that avoids this by using Teleport into a disconnected DOM element. But the Teleport does need to exist in a template somewhere, though it can be one component that renders multiple teleports from some global/injected state, see Tiptap's VueRenderer.

I wasn't able to do that, feel free to open a PR

https://github.com/KABBOUCHI/vue-tippy/blob/main/src/composables/useTippy.ts#L54-L100

[segevfiner]

@KABBOUCHI This is a standalone example of how the trick works: https://stackblitz.com/edit/vitejs-vite-qck2xd?file=src%2Fcomponents%2FTeleportSample.vue

[KABBOUCHI]

@KABBOUCHI This is a standalone example of how the trick works: stackblitz.com/edit/vitejs-vite-qck2xd?file=src%2Fcomponents%2FTeleportSample.vue

thanks for the example, but it needs TeleportContainer to work, my way is a lot better, doesn't need any initial setup, its hacky way but it works.

[segevfiner]

I still wonder why Vue doesn't have a builtin official way to do this, maybe we should request one to be added.

[KABBOUCHI]

I still wonder why Vue doesn't have a builtin official way to do this, maybe we should request one to be added.

yes, a Teleport using composition would be awesome

note: there was a small bug plz update from beta to v6.3.0