Bootstrap dropdown calls stopPropagation unconditionally

A Bootstrap dropdown element, when first clicked, attaches a click handler to the element which calls event.stopPropagation(), thus breaking any handlers that were attached to ancestor elements such as the document.

Demonstration at http://jsbin.com/lapanag/1/edit?html,output which shows the problem.

Is there a reason why this is done? It seems that it will always break anyone who has, for example, a click handler on the document body. (Many frameworks do this, Meteor among them.) I assume there are compatibility reasons for it or similar?

This is mostly a duplicate of #17008, which was closed because bootstrap development moved from v3 to v4. The design bug is (as you can see from the demo above) still present in v4, I think.

[o-alquimista]

One of the consequences of this issue also comes up when you build your own menu and Bootstrap Dropdown stops propagation, which prevents the custom menu from closing.

[shenron]

I know it’s not a solution, more a quick fix. But it works: Catch the show/hide event and propagate a new custom event, the first time the counter increased twice because ‘native’ click event works once.

http://jsbin.com/jiyuhihuya/1/edit?html,output