search

thednp / bootstrap.native

Bootstrap components build with Typescript
http://thednp.github.io/bootstrap.native/
MIT License
1.7k stars 178 forks source link

Dropdown menu closes instantly if user clickes on a span element inside the triggering button #464

Closed jcorporation closed 1 year ago

jcorporation commented 1 year ago

If the user clicks a span element inside a dropdown menu triggering button the dropdown closes instantly. Clicking outside the span elements but inside the button works.

I added a show and a hide event handler to the dropdown and both events are triggered correctly, but the dropdown menu closes instantly.

Following markup produces this issue:

<div class="btn-group">
  <button id="volumeMenu" class="btn dropdown-toggle" type="button" data-bs-toggle="dropdown" data-bs-auto-close="outside">
    <span class="mi">volume_up</span><span class="featVolumeLevel ms-1">50</span>
  </button>
  <div id="outputsDropdown" class="dropdown-menu">
    ...
  </div>
</div>
thednp commented 1 year ago

Currently we don't support data-bs-auto-close="outside" functionality.

jcorporation commented 1 year ago

Thanks for that hint. Issue occurs also without this attribute.

thednp commented 1 year ago

I can confirm the issue.

thednp commented 1 year ago

For some reason I removed stopPropagation from the Dropdown click listener and this happened. I'm reverting that change and you can go ahead and test latest master. Once we're ok, we can push the next release. @jcorporation

jcorporation commented 1 year ago

It works now, many thanks for the quick fix!

thednp commented 1 year ago

v5.0.6 is now live, thanks for the report and the testing.