onMouseOver is not triggered for a component rendered under the mouse until the mouse moves.

[z5h]

If a component is rendered that registers for onMouseOver events, and it is rendered under the mouse, it should have it's onMouseOver callback invoked.

[z5h]

A temporary fix is something like this:

  componentDidMount : function(){
    //Check if we were rendered under the mouse, and if so,
    //trigger an onMouseEnter event.
    //This needs to be called from a setTimeout otherwise the browser won't have
    //a chance to set :hover state.
    var myNode = this.getDOMNode();
    setTimeout(function(){
      if (myNode.parentElement.querySelector(':hover') === myNode){
        this. onMouseOver();
      }
    }.bind(this), 0);
  }

[santiagopuentep]

Also, mouseEnter event never triggers.

[bvaughn]

I don't think React should implement the behavior described in this issue. It's not React-specific. Certain browsers (eg Chrome, Safari) don't dispatch a mouseover or mouseenter event in the case you've described (even using vanilla JS) until the mouse moves again. I don't think React should try to iron over this behavior.

I'm going to close this issue for now. We can always reopen it if other's feel strongly. 😄

[getusha]

Experiencing the same issue.
it works on chrome, firefox
on safari onMouseOver callback is not invoked until the mouse moves.