[SalesForce] component.find(“overlayLib”).notifyClose(); not working inside apex controller’s returned promise

I have a parent component with the <lightning:overlayLibrary aura:id="overlayLib"/> component added.

The parents controller creates an instance of the modal component, assigns it to the body of the modal, and displays the modal using component.find('overlayLib').showCustomModal(). Nothing used in the footer.

Now, inside the modal component I have two buttons, 'Cancel' and 'Save'. Cancel just closes the modal, while Save makes a callout to the apex controller, then closes the modal.

Both button methods utilize component.find("overlayLib").notifyClose();… however, it only works for the Cancel button.

The Save button fires the notifyClose method from the then() function of the promise returned by the apex controller, and this seems to cause an error.

Console Log Error: There is no event definition for event "notify", probably because there is no component to handling it.

submitSaveObject : function(component, saveObj){
    var action = component.get('c.saveConfiguration');
    action.setParams({ "saveObj" : JSON.stringify(saveObj)});

    var actionPromise = new Promise(function (resolve, reject){

        action.setCallback(this, $A.getCallback( function(actionResult){
            var state = actionResult.getState();
            console.log('apex callback result: ');
            if (state === "SUCCESS"){
                var result = actionResult.getReturnValue();
                resolve(result);        
            } else if (state === "ERROR"){
                reject();
            }

        }));

        $A.enqueueAction(action);       
    });

    actionPromise.then(function(returnValue){
        alert('Save successful!');
        //this is throwing an error
        component.find("overlayLib").notifyClose();

    });
}

How can I successfully close the modal in such a way that it is enqueued after the asynch call to the apex controller?

Best Answer

Did you tried by adding a callback in .then

actionPromise.then($A.getCallback(function(returnValue){
        alert('Save successful!');
        //this is throwing an error
        component.find("overlayLib").notifyClose();

    }));