Bug: v-if reactive state not updating inside Nova custom tool (Inertia + Vue 3)

🐛 Bug: v-if reactive state not updating inside Nova custom tool (Inertia + Vue 3)

Code

// resources/js/tool.js
import Tool from './components/Tool.vue'
import Editor from '@tinymce/tinymce-vue'

Nova.booting((app) => {
  app.component('ticket-detail', Tool)
  app.component('editor', Editor)
})

<template>
  <div>
    <editor v-if="showEditor"></editor>
  </div>
</template>

<script setup>
import { ref, onMounted } from 'vue'
import Editor from '@tinymce/tinymce-vue'

const props = defineProps({ panel: Object })
const showEditor = ref(false)

onMounted(() => {
  setTimeout(() => {
    console.log(props.panel.ticket, Editor)
    showEditor.value = true
  }, 2000)
})
</script>

Expected behavior

showEditor should become true after 2 seconds and display the <editor> component.

Actual behavior

showEditor stays false in template

Without showEditor : the console throws the following error:

TypeError: Cannot read properties of null (reading 'refs')

Environment

• Laravel 12
• Laravel Nova: 5.7
• Vue: 3.x (via Nova)
• Inertia: latest
• @tinymce/tinymce-vue: 4.0

Notes

• The same code works correctly in a standalone Vue 3 project.
• Inside Nova (Inertia context), the reactive state doesn’t update — it looks like onMounted runs before the Inertia DOM is fully ready.
• The error suggests TinyMCE tries to access this.$refs before the component is properly mounted within Nova’s dynamic panel lifecycle.

Possible cause

Nova’s internal Inertia + KeepAlive system might destroy or defer component refs before the TinyMCE editor finishes mounting, preventing the reactive v-if condition from ever updating.

Additional information

The issue occurs not only with @tinymce/tinymce-vue, but with any component imported from an external package.
Whenever a third-party Vue component is registered and rendered conditionally inside a Nova tool (using v-if), the reactive state never updates, and the component fails to mount properly.

Start with resources/js/tool.js and components/Tool.vue, then reproduce the conditional external-component mount in the listed Laravel Nova, Inertia, and Vue environment. Compare the Nova custom tool behavior with the standalone Vue 3 case and trace the reported refs error; done means the reactive flag updates and the editor or other external component mounts without the null-refs failure.