aria-expanded="true" is not working on mobile devices

Question

aria-expanded="true" is not working when user closes the dropdown in mobile devices. it it working fine in desktop browser pages.

desktop

<a class="notifLink" data-toggle="dropdown" aria-haspopup="true" id="notificationDropdown" aria-expanded="false" onclick="{!c.readNotifs}">      
                    <h4 class="linkColor">{!v.notifL}</h4>

                </a>

Mobile

<a class="dropdown-toggle notifLink" data-toggle="dropdown" aria-haspopup="true" id="notificationDropdown" aria-expanded="false" onclick="{!c.readNotifs}">
                        <span class="glyphicon glyphicon-bell"></span>
                        <div class="notificationItemsIcon"></div>
                    </a>

what am i missing?

Answer 1

Hey I just had this same issue. Are you working with Shopify and Shogun? For me the issue was shogun duplicated some assets in the code basically making the click cancel itself out. I had to remove the shogun section on my page and it worked great after that.

— A graphic designer with minimal coding experience