当鼠标移动缓慢时，Bootstrap 4中的菜单消失

我在跑这把小提琴 https://jsfiddle.net/Chamster/o23865p6/当鼠标指针从“开始”快速移动到展开的菜单时，一切都很好。然而，当移动速度较慢时，菜单会关闭，因为感觉就像鼠标左移。

const menu = $("li.dropdown");
menu.on("mouseenter mouseleave", () => {
  menu.toggleClass("open");
});

最初，我尝试使列表项控件更高，但很快意识到菜单将打开below it（加上这个不幸的垂直距离）。

我能做什么呢？

显然，Bootstrap 创建者出于某种原因发现这很好（或者没有考虑鼠标移动而是单击）。我是否以不适当的方式设置悬停事件？

对我来说这个解决方案更好

here https://jsfiddle.net/pyrh24ve/是小提琴

.open>.dropdown-menu{
    margin-top: initial;
}