Draggable doesn't work with SVG elements as they are not an instance of HTMLElement interface but Element interface

Open
#733 0 comments 3 reactions 0 assignees View on GitHub

Nobody has claimed this yet.

Assessment

Difficulty
4/5
Estimated time
3-5 days
Newbie friendliness
35/100
Issue type
Bug
Clarity
Needs clarification
Activity status
Stale
Tech stack
javascript, react
Domain
frontend

Research direction

Start by reproducing the reported case: a draggable SVG group with an SVG parent, then compare it with an outer HTML div used as bounds. Inspect the bounds behavior involving SVG elements and determine what behavior is needed for the issue to be considered fixed.

Written by the indexing model from the issue text.

Description

Firstly, thanks for this awesome easily extensible library.

Description

I am using draggable on SVGElements like group(g) with parent as svg tag element.
Bounds doesn't work with value parent on them and even if bounds was set to outer HTMLElement like div, bounds is not working as expected as the offsetLeft & offsetTop exist only on HTMLElement and not on Element or SVGElement interfaces.
This is a blocker for SVG elements.

Dominant language
JavaScript
Stars
9.3k
Forks
1k
Avg merge
3d 8h
Merged PRs (30d)
4

Contributor guide

No contributing guide indexed for this repository

First steps

  1. Read the whole issue, then the project's contributing guide.
  2. Comment on the issue to say you are picking it up — it saves two people doing the same work.
  3. Fork the repository and make your change on a branch.
  4. Open a pull request that references the issue number.

More from react-grid-layout/react-draggable

All issues in react-grid-layout/react-draggable

Similar issues

More JavaScript issues

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.