Check if the wheel event is from an element that wants to capture wheel events #5821
Conversation
dosubot
bot
added
the
size:S
🎭 Playwright Test Results⏰ Completed at: 09/30/2025, 01:33:21 AM UTC 📈 Summary
📊 Test Reports by Browser
🎉 Click on the links above to view detailed test results for each browser configuration. |
There was a problem hiding this comment.
CC @arjansingh and @christian-byrne who have also been trying to handle Litegraph's aggressive event capturing.
src/components/graph/GraphCanvas.vue
Outdated
| const handleTransformPaneWheel = (event: WheelEvent) => { | ||
| // Check if the wheel event is from an element that wants to capture wheel events | ||
| const target = event.target as HTMLElement |
There was a problem hiding this comment.
I'd prefer an instanceof check for the target, if possible.
src/components/graph/GraphCanvas.vue
Outdated
| const handleTransformPaneWheel = (event: WheelEvent) => { | ||
| // Check if the wheel event is from an element that wants to capture wheel events | ||
| const target = event.target as HTMLElement | ||
| const captureElement = target?.closest('[data-capture-wheel="true"]') |
There was a problem hiding this comment.
Do we have this set on anything currently?
There was a problem hiding this comment.
no, but I will use it in 3d node later if we merge this change.
There was a problem hiding this comment.
Could you flip the order so that this is functional at the point that it merges?
we're not merging this but this is how proposed dealing with wheel events |
Ok, thanks for the information, I can check this can fix my issue in 3d node |
jtydhr88
force-pushed
the
capture-wheel
branch
from
4300eae to
9e18c31
Compare
Screen.Recording.2025-09-30.at.10.07.14.movAfter testing, I think this PR can solve #5691. |
…el events (#5821) ## Summary Add generic wheel event capture mechanism for interactive widgets in vueNodes system to prevent event bubbling to canvas. ## Changes - What: Add event handling logic in LGraphNode.vue and GraphCanvas.vue that checks for data-capture-wheel attribute to determine whether wheel events should be forwarded to the canvas - How it works: Components that need to capture wheel events (like Three.js scenes) can add data-capture-wheel="true" attribute to prevent wheel events from bubbling up to the canvas zoom handler prerequirist for #5765 ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-5821-Check-if-the-wheel-event-is-from-an-element-that-wants-to-capture-wheel-events-27b6d73d3650812493b5f13849147e6c) by [Unito](https://www.unito.io)
…el events (#5821) ## Summary Add generic wheel event capture mechanism for interactive widgets in vueNodes system to prevent event bubbling to canvas. ## Changes - What: Add event handling logic in LGraphNode.vue and GraphCanvas.vue that checks for data-capture-wheel attribute to determine whether wheel events should be forwarded to the canvas - How it works: Components that need to capture wheel events (like Three.js scenes) can add data-capture-wheel="true" attribute to prevent wheel events from bubbling up to the canvas zoom handler prerequirist for #5765 ┆Issue is synchronized with this [Notion page](https://www.notion.so/PR-5821-Check-if-the-wheel-event-is-from-an-element-that-wants-to-capture-wheel-events-27b6d73d3650812493b5f13849147e6c) by [Unito](https://www.unito.io)
5 participants
Summary
Add generic wheel event capture mechanism for interactive widgets in vueNodes system to prevent event bubbling to canvas.
Changes
prerequirist for #5765
┆Issue is synchronized with this Notion page by Unito