1

I'm trying to get the popover example from the Salesforce documentation working and it's giving me an interupt error with "Cannot read property 'na' of undefined" message.

All I have done is copy from: https://developer.salesforce.com/docs/component-library/bundle/lightning:overlayLibrary/documentation

Have I missed something obvious? Thanksenter image description here

App

    <aura:application description="PopoverApp" extends="force:slds" access="GLOBAL" implements="ltng:allowGuestAccess">
    <c:PopoverCmp />
</aura:application>

Component

<aura:component description="PopoverCmp">
    <lightning:overlayLibrary aura:id="overlayLib"/>
    <lightning:button name="popover" label="Show Popover" onclick="{!c.handleShowPopover}"/>
    <div class="mypopover" onmouseover="{!c.handleShowPopover}">Popover should display if you hover over here.</div>
</aura:component>

Controller

({
handleShowPopover : function(component, event, helper) {
    component.find('overlayLib').showCustomPopover({
        body: "Popovers are positioned relative to a reference element",
        referenceSelector: ".mypopover",
        cssClass: "popoverclass, cMyCmp"
    }).then(function (overlay) {
        setTimeout(function(){ 
            //close the popover after 3 seconds
            overlay.close(); 
        }, 3000);
    });
}
})

CSS

    .THIS.popoverclass {
    min-height: 100px;
}

.THIS.no-pointer .pointer{
    visibility: hidden;
}
5
  • How are you calling the component, in aura:application or using component in record page with app builder?
    – Raul
    Nov 21, 2018 at 17:47
  • Hi Raul, I'm just using a basic app. I can add it to the description ..one second
    – Jay
    Nov 21, 2018 at 17:49
  • Last time I checked lightning:overlayLibrary was not supported in aura:application
    – Raul
    Nov 21, 2018 at 17:51
  • Hmm ok thanks. Let me try another way.. thanks for your input
    – Jay
    Nov 21, 2018 at 18:22
  • Hi Raul, it works when I use it with lightning app builder so I think you're right. Feel free to add it as an answer and I can mark it as correct
    – Jay
    Nov 22, 2018 at 15:29

1 Answer 1

2

lightning:overlayLibrary does not work in aura:application.

Use component inside any component in app builder, where it works.

0

You must log in to answer this question.

Not the answer you're looking for? Browse other questions tagged .