fix: resolve extraneous attrs warning in TreeExplorerV2Node (#9735)

## Summary

Fix Vue warning about extraneous non-props attributes (`data-index`,
`style`) in `TreeExplorerV2Node`, which caused the Node Library sidebar
to freeze.

## Changes

- **What**: Added `defineOptions({ inheritAttrs: false })` and
`v-bind="$attrs"` on both node/folder `<div>` elements so the
virtualizer's positioning attributes are properly applied to the
rendered DOM.

## Review Focus

`TreeExplorerV2Node` has a fragment root (`<TreeItem as-child>` +
`<Teleport>`), so Vue cannot auto-inherit attrs. The virtualizer's
`style` (positioning) merges cleanly with `rowStyle` (`paddingLeft`
only).

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-9735-fix-resolve-extraneous-attrs-warning-in-TreeExplorerV2Node-3206d73d3650817c8619e2145e98813d)
by [Unito](https://www.unito.io)
This commit is contained in:
Jin Yi
2026-03-11 13:34:44 +09:00
committed by GitHub
parent e973efb44a
commit 4c9b83a224

View File

@@ -8,6 +8,7 @@
<!-- Node -->
<div
v-if="item.value.type === 'node'"
v-bind="$attrs"
:class="cn(ROW_CLASS, isSelected && 'bg-comfy-input')"
:style="rowStyle"
draggable="true"
@@ -48,6 +49,7 @@
<!-- Folder -->
<div
v-else
v-bind="$attrs"
:class="cn(ROW_CLASS, isSelected && 'bg-comfy-input')"
:style="rowStyle"
@click.stop="handleClick($event, handleToggle, handleSelect)"
@@ -98,6 +100,10 @@ import { InjectKeyContextMenuNode } from '@/types/treeExplorerTypes'
import type { RenderedTreeExplorerNode } from '@/types/treeExplorerTypes'
import { cn } from '@/utils/tailwindUtil'
defineOptions({
inheritAttrs: false
})
const ROW_CLASS =
'group/tree-node flex cursor-pointer select-none items-center gap-3 overflow-hidden py-2 outline-none hover:bg-comfy-input mx-2 rounded'