Dropdown on navbar is disappearing slowly

[jamipo201]

Describe the bug

When dropdown is on navbar, it delays to disappear when you click outside of the dropdown items when toggled.

Clicking outside of dropdown button when toggled should dismiss the items immediately but it delays few seconds and then disappearing.

Steps to reproduce the bug

<div>
  <b-navbar type="dark" variant="dark">
    <b-navbar-nav>
      <b-nav-item href="#">Home</b-nav-item>

      <!-- Navbar dropdowns -->
      <b-nav-item-dropdown text="Lang" right>
        <b-dropdown-item href="#">EN</b-dropdown-item>
        <b-dropdown-item href="#">ES</b-dropdown-item>
        <b-dropdown-item href="#">RU</b-dropdown-item>
        <b-dropdown-item href="#">FA</b-dropdown-item>
      </b-nav-item-dropdown>

      <b-nav-item-dropdown text="User" right>
        <b-dropdown-item href="#">Account</b-dropdown-item>
        <b-dropdown-item href="#">Settings</b-dropdown-item>
      </b-nav-item-dropdown>
    </b-navbar-nav>
  </b-navbar>
</div>

1. Click dropdown.
2. When toggled, clicking outside of element dismisses items slowly.

Expected behavior

It should dismiss dropdown items immediately when you click outside of the element.

Versions

Libraries:

• BootstrapVue: 2.21.2
• Bootstrap: 4.5.3
• Vue: 2.6.12

Environment:

• Device: Mac
• OS: macOS Bigsur
• Browser: Chrome
• Version: 87.0.4280.88

[Hiws]

Looks like this bug was introduced in version 2.19.0, and is present in all later versions.
Version 2.18.0 does not have this issue.