fix(drag-handle): fix Vue 3 drag handle disappearing during external state updates

[solidprinciples]

Changes Overview

While fixing a related issue in nuxt-ui (nuxt/ui#5960) which uses tiptap, I noticed the Vue 3 DragHandle would disappear when its state is updated and causes external re-renders/changes.

I reproduced the issue in Tiptap and opened #7471 with a minimal example in the demo for vue drag handles. Using DOM breakpoints, I traced the issue to the drag handle’s initial visibility: hidden style being reapplied during reactive state updates.

Removing this initial style allows the DragHandlePlugin to fully control visibility without regressions.

Implementation Approach

The fix removes the initial visibility: hidden style from the Vue 3 drag handle element.
Visibility is now managed exclusively by the DragHandlePlugin via its existing showHandle() and hideHandle() logic.

This aligns the DOM behavior with the plugin’s intended state management and avoids conflicts with external reactive updates.

Testing Done

• Verified DragHandle behavior on the regular demo page
• Reproduced the bug in my forked repo - Bug + Bug Fix in two commits
• Confirmed the fix resolves the issue without introducing regressions

Verification Steps

1. Open the DragHandle demo
2. Interact with editor - drag handles appear and hide as expected
3. Test external state updates - my repo is useful for this - not sure a concise example to add to demo.
4. Confirm drag handles no longer disappear unexpectedly.

Bug Branch also works as expect (with example for external state):
develop...solidprinciples:tiptap-draghandle-state-update-bug:bug/drag-handle

Bug repro + fix branch:
develop...solidprinciples:tiptap-draghandle-state-update-bug:bug/drag-handle

Additional Notes

This PR fixes a bug in the Vue 3 drag handle implementation where drag handles disappear when state is updated externally from @nodeChange events. The fix removes the initial visibility: 'hidden' style from the drag handle element, allowing the DragHandlePlugin to manage visibility entirely through its showHandle() and hideHandle() functions.

Checklist

• I have created a changeset for this PR if necessary.
• My changes do not break the library.
• I have added tests where applicable.
• I have followed the project guidelines.
• I have fixed any lint issues.

Related Issues

• Drag Handles v3 state bug - handles dissapear #7471

[changeset-bot]

⚠️ No Changeset found

Latest commit: 9f14b49

Merging this PR will not cause a version bump for any packages. If these changes should not result in a new version, you're good to go. If these changes should result in a version bump, you need to add a changeset.

This PR includes no changesets

When changesets are added to this PR, you'll see the packages that this PR includes changesets for and the associated semver types

Click here to learn what changesets are, and how to add one.

Click here if you're a maintainer who wants to add a changeset to this PR

[netlify]

✅ Deploy Preview for tiptap-embed ready!

Name	Link
🔨 Latest commit	9f14b49
🔍 Latest deploy log	https://app.netlify.com/projects/tiptap-embed/deploys/697a6c44636b44000829149f
😎 Deploy Preview	https://deploy-preview-7472--tiptap-embed.netlify.app
📱 Preview on mobile	Toggle QR Code... Use your smartphone camera to open QR code link.

---

To edit notification comments on pull requests, go to your Netlify project configuration.

[Copilot]

Pull request overview

This PR fixes a bug in the Vue 3 drag handle implementation where drag handles disappear when state is updated externally from @nodeChange events. The fix removes the initial visibility: 'hidden' style from the drag handle element, allowing the DragHandlePlugin to manage visibility entirely through its showHandle() and hideHandle() functions.

Changes:

• Removed visibility: 'hidden' from the initial inline style of the drag handle div element in the Vue 3 implementation

---

💡 Add Copilot custom instructions for smarter, more guided reviews. Learn how to get started.

[Copilot]

This is a user-facing bug fix that requires a changeset. According to the project guidelines (see DEVELOPMENT.md), you should run pnpm changeset to create a changeset file describing this fix. The changeset should mention that this fixes the drag handle disappearing issue when state updates occur externally from @nodeChange events in Vue 3, as described in issue #7471.

[solidprinciples]

Possible duplicate #7252 - identified in my PR. Issue has been around some time?