fix(ios-modal): closeCallback not being called with popover presentation style (#7189)

Author: Vladimir Amiorkov

e2e/modal-navigation/app/home/home-page.ts

@@ -1,7 +1,7 @@
 import * as application from "tns-core-modules/application";
 import { StackLayout } from "tns-core-modules/ui/layouts/stack-layout";
 import { NavigatedData, Page } from "tns-core-modules/ui/page";
-import { View, EventData } from "tns-core-modules/ui/core/view";
+import { View, EventData, ShowModalOptions } from "tns-core-modules/ui/core/view";
 import { Frame } from "tns-core-modules/ui/frame";
 
 export function onNavigatingTo(args: NavigatedData) {
@@ -29,6 +29,20 @@ export function onModalNoPage(args: EventData) {
         false);
 }
 
+export function onPopoverModal(args: EventData) {
+    const view = args.object as View;
+    let options: ShowModalOptions = {
+        context: "context",
+        closeCallback: () => console.log("home-page modal popover frame closed"),
+        animated: false,
+        ios: {
+            presentationStyle: UIModalPresentationStyle.Popover
+        }
+    }
+
+    view.showModal("modal-no-page/modal-no-page", options);
+}
+
 export function onModalFrame(args: EventData) {
     const view = args.object as View;
 

e2e/modal-navigation/app/home/home-page.xml

@@ -20,6 +20,7 @@
             <Button text="Show Modal Without Page" tap="onModalNoPage" textAlignment="left" />
             <Button text="Show Modal Page With Frame" tap="onModalFrame" textAlignment="left" />
             <Button text="Show Modal Page" tap="onModalPage" textAlignment="left" />
+            <Button text="Show 'popover' modal" tap="onPopoverModal" textAlignment="left" />
             <Button text="Show Modal Layout" tap="onModalLayout" textAlignment="left" />
             <Button text="Show Modal TabView" tap="onModalTabView" textAlignment="left" />
             <Button text="Android Back Btn Events" tap="onAndroidBackEvents" textAlignment="left" />

e2e/modal-navigation/app/modal-no-page/modal-no-page.ts

@@ -3,7 +3,7 @@ import { NavigatedData, Page } from "tns-core-modules/ui/page";
 import { View, EventData } from "tns-core-modules/ui/core/view";
 import { Frame, ShownModallyData } from "tns-core-modules/ui/frame";
 import { fromObject } from "tns-core-modules/data/observable";
-import { confirm } from "ui/dialogs";
+import { confirm } from "tns-core-modules/ui/dialogs";
 
 export function onLoaded(args) {
     console.log("modal-no-page loaded");

e2e/modal-navigation/app/modal/modal-page.ts

@@ -3,7 +3,7 @@ import { NavigatedData, Page } from "tns-core-modules/ui/page";
 import { View, EventData } from "tns-core-modules/ui/core/view";
 import { Frame, ShownModallyData } from "tns-core-modules/ui/frame";
 import { fromObject } from "tns-core-modules/data/observable";
-import { confirm } from "ui/dialogs";
+import { confirm } from "tns-core-modules/ui/dialogs";
 
 export function onShowingModally(args: ShownModallyData) {
     console.log("modal-page showingModally");

e2e/modal-navigation/package.json

@@ -25,6 +25,7 @@
     "nativescript-dev-appium": "next",
     "nativescript-dev-typescript": "next",
     "nativescript-dev-webpack": "next",
+    "tns-platform-declarations": "next",
     "rimraf": "^2.6.2",
     "typescript": "^3.1.6"
   },

e2e/modal-navigation/references.d.ts

@@ -0,0 +1 @@
+/// <reference path="./node_modules/tns-platform-declarations/ios.d.ts" />

tns-core-modules/ui/core/view/view-common.ts

@@ -22,6 +22,7 @@ import {
 } from "../../gestures";
 
 import { createViewFromEntry } from "../../builder";
+import { isAndroid } from "../../../platform";
 import { StyleScope } from "../../styling/style-scope";
 import { LinearGradient } from "../../styling/linear-gradient";
 import { BackgroundRepeat } from "../../styling/style-properties";
@@ -324,7 +325,11 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
                     }
                 }
 
-                that._hideNativeModalView(parent, whenClosedCallback);
+                if (isAndroid || (parent.viewController && parent.viewController.presentedViewController)) {
+                    that._hideNativeModalView(parent, whenClosedCallback);
+                } else {
+                    whenClosedCallback();
+                }
             }
         };
     }

tns-core-modules/ui/core/view/view.ios.ts

@@ -29,6 +29,7 @@ const majorVersion = iosUtils.MajorVersion;
 export class View extends ViewCommon {
     nativeViewProtected: UIView;
     viewController: UIViewController;
+    private _popoverPresentationDelegate: ios.UIPopoverPresentationControllerDelegateImp;
 
     private _isLaidOut = false;
     private _hasTransfrom = false;
@@ -416,6 +417,8 @@ export class View extends ViewCommon {
 
             if (presentationStyle === UIModalPresentationStyle.Popover) {
                 const popoverPresentationController = controller.popoverPresentationController;
+                this._popoverPresentationDelegate = ios.UIPopoverPresentationControllerDelegateImp.initWithOwnerAndCallback(new WeakRef(this), this._closeModalCallback);
+                popoverPresentationController.delegate = this._popoverPresentationDelegate;
                 const view = parent.nativeViewProtected;
                 // Note: sourceView and sourceRect are needed to specify the anchor location for the popover.
                 // Note: sourceView should be the button triggering the modal. If it the Page the popover might appear "behind" the page content
@@ -906,7 +909,7 @@ export namespace ios {
 
         public viewDidLoad(): void {
             super.viewDidLoad();
-    
+
             // Unify translucent and opaque bars layout
             // this.edgesForExtendedLayout = UIRectEdgeBottom;
             this.extendedLayoutIncludesOpaqueBars = true;
@@ -982,4 +985,26 @@ export namespace ios {
             }
         }
     }
+
+    export class UIPopoverPresentationControllerDelegateImp extends NSObject implements UIPopoverPresentationControllerDelegate {
+        public static ObjCProtocols = [UIPopoverPresentationControllerDelegate];
+
+        private owner: WeakRef<View>;
+        private closedCallback: Function;
+
+        public static initWithOwnerAndCallback(owner: WeakRef<View>, whenClosedCallback: Function): UIPopoverPresentationControllerDelegateImp {
+            const instance = <UIPopoverPresentationControllerDelegateImp>super.new();
+            instance.owner = owner;
+            instance.closedCallback = whenClosedCallback;
+
+            return instance;
+        }
+
+        public popoverPresentationControllerDidDismissPopover(popoverPresentationController: UIPopoverPresentationController) {
+            const owner = this.owner.get();
+            if (owner && typeof this.closedCallback === "function") {
+                this.closedCallback();
+            }
+        }
+    }
 }