search

elmarti / react-joystick-component

Tiny, multitouch, component driven joysticks in react
MIT License
86 stars 27 forks source link

Using joystick in ReactDOM.createPortal() in new window causes mouse drag to be on parent and in the original spot where it was rendered. #26

Closed behoyh closed 2 years ago

behoyh commented 3 years ago

Got an interesting issue for you. when using the joystick in a new window, it seems that the mouse move event binds to the parent window, and does not move from where the child window rendered the component.

behoyh commented 3 years ago

I was able to fix this by replacing all references to window with this._baseRef

elmarti commented 3 years ago

@behoyh awesome! are you able to put it into a PR?

behoyh commented 3 years ago

Right now I'm trying to fix some placement issues, hopefully I'll be able to fix it soon.

EDIT: on second though I think passing in a ref for the parent element would be the best option.

elmarti commented 2 years ago

Had a bit of a look into this today - No luck.

It seems that React portals use the same window ref as the main DOM.

I'm going to attempt to fix this over the next few weeks, but it'll need a bit of research

elmarti commented 2 years ago

I believe this is fixed in the above commit, feel free to reopen if anyone finds this is not the case - added a storybook with demo

behoyh commented 2 years ago

Very cool - thank you!!

github-actions[bot] commented 2 years ago

:tada: This issue has been resolved in version 4.0.0 :tada:

The release is available on:

Your semantic-release bot :package::rocket:

elmarti commented 2 years ago

@behoyh did it resolve the issue for you?

behoyh commented 2 years ago

I don't have access to the codebase at this time so I cant say for certain.