Offcanvas triggering element problem

[subliminalhash]

The problem is when there is a FontAwesome icon within the triggering anchor element for the offcanvas.

When clicking on the element e.g. hamburger icon, backdrop appears and disappears very quickly without revealing the offcanvas div. However when clicked outside of the element and within the boundaries of the anchor, then offcanvas appears successfully. So I am guessing it might be something related to bubbling?

Case link:
https://jsfiddle.net/kemalemin/eyd89grm/

I am on a Windows 10 machine.
Tested on:

• Vivaldi 3.7.2218.45 (Stable channel) (64-bit)
• Chrome 89.0.4389.114 (Official Build) (64-bit)
• Brave 1.22.71 Chromium: 89.0.4389.114 (Official Build) (64-bit)
• Edge 89.0.774.75 (Official build) (64-bit)

[mdo]

Duplicate of #33457.