fix: render selection rectangle in DOM layer to appear above DOM widgets (#7474)

## Summary
Selection box was being drawn on canvas which appeared below DOM widgets
like images and textareas.

Now rendered via SelectionRectangle.vue with high z-index to ensure
visibility during drag selection.

## Screenshots (if applicable)
before
<img width="1268" height="1258" alt="image"
src="https://github.com/user-attachments/assets/7cb1271c-9ce6-4fac-83a9-ac783a309d97"
/>

after
<img width="1509" height="1129" alt="image"
src="https://github.com/user-attachments/assets/55dd698f-1213-4e60-ae46-9ed292ecd70c"
/>

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-7474-fix-render-selection-rectangle-in-DOM-layer-to-appear-above-DOM-widgets-2c96d73d36508142bc2ac0d0943043c5)
by [Unito](https://www.unito.io)
This commit is contained in:
Terry Jia
2025-12-15 13:41:10 -05:00
committed by GitHub
parent abf966ab83
commit 4ec4da785b
3 changed files with 3 additions and 27 deletions

View File

@@ -76,8 +76,8 @@
/>
</TransformPane>
<!-- Selection rectangle overlay for Vue nodes mode -->
<SelectionRectangle v-if="shouldRenderVueNodes && comfyAppReady" />
<!-- Selection rectangle overlay - rendered in DOM layer to appear above DOM widgets -->
<SelectionRectangle v-if="comfyAppReady" />
<NodeTooltip v-if="tooltipEnabled" />
<NodeSearchboxPopover ref="nodeSearchboxPopoverRef" />