Skip to content
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.

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

onMouseEnter triggered on children in React 16 #11152

Closed
dbismut opened this issue Oct 9, 2017 · 6 comments
Closed

onMouseEnter triggered on children in React 16 #11152

dbismut opened this issue Oct 9, 2017 · 6 comments

Comments

@dbismut
Copy link

dbismut commented Oct 9, 2017

Hi, I'm having an issue with onMouseEnter being triggered on children of a component. It only occurs with React 16.

I've created a CodePen that shows the issue.

Simplified structure is as below:

           <Card/> :
–––––––––––––––––––––––––––––
|                            |
|          <Cover/>          |
|                            |
------------------------------
|                            |
|    <div class="text" />    |
|                            |
–––––––––––––––––––––––––––––

<Card /> is a component that needs to capture onMouseMove events (and trigger a render) and <Cover/> is a simple component that waits for an image (passed as a prop) to be loaded before displaying it (using onload on an Image created in the constructor).

If you open the console, you'll see that onMouseEnter is triggered when hovering <Card /> (normal behavior), but also when hovering the .text div (which is not supposed to happen).

If you remove the whole onload logic from the <Cover/> element, then onMouseEnter works as intended.

It's possible that I'm coding this in a way that isn't appropriate, but it does look like a bug anyway :)

@gaearon
Copy link
Collaborator

gaearon commented Oct 9, 2017

This sounds like a duplicate of #10906.

@gaearon gaearon closed this as completed Oct 9, 2017
@dbismut
Copy link
Author

dbismut commented Oct 9, 2017

Thanks Dan. I had seen the issue but the jsFiddle example seemed like a different cause.

@gaearon gaearon reopened this Oct 9, 2017
@gaearon
Copy link
Collaborator

gaearon commented Oct 9, 2017

Let’s keep it open then. I have a suspicion they might be related, but I could be wrong.

@gaearon
Copy link
Collaborator

gaearon commented Oct 9, 2017

Fixed by #11164.

@gaearon
Copy link
Collaborator

gaearon commented Nov 3, 2017

React 16.1.0-beta has been released. Please update react, react-dom, and react-test-renderer (if you use it) to this version and let us know if it solved the issue! We’d appreciate if you could test before Monday when we plan to get 16.1.0 out.

@dbismut
Copy link
Author

dbismut commented Nov 3, 2017

Hey @gaearon this works now :) Thanks!

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

No branches or pull requests

2 participants