React: Событие onMouseLeave не срабатывает при быстром движении курсора

Проблема с событием hover в React: onMouseLeave не всегда срабатывает

Я пытаюсь реализовать событие hover, но onMouseLeave не всегда вызывается, когда курсор покидает элемент, особенно при быстром перемещении курсора. Я пробовал в Chrome, Firefox и Internet Explorer, но проблема проявляется в каждом браузере.

Вот мой код:

import React from 'react';
import Autolinker from 'autolinker';
import DateTime from './DateTime.jsx';

class Comment extends React.Component {
    constructor(props) {
        super(props);
        this.handleOnMouseOver = this.handleOnMouseOver.bind(this);
        this.handleOnMouseOut = this.handleOnMouseOut.bind(this);
        this.state = {
            hovering: false
        };
    }

    render() {
        return (
            <li className="media comment" onMouseEnter={this.handleOnMouseOver} onMouseLeave={this.handleOnMouseOut}>
                <div className="image">
                    <img src={this.props.activity.user.avatar.small_url} width="42" height="42" />
                </div>
                <div className="body">
                    {this.state.hovering ? null : <time className="pull-right"><DateTime timeInMiliseconds={this.props.activity.published_at} byDay={true} /></time>}
                    <p>
                        <strong>
                            <span>{this.props.activity.user.full_name}</span>
                            {this.state.hovering ? <span className="edit-comment">Edit</span> : null}
                        </strong>
                    </p>    
                </div>
            </li>
        );
    }

    handleOnMouseOver(event) {
        event.preventDefault();
        this.setState({ hovering: true });
    }

    handleOnMouseOut(event) {
        event.preventDefault();
        this.setState({ hovering: false });
    }

    newlines(text) {
        if (text)
            return text.replace(/\n/g, '<br />');
    }
}

export default Comment;

Описание проблемы:

Несмотря на то, что события onMouseEnter и onMouseLeave должны работать корректно, я замечаю, что в случае быстрого перемещения курсора событие onMouseLeave не всегда срабатывает. Это приводит к тому, что состояние hovering не обновляется корректно, и элементы интерфейса не отображаются так, как ожидалось.

Есть ли известные проблемы с этими событиями в React? Как можно решить эту проблему?