How strong can I rely on internal structure of a vnode (production mode)?

[silentmantra]

I love to mutate slots' vnodes like in this example. Here I use vnode.children to remove their parent. How stable this approach is? Are there any documented properties of vnodes that I can rely on? If not, how can I manipulate the vnodes in the example properly to achieve the same result?

VUE SFC PLAYGROUND

<script setup>
import { ref } from 'vue'
import Wrap from './Wrap.vue';

const isWrapped = ref(false);

</script>

<template>
  <wrap :is-wrapped>
    <div class="wrapper">
      <div>I'AM WRAPPED</div>
    </div>
  </wrap>
  <button @click="isWrapped = !isWrapped">Toggle wrapping</button>
</template>
</style>

Wrap.vue

<script setup>
defineProps({
  isWrapped: Boolean
});
</script>

<template>
  <component :is="() => isWrapped ? $slots.default() : $slots.default().flatMap(vnode => vnode.children)"/>
</template>

[LinusBorg]

The VNode interface is part of the function signature of h(), which is a public API. So it will be stable. What could happen is that we add properties at some point, but we won't remove or rename them.

It's true that the interface could be better documented. You could bring this up in an issue in the docs repo

[silentmantra]

Thanks for clarifying, could you tell can I exploit vnodes like I described in a very short article https://dev.to/alexander-nenashev/conditional-wrap-component-in-vue-3-pt3-8dp ?