Strange error

[donPuerto]

Do you experience this error?

<script setup lang="ts">
import { ConfigProvider } from 'radix-vue';
import '@/assets/css/transitions.css';

const attrs = useAttrs();
const useIdFunction = () => useId() ?? '';
</script>

<template>
  <ConfigProvider :use-id="useIdFunction">
    <div v-bind="attrs">
      <NuxtLoadingIndicator 
        class="h-[5px] bg-primary"
      />
      <NuxtLayout>
        <NuxtPage />
      </NuxtLayout>
    </div>
  </ConfigProvider>
</template>

WARN  [Vue warn]: Extraneous non-props attributes (data-v-inspector) were passed to component but could not be automatically inherited because component renders fragment or text root nodes.
  at <PopperRoot data-v-inspector="components/Ui/DropdownMenu/DropdownMenu.vue:18:3" >
  at <MenuRoot open=false onUpdate:open=fn dir="ltr"  ... >
  at <DropdownMenuRoot data-v-inspector="components/Ui/DropdownMenu/DropdownMenu.vue:18:3" onUpdate:open=fn >
  at <DropdownMenu data-v-inspector="components/app/header/TopBar.vue:112:9" >
  at <TopBar data-v-inspector="layouts/default.vue:9:7" >
  at <Default ref=Ref< undefined > >
  at <LayoutLoader key="default" layoutProps= { ref:
   RefImpl {
     dep:
      Dep {
        computed: undefined,
        version: 0,
        activeLink: undefined,
        subs: undefined,
        subsHead: undefined },
     __v_isRef: true,
     __v_isShallow: false,
     _rawValue: undefined,
     _value: undefined } } name="default" >
  at <NuxtLayoutProvider layoutProps= { ref:
   RefImpl {
     dep:
      Dep {
        computed: undefined,
        version: 0,
        activeLink: undefined,
        subs: undefined,
        subsHead: undefined },
     __v_isRef: true,
     __v_isShallow: false,
     _rawValue: undefined,
     _value: undefined } } key="default" name="default"  ... >
  at <NuxtLayout >
  at <ConfigProvider use-id=fn<useIdFunction> data-v-inspector="node_modules/nuxt/dist/app/components/nuxt-root.vue:16:5" >
  at <App data-v-inspector="node_modules/nuxt/dist/app/components/nuxt-root.vue:16:5" >
  at <NuxtRoot>

[BayBreezy]

Hey. Yes, that warning started popping up after a certain nuxt update. I haven't investigated it because it is not causing any trouble with how the application functions

[donPuerto]

it is an error related to DropdownMenu

[BayBreezy]

Ok cool. It's not an error, just a warning. I am not seeing where it is affecting the application negatively. The app still builds without any issue. I can search around in the radix-vue issues to see if it was mentioned over there. Or maybe in the nuxt issues. I did notice it after updating to nuxt 3.13

[donPuerto]

Do the nuxt version you are using, has no warning at your end?

The error starts on ID

<script setup lang="ts">
import { ConfigProvider } from 'radix-vue';
import '@/assets/css/transitions.css';

const attrs = useAttrs();
const useIdFunction = () => useId() ?? '';
</script>

<template>
  <ConfigProvider :use-id="useIdFunction">
    <div v-bind="attrs">
      <NuxtLoadingIndicator 
        class="h-[5px] bg-primary"
      />
      <NuxtLayout>
        <NuxtPage />
      </NuxtLayout>
    </div>
  </ConfigProvider>
</template>

[BayBreezy]

Yes, I do see the warning. I will investigate and provide an update in the near future

[donPuerto]

Got a temporary fix, inspector Warning

 devtools: { 
    enabled: true,
    componentInspector: false,

  },

[BayBreezy]

Nice. Thank you. I think the recent update to nuxt is the cause here but I am not sure. Gonna ask around to see if anyone else is seeing this in their nuxt app. Preferably someone that is not using UI Thing

[BayBreezy]

Hey @donPuerto , The issue was fixed in a recent release from Radix-Vue: https://github.com/unovue/radix-vue/pull/1340 Updating to that version should solve the issue

[BayBreezy]

Hey @donPuerto , I am not seeing this error after the update while developing. So I am closing this one. Thanks for reporting.

[donPuerto]

thanks