Skip to content

fix: dragging (e.g., when selecting text) in Markdown note causes node to drag #8413

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
christian-byrne merged 1 commit into from
Jan 29, 2026
+57 −0
Merged

fix: dragging (e.g., when selecting text) in Markdown note causes node to drag #8413

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
54 changes: 54 additions & 0 deletions src/renderer/extensions/vueNodes/widgets/components/WidgetMarkdown.test.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -206,6 +206,60 @@ describe('WidgetMarkdown Dual Mode Display', () => {
expect(clickSpy).not.toHaveBeenCalled()
expect(keydownSpy).not.toHaveBeenCalled()
})

describe('Pointer Event Propagation', () => {
it('stops pointerdown propagation to prevent node drag during text selection', async () => {
const widget = createMockWidget('# Test')
const wrapper = mountComponent(widget, '# Test')

await clickToEdit(wrapper)

const textarea = wrapper.find('textarea')
expect(textarea.exists()).toBe(true)

const parentPointerdownHandler = vi.fn()
const wrapperEl = wrapper.element as HTMLElement
Copy link
Contributor

@DrJKL DrJKL Jan 29, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Nit: I'd always rather an instanceof gate.

Copy link
Contributor Author

@christian-byrne christian-byrne Jan 29, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Valid

wrapperEl.addEventListener('pointerdown', parentPointerdownHandler)

await textarea.trigger('pointerdown')

expect(parentPointerdownHandler).not.toHaveBeenCalled()
})

it('stops pointermove propagation during text selection', async () => {
const widget = createMockWidget('# Test')
const wrapper = mountComponent(widget, '# Test')

await clickToEdit(wrapper)

const textarea = wrapper.find('textarea')

const parentPointermoveHandler = vi.fn()
const wrapperEl = wrapper.element as HTMLElement
wrapperEl.addEventListener('pointermove', parentPointermoveHandler)

await textarea.trigger('pointermove')

expect(parentPointermoveHandler).not.toHaveBeenCalled()
})

it('stops pointerup propagation after text selection', async () => {
const widget = createMockWidget('# Test')
const wrapper = mountComponent(widget, '# Test')

await clickToEdit(wrapper)

const textarea = wrapper.find('textarea')

const parentPointerupHandler = vi.fn()
const wrapperEl = wrapper.element as HTMLElement
wrapperEl.addEventListener('pointerup', parentPointerupHandler)

await textarea.trigger('pointerup')

expect(parentPointerupHandler).not.toHaveBeenCalled()
Comment on lines +211 to +260
Copy link
Contributor

@coderabbitai coderabbitai bot Jan 29, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

⚠️ Potential issue | 🟡 Minor

Ensure pointer-propagation tests actually enter edit mode (dblclick).
The component enters edit mode via @dblclick (Line 2 in WidgetMarkdown.vue), but these tests call clickToEdit which triggers a single click. With v-show, the textarea still exists when not editing, so the tests can pass without exercising edit-mode behavior.

Consider switching the helper to trigger dblclick (and optionally assert visibility) so the new tests validate the real edit path.

Suggested update (outside this hunk) 
const clickToEdit = async (wrapper: ReturnType<typeof mount>) => {
  const container = wrapper.find('.widget-markdown')
- await container.trigger('click')
+ await container.trigger('dblclick')
  await nextTick()
  return container
}
🤖 Prompt for AI Agents 
In `@src/renderer/extensions/vueNodes/widgets/components/WidgetMarkdown.test.ts`
around lines 211 - 260, The tests use the clickToEdit helper which triggers a
single click but WidgetMarkdown enters edit mode on `@dblclick`, so update the
tests to actually enter edit mode: either change the clickToEdit helper to
trigger a 'dblclick' (or call wrapper.find(...).trigger('dblclick') directly in
each test) and then assert the textarea is visible (since the component uses
v-show) before firing pointer events; reference the clickToEdit helper and the
component's `@dblclick` handler in WidgetMarkdown.vue when making the change.

})
})
})

describe('Value Updates', () => {
Expand Down
3 changes: 3 additions & 0 deletions src/renderer/extensions/vueNodes/widgets/components/WidgetMarkdown.vue
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -21,6 +21,9 @@
}
}"
data-capture-wheel="true"
@pointerdown.capture.stop
@pointermove.capture.stop
@pointerup.capture.stop
@click.stop
Copy link
Contributor

@DrJKL DrJKL Jan 29, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

If we're stopping pointerdown, do we also need to stop click?

Copy link
Contributor Author

@christian-byrne christian-byrne Jan 29, 2026

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

For the purposes of extensions / API consistency?

@keydown.stop
/>
Expand Down
Loading