The popover element (lightning-primitive-bubble
) from a lightning:helptext
component stays rendered on the page even after the parent component containing the lightning:helptext
is destroyed and even if the lightning:helptext
component is destroyed directly. This only happens on iOS devices. The popover disappears as expected on other platforms.
Is there a programmatic way of forcing the popover element to close?
EDIT: Including code that replicates the problem. These components are used inside a Lightning Community.
HelptextTestParent.cmp
<div class="slds-grid slds-grid_align-end">
<div class="slds-col">
<c:HelptextTestChild />
</div>
</div>
<hr />
<br />
<div class="slds-grid">
<div class="slds-col">
<lightning:button
variant="brand"
label="Navigate"
onclick="{!c.handleNavigate}"
/>
</div>
</div>
HelptextTestParentController.cmp
({
handleNavigate : function(component, event, helper) {
$A.get('e.force:navigateToURL').setParams({
url: '/navigate-to-url-test',
}).fire();
}
})
HelptextTestChild.cmp
<aura:component>
<lightning:helptext content="I stay on screen on iOS devices" />
</aura:component>