[v5-b3] Using a select menu in a dropdown in a navbar collapses the dropdown menu

[lenormf]

Hi,

Here's a reproducer:

<nav class="navbar navbar-expand-lg navbar-light bg-light">
  <ul class="navbar-nav me-auto mb-2 mb-lg-0">
    <li class="nav-item dropdown">
      <a class="nav-link dropdown-toggle" href="#" id="navbarDropdown" role="button" data-bs-toggle="dropdown" aria-expanded="false">
        Dropdown
      </a>
      <ul class="dropdown-menu" aria-labelledby="navbarDropdown">
        <li>
          <select class="form-select" aria-label="Default select example">
            <option selected>Open this select menu</option>
            <option value="1">One</option>
          </select>
        </li>
      </ul>
    </li>
  </ul>
</nav>

• expand the dropdown menu by clicking on it
• select an item in the menu (e.g. "One")

Outcome: the dropdown menu gets collapsed upon selecting an item
Expected: the dropdown menu remains open, to allow for example submitting the form that the select input is a part of

I haven't tried outside of a navbar (apparently Popper is not needed for dropdowns in navbars?).

HTH.

[mdo]

Seems to work for me? https://codepen.io/emdeoh/pen/oNBdbZm

[lenormf]

I can reproduce the issue on the CodePen link.

My browser is Firefox v87.

[alpadev]

Yeah it only does this in Firefox.. For some reason the event.target is option not the select like in other browsers..

@mdo should I reopen and fix that?

[mdo]

Yes please, @alpadev! <3

[lenormf]

Thanks a lot @alpadev!