Dropdown menu on Chrome is not handling links properly

[mrcasals]

How to reproduce this bug:

1. Install Chrome. I could reproduce this in Chrome Android and Chrome Mac
2. Visit http://foundation.zurb.com/sites/docs/dropdown-menu.html
3. If on desktop, open developer tools and emulate a mobile device
4. Go down to the Horizontal Menu example.
5. Click item Item 1A

On Firefox, URL is changed to http://foundation.zurb.com/sites/docs/dropdown-menu.html#Item-1A, but on Chrome it doesn't change.

I tried this piece of code in order to check if the link is being clicked or not:

$('a').on('click', (event) => { event.preventDefault(); console.log(event.target); });

On Chrome, the menu item links are not being logged, but on Firefox they do.

Implications of the bug: on Chrome, if the dropdown element being clicked is over another link, the behind link is the one being clicked instead the one of the menu:

In this case, when trying to click on "Més votat", the link that is actually firing is the one on "Tallers per a jove". This exact same page is found at https://decidim.barcelona/processes/4/f/3/proposals (language is Catalan or Spanish and card are being order randomly, but behaviour can be reproduced anyway)

What should happen:

Element in the dropdown menu is the one being clicked.

What happened instead:

Element behind the pone in the dropdown menu is the one being clicked.

Test case:

I was not able to reproduce it in a Codepen, since Chrome's devices emulator does not show a mobile UI for the page :(

[IamManchanda]

Probable Duplicate of #9691, #9652, #7129, #7143 ( & many other )

and most probably already fixed in #9546 ( develop branch )

[IamManchanda]

Closing this as seems like already fixed in develop branch (above comment) ... !

If in case this isn't the case ... feel free to revert and tell us ... thanks !