@coolon/angular-ui-powerups 0.0.116 → 0.0.118

package/esm5/lib/place/guards/navigation-state.js

@@ -17,6 +17,7 @@ NavigationState = /** @class */ (function (_super) {
         var _this = _super.call(this) || this;
         _this.context = context;
         _this._visits = new Map();
+        _this.debugPropertyKeys = [];
         return _this;
     }
     Object.defineProperty(NavigationState.prototype, "name", {
@@ -237,14 +238,18 @@ NavigationState = /** @class */ (function (_super) {
     function (event) {
         /** @type {?} */
         var popstate = event.navigationTrigger === 'popstate';
-        return popstate ?
-            this.interactionService.isActive() ?
-                new NavigationState.InteractionPopStateTransition(this.context, this.currentRouterUrl()) :
-                new NavigationState.PopStateTransition(this.context, this.currentRouterUrl())
-            :
-                this.interactionService.isActive() ?
-                    new NavigationState.InteractionTransition(this.context, this.currentRouterUrl()) :
-                    new NavigationState.NavigationTransition(this.context, this.currentRouterUrl());
+        /** @type {?} */
+        var inInteraction = this.interactionService.isActive();
+        if (popstate) {
+            return inInteraction ?
+                new NavigationState.LeavingInteractionAfterPopStateTransition(this.context, this.currentRouterUrl(), event.url) :
+                new NavigationState.PopStateTransition(this.context, this.currentRouterUrl(), event.url);
+        }
+        else {
+            return inInteraction ?
+                new NavigationState.StartingInteractionTransition(this.context, this.currentRouterUrl()) :
+                new NavigationState.NavigationTransition(this.context, this.currentRouterUrl());
+        }
     };
     /**
      * @protected
@@ -259,17 +264,36 @@ NavigationState = /** @class */ (function (_super) {
             new NavigationState.IdleDuringInteraction(this.context, this.currentRouterUrl()) :
             new NavigationState.Idle(this.context);
     };
+    //
+    //
     /**
      * @param {?} url
      * @return {?}
      */
-    NavigationState.prototype.resetBrowserLocation = /**
+    NavigationState.prototype.resetBrowserLocation = 
+    //
+    /**
      * @param {?} url
      * @return {?}
      */
     function (url) {
         this.placeRouter.resetBrowserLocation(url);
     };
+    /**
+     * @param {?} event
+     * @param {?=} reason
+     * @return {?}
+     */
+    NavigationState.prototype.ignore = /**
+     * @param {?} event
+     * @param {?=} reason
+     * @return {?}
+     */
+    function (event, reason) {
+        reason = reason ? " -> " + reason : '';
+        Logger.get(this).info("Ignoring router event" + reason + ": " + event.constructor.name + " -> " + event.url + " :: " + this.toString());
+        return this;
+    };
     /**
      * @return {?}
      */
@@ -277,7 +301,27 @@ NavigationState = /** @class */ (function (_super) {
      * @return {?}
      */
     function () {
-        return this.constructor.name;
+        return this.constructor.name + "(" + this.debugState() + ")";
+    };
+    /**
+     * @protected
+     * @param {?=} properties
+     * @return {?}
+     */
+    NavigationState.prototype.debugState = /**
+     * @protected
+     * @param {?=} properties
+     * @return {?}
+     */
+    function (properties) {
+        var _this = this;
+        return (properties || this.debugPropertyKeys).map((/**
+         * @param {?} p
+         * @return {?}
+         */
+        function (p) {
+            return p + ": " + _this[p];
+        })).join(', ');
     };
     return NavigationState;
 }(GarbageCollector));
@@ -297,6 +341,8 @@ if (false) {
     NavigationState.prototype.startingUrl;
     /** @type {?} */
     NavigationState.prototype.isPopState;
+    /** @type {?} */
+    NavigationState.prototype.debugPropertyKeys;
     /**
      * @type {?}
      * @protected
@@ -362,7 +408,7 @@ if (false) {
             }
             if (this.placeRouter.hasActiveInteractionIds(event.url)) {
                 Logger.get(this).info("navigation started with interaction outlet -> " + event.url);
-                return new InteractionTransition(this.context, event.url);
+                return new StartingInteractionTransition(this.context, event.url);
             }
             else {
                 return this.createTransitionStateFor(event);
@@ -455,14 +501,14 @@ if (false) {
             return new Idle(this.context);
         };
         /**
-         * @param {?} locationTriggerUrl
+         * @param {?} newUrl
          * @return {?}
          */
         AbstractNavigationTransition.prototype.onBackClickedDuringNavigationInteraction = /**
-         * @param {?} locationTriggerUrl
+         * @param {?} newUrl
          * @return {?}
          */
-        function (locationTriggerUrl) {
+        function (newUrl) {
             Logger.get(this).info("back button pressed during navigation session interaction promise");
             // detach the interaction from the session so it doesn't get disposed until the activity has completed.
             /** @type {?} */
@@ -470,25 +516,22 @@ if (false) {
             var when = Dsl.disposeWith(navigationInteraction).when;
             // TODO: I need to make the exclusive interaction context disallow nested activities or
             //       that would mess things up entirely. Or, can I do a context.abortAll().then(..)
+            Logger.get(this).info('cancelling current navigation activity..');
             navigationInteraction.cancelActiveActivity().then((/**
              * @return {?}
              */
             function () {
                 navigationInteraction.dispose();
             }));
-            return new CancelledDuringNavigationInteraction(this.context, this.startingUrl, this.isPopState, locationTriggerUrl);
+            return this.createNavigationInteractionCancelledState(newUrl);
         };
-        // @Trace()
-        // @Trace()
         /**
          * @param {?} component
          * @param {?} currentUrl
          * @param {?} nextUrl
          * @return {?}
          */
-        AbstractNavigationTransition.prototype.canDeactivatePlace = 
-        // @Trace()
-        /**
+        AbstractNavigationTransition.prototype.canDeactivatePlace = /**
          * @param {?} component
          * @param {?} currentUrl
          * @param {?} nextUrl
@@ -510,11 +553,11 @@ if (false) {
             });
         };
         /**
-         * @private
+         * @protected
          * @return {?}
          */
         AbstractNavigationTransition.prototype.detachInteractionContext = /**
-         * @private
+         * @protected
          * @return {?}
          */
         function () {
@@ -541,12 +584,19 @@ if (false) {
         AbstractNavigationTransition.prototype._interactionContext;
         /** @type {?} */
         AbstractNavigationTransition.prototype.startingUrl;
+        /**
+         * @abstract
+         * @param {?} newUrl
+         * @return {?}
+         */
+        AbstractNavigationTransition.prototype.createNavigationInteractionCancelledState = function (newUrl) { };
     }
     var NavigationTransition = /** @class */ (function (_super) {
         tslib_1.__extends(NavigationTransition, _super);
         function NavigationTransition() {
             var _this = _super !== null && _super.apply(this, arguments) || this;
             _this.isPopState = false;
+            _this.debugPropertyKeys = ['startingUrl'];
             return _this;
         }
         /**
@@ -573,13 +623,15 @@ if (false) {
             return new Idle(this.context);
         };
         /**
+         * @param {?} newUrl
          * @return {?}
          */
-        NavigationTransition.prototype.toString = /**
+        NavigationTransition.prototype.createNavigationInteractionCancelledState = /**
+         * @param {?} newUrl
          * @return {?}
          */
-        function () {
-            return this.constructor.name + "(startingUrl: " + this.startingUrl + ")";
+        function (newUrl) {
+            return new LinkTriggeredNavigationInteractionCancelled(this.context, this.startingUrl, newUrl);
         };
         return NavigationTransition;
     }(AbstractNavigationTransition));
@@ -587,12 +639,16 @@ if (false) {
     if (false) {
         /** @type {?} */
         NavigationTransition.prototype.isPopState;
+        /** @type {?} */
+        NavigationTransition.prototype.debugPropertyKeys;
     }
     var PopStateTransition = /** @class */ (function (_super) {
         tslib_1.__extends(PopStateTransition, _super);
-        function PopStateTransition() {
-            var _this = _super !== null && _super.apply(this, arguments) || this;
+        function PopStateTransition(context, startingUrl, poppedHistoryUrl) {
+            var _this = _super.call(this, context, startingUrl) || this;
+            _this.poppedHistoryUrl = poppedHistoryUrl;
             _this.isPopState = true;
+            _this.debugPropertyKeys = ['startingUrl', 'poppedHistoryUrl'];
             return _this;
         }
         /**
@@ -607,7 +663,8 @@ if (false) {
             // Angular doesn't preserve the url when a guard cancels the back button.
             // See https://github.com/angular/angular/issues/13586#issuecomment-432795720
             Logger.get(this).info('WORK-AROUND: Updating browser location after pop state - see angular issue #13586');
-            this.resetBrowserLocation(this.startingUrl);
+            this.resetBrowserLocation(this.poppedHistoryUrl); // put the popped history item back in.
+            this.resetBrowserLocation(this.startingUrl); // and now put our own url back in.
             return new Idle(this.context);
         };
         /**
@@ -624,24 +681,75 @@ if (false) {
                 // Angular doesn't preserve the url when a guard cancels the back button.
                 // See https://github.com/angular/angular/issues/13586#issuecomment-432795720
                 Logger.get(this).info('WORK-AROUND: Updating browser location after pop state - see angular issue #13586');
-                this.resetBrowserLocation(this.startingUrl);
+                this.resetBrowserLocation(this.poppedHistoryUrl); // put the popped history item back in.
+                this.resetBrowserLocation(this.startingUrl); // and now put our own url back in.
             }
             return new Idle(this.context);
         };
+        /**
+         * @param {?} locationTriggerUrl
+         * @return {?}
+         */
+        PopStateTransition.prototype.createNavigationInteractionCancelledState = /**
+         * @param {?} locationTriggerUrl
+         * @return {?}
+         */
+        function (locationTriggerUrl) {
+            return new PopStateTriggeredNavigationInteractionCancelled(this.context, this.startingUrl, locationTriggerUrl, this.poppedHistoryUrl);
+        };
         return PopStateTransition;
     }(AbstractNavigationTransition));
     NavigationState.PopStateTransition = PopStateTransition;
     if (false) {
         /** @type {?} */
         PopStateTransition.prototype.isPopState;
+        /** @type {?} */
+        PopStateTransition.prototype.debugPropertyKeys;
+        /** @type {?} */
+        PopStateTransition.prototype.poppedHistoryUrl;
     }
-    var IdleDuringInteraction = /** @class */ (function (_super) {
+    /**
+     * @abstract
+     */
+    var /**
+     * @abstract
+     */
+    AbstractInteractionTransition = /** @class */ (function (_super) {
+        tslib_1.__extends(AbstractInteractionTransition, _super);
+        function AbstractInteractionTransition(context, startingUrl) {
+            var _this = _super.call(this, context, startingUrl) || this;
+            _this.startingUrl = startingUrl;
+            _this.isTransitional = true;
+            return _this;
+        }
+        return AbstractInteractionTransition;
+    }(AbstractNavigationTransition));
+    NavigationState.AbstractInteractionTransition = AbstractInteractionTransition;
+    if (false) {
+        /** @type {?} */
+        AbstractInteractionTransition.prototype.isTransitional;
+        /** @type {?} */
+        AbstractInteractionTransition.prototype.startingUrl;
+    }
+    // The following states exist to handle all events while any kind of navigation is in progress.  That way all other states can
+    // happily ignore interaction contexts.
+    /**
+     * This is the non transitional (i.e. rest) state that is used whenever an interaction context is active.
+     */
+    var 
+    // The following states exist to handle all events while any kind of navigation is in progress.  That way all other states can
+    // happily ignore interaction contexts.
+    /**
+     * This is the non transitional (i.e. rest) state that is used whenever an interaction context is active.
+     */
+    IdleDuringInteraction = /** @class */ (function (_super) {
         tslib_1.__extends(IdleDuringInteraction, _super);
         function IdleDuringInteraction(context, startingUrl) {
             var _this = _super.call(this, context) || this;
             _this.startingUrl = startingUrl;
             _this.isTransitional = false;
             _this.isPopState = false;
+            _this.debugPropertyKeys = ['startingUrl'];
             return _this;
         }
         /**
@@ -655,40 +763,34 @@ if (false) {
          * @return {?}
          */
         function (visit, initialUrl) {
+            // we're in an interaction and the user clicked back
             /** @type {?} */
-            var navigationTransition = new InteractionTransition(this.context, initialUrl);
+            var navigationTransition = new StartingInteractionTransition(this.context, initialUrl);
             navigationTransition.storeVisit(visit);
             return navigationTransition;
         };
-        // @Trace()
-        // @Trace()
         /**
          * @param {?} event
          * @return {?}
          */
-        IdleDuringInteraction.prototype.onRouterStarted = 
-        // @Trace()
-        /**
+        IdleDuringInteraction.prototype.onRouterStarted = /**
          * @param {?} event
          * @return {?}
          */
         function (event) {
-            return new InteractionTransition(this.context, event.url);
+            return new StartingInteractionTransition(this.context, event.url);
         };
-        // @Trace()
-        // @Trace()
         /**
          * @param {?} event
          * @return {?}
          */
-        IdleDuringInteraction.prototype.onPopState = 
-        // @Trace()
-        /**
+        IdleDuringInteraction.prototype.onPopState = /**
          * @param {?} event
          * @return {?}
          */
         function (event) {
-            return new InteractionPopStateTransition(this.context, event.url);
+            // we're in an interaction and the user clicked back
+            return new LeavingInteractionAfterPopStateTransition(this.context, event.url, event.url);
         };
         return IdleDuringInteraction;
     }(NavigationState));
@@ -699,55 +801,34 @@ if (false) {
         /** @type {?} */
         IdleDuringInteraction.prototype.isPopState;
         /** @type {?} */
-        IdleDuringInteraction.prototype.startingUrl;
-    }
-    /**
-     * @abstract
-     */
-    var /**
-     * @abstract
-     */
-    AbstractInteractionTransition = /** @class */ (function (_super) {
-        tslib_1.__extends(AbstractInteractionTransition, _super);
-        function AbstractInteractionTransition(context, startingUrl) {
-            var _this = _super.call(this, context, startingUrl) || this;
-            _this.startingUrl = startingUrl;
-            _this.isTransitional = true;
-            return _this;
-        }
-        return AbstractInteractionTransition;
-    }(AbstractNavigationTransition));
-    NavigationState.AbstractInteractionTransition = AbstractInteractionTransition;
-    if (false) {
-        /** @type {?} */
-        AbstractInteractionTransition.prototype.isTransitional;
+        IdleDuringInteraction.prototype.debugPropertyKeys;
         /** @type {?} */
-        AbstractInteractionTransition.prototype.startingUrl;
+        IdleDuringInteraction.prototype.startingUrl;
     }
     /**
      * This state exists to handle all events while any kind of navigation is in progress.  That way all other states can
      * happily ignore interaction contexts.
+     * NOTE: This state is activated when ever an interaction is started.  It might be better to split it into
+     *       different states for different scenarios, e.g. starting model, starting model during route guard etc.
      */
     var /**
      * This state exists to handle all events while any kind of navigation is in progress.  That way all other states can
      * happily ignore interaction contexts.
+     * NOTE: This state is activated when ever an interaction is started.  It might be better to split it into
+     *       different states for different scenarios, e.g. starting model, starting model during route guard etc.
      */
-    InteractionTransition = /** @class */ (function (_super) {
-        tslib_1.__extends(InteractionTransition, _super);
-        function InteractionTransition() {
+    StartingInteractionTransition = /** @class */ (function (_super) {
+        tslib_1.__extends(StartingInteractionTransition, _super);
+        function StartingInteractionTransition() {
             var _this = _super !== null && _super.apply(this, arguments) || this;
             _this.isPopState = false;
             return _this;
         }
-        // @Trace()
-        // @Trace()
         /**
          * @param {?} event
          * @return {?}
          */
-        InteractionTransition.prototype.onRouterCancelled = 
-        // @Trace()
-        /**
+        StartingInteractionTransition.prototype.onRouterCancelled = /**
          * @param {?} event
          * @return {?}
          */
@@ -762,15 +843,11 @@ if (false) {
                 return new Idle(this.context);
             }
         };
-        // @Trace()
-        // @Trace()
         /**
          * @param {?} event
          * @return {?}
          */
-        InteractionTransition.prototype.onRouterError = 
-        // @Trace()
-        /**
+        StartingInteractionTransition.prototype.onRouterError = /**
          * @param {?} event
          * @return {?}
          */
@@ -778,15 +855,11 @@ if (false) {
             // navigation was aborted.
             return new IdleDuringInteraction(this.context, this.startingUrl);
         };
-        // @Trace()
-        // @Trace()
         /**
          * @param {?} event
          * @return {?}
          */
-        InteractionTransition.prototype.onRouterEnd = 
-        // @Trace()
-        /**
+        StartingInteractionTransition.prototype.onRouterEnd = /**
          * @param {?} event
          * @return {?}
          */
@@ -798,12 +871,163 @@ if (false) {
                 return new Idle(this.context);
             }
         };
-        return InteractionTransition;
+        /**
+         * @param {?} locationTriggerUrl
+         * @return {?}
+         */
+        StartingInteractionTransition.prototype.createNavigationInteractionCancelledState = /**
+         * @param {?} locationTriggerUrl
+         * @return {?}
+         */
+        function (locationTriggerUrl) {
+            return new LeavingInteractionTransitionCancelled(this.context, this.startingUrl, locationTriggerUrl);
+        };
+        return StartingInteractionTransition;
     }(AbstractInteractionTransition));
-    NavigationState.InteractionTransition = InteractionTransition;
+    NavigationState.StartingInteractionTransition = StartingInteractionTransition;
     if (false) {
         /** @type {?} */
-        InteractionTransition.prototype.isPopState;
+        StartingInteractionTransition.prototype.isPopState;
+    }
+    /**
+     * The sequence of router events are:
+     * Error -> url = url of navigation link
+     * End
+     * onPopState url = current intereaction url sans the query params
+     * Cancel url == same as above.
+     */
+    var /**
+     * The sequence of router events are:
+     * Error -> url = url of navigation link
+     * End
+     * onPopState url = current intereaction url sans the query params
+     * Cancel url == same as above.
+     */
+    LeavingInteractionTransitionCancelled = /** @class */ (function (_super) {
+        tslib_1.__extends(LeavingInteractionTransitionCancelled, _super);
+        function LeavingInteractionTransitionCancelled(context, startingUrl, locationChangeTriggerUrl) {
+            var _this = _super.call(this, context) || this;
+            _this.startingUrl = startingUrl;
+            _this.locationChangeTriggerUrl = locationChangeTriggerUrl;
+            _this.isPopState = false;
+            _this.firstCancelHandled = false;
+            _this.popStateHandled = false;
+            _this.debugPropertyKeys = ['idle', 'startingUrl', 'poppedHistoryUrl', 'locationChangeTriggerUrl', 'popStateEventUrl', 'firstCancelHandled', 'popStateHandled'];
+            return _this;
+        }
+        Object.defineProperty(LeavingInteractionTransitionCancelled.prototype, "isTransitional", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                return true;
+            },
+            enumerable: true,
+            configurable: true
+        });
+        /**
+         * @param {?} event
+         * @return {?}
+         */
+        LeavingInteractionTransitionCancelled.prototype.onRouterStarted = /**
+         * @param {?} event
+         * @return {?}
+         */
+        function (event) {
+            return this.ignore(event);
+        };
+        /**
+         * @param {?} event
+         * @return {?}
+         */
+        LeavingInteractionTransitionCancelled.prototype.onRouterCancelled = /**
+         * @param {?} event
+         * @return {?}
+         */
+        function (event) {
+            // Angular doesn't preserve the url when a guard cancels the back button.
+            // See https://github.com/angular/angular/issues/13586#issuecomment-432795720
+            Logger.get(this).info('WORK-AROUND: Updating browser location after pop state - see angular issue #13586');
+            if (this.interactionService.isActive()) {
+                /** @type {?} */
+                var interactionIds = this.interactionService.activeInteractionContextIds.value;
+                this.resetBrowserLocation(this.placeRouter.parseUrl(this.startingUrl).updateInteractionIds(interactionIds).url);
+            }
+            else {
+                this.resetBrowserLocation(this.startingUrl); // and now put our own url back in.
+            }
+            return this.createIdleState();
+        };
+        /**
+         * @param {?} event
+         * @return {?}
+         */
+        LeavingInteractionTransitionCancelled.prototype.onRouterEnd = /**
+         * @param {?} event
+         * @return {?}
+         */
+        function (event) {
+            return this.ignore(event);
+        };
+        /**
+         * @param {?} event
+         * @return {?}
+         */
+        LeavingInteractionTransitionCancelled.prototype.onRouterError = /**
+         * @param {?} event
+         * @return {?}
+         */
+        function (event) {
+            return this.ignore(event);
+        };
+        /**
+         * @param {?} event
+         * @return {?}
+         */
+        LeavingInteractionTransitionCancelled.prototype.onPopState = /**
+         * @param {?} event
+         * @return {?}
+         */
+        function (event) {
+            return this.ignore(event);
+        };
+        /**
+         * @param {?} component
+         * @param {?} currentUrl
+         * @param {?} nextUrl
+         * @return {?}
+         */
+        LeavingInteractionTransitionCancelled.prototype.canDeactivatePlace = /**
+         * @param {?} component
+         * @param {?} currentUrl
+         * @param {?} nextUrl
+         * @return {?}
+         */
+        function (component, currentUrl, nextUrl) {
+            return tslib_1.__awaiter(this, void 0, void 0, function () {
+                return tslib_1.__generator(this, function (_a) {
+                    return [2 /*return*/, false];
+                });
+            });
+        };
+        return LeavingInteractionTransitionCancelled;
+    }(NavigationState));
+    NavigationState.LeavingInteractionTransitionCancelled = LeavingInteractionTransitionCancelled;
+    if (false) {
+        /** @type {?} */
+        LeavingInteractionTransitionCancelled.prototype.isPopState;
+        /** @type {?} */
+        LeavingInteractionTransitionCancelled.prototype.firstCancelHandled;
+        /** @type {?} */
+        LeavingInteractionTransitionCancelled.prototype.popStateHandled;
+        /** @type {?} */
+        LeavingInteractionTransitionCancelled.prototype.popStateEventUrl;
+        /** @type {?} */
+        LeavingInteractionTransitionCancelled.prototype.debugPropertyKeys;
+        /** @type {?} */
+        LeavingInteractionTransitionCancelled.prototype.startingUrl;
+        /** @type {?} */
+        LeavingInteractionTransitionCancelled.prototype.locationChangeTriggerUrl;
     }
     /**
      * This state exists to handle all events while any kind of navigation is in progress.  That way all other states can
@@ -813,22 +1037,19 @@ if (false) {
      * This state exists to handle all events while any kind of navigation is in progress.  That way all other states can
      * happily ignore interaction contexts.
      */
-    InteractionPopStateTransition = /** @class */ (function (_super) {
-        tslib_1.__extends(InteractionPopStateTransition, _super);
-        function InteractionPopStateTransition() {
-            var _this = _super !== null && _super.apply(this, arguments) || this;
+    LeavingInteractionAfterPopStateTransition = /** @class */ (function (_super) {
+        tslib_1.__extends(LeavingInteractionAfterPopStateTransition, _super);
+        function LeavingInteractionAfterPopStateTransition(context, startingUrl, poppedHistoryUrl) {
+            var _this = _super.call(this, context, startingUrl) || this;
+            _this.poppedHistoryUrl = poppedHistoryUrl;
             _this.isPopState = true;
             return _this;
         }
-        // @Trace()
-        // @Trace()
         /**
          * @param {?} event
          * @return {?}
          */
-        InteractionPopStateTransition.prototype.onRouterCancelled = 
-        // @Trace()
-        /**
+        LeavingInteractionAfterPopStateTransition.prototype.onRouterCancelled = /**
          * @param {?} event
          * @return {?}
          */
@@ -843,15 +1064,11 @@ if (false) {
                 return new Idle(this.context);
             }
         };
-        // @Trace()
-        // @Trace()
         /**
          * @param {?} event
          * @return {?}
          */
-        InteractionPopStateTransition.prototype.onRouterEnd = 
-        // @Trace()
-        /**
+        LeavingInteractionAfterPopStateTransition.prototype.onRouterEnd = /**
          * @param {?} event
          * @return {?}
          */
@@ -863,25 +1080,219 @@ if (false) {
                 return new Idle(this.context);
             }
         };
-        return InteractionPopStateTransition;
+        /**
+         * @param {?} newUrl
+         * @return {?}
+         */
+        LeavingInteractionAfterPopStateTransition.prototype.createNavigationInteractionCancelledState = /**
+         * @param {?} newUrl
+         * @return {?}
+         */
+        function (newUrl) {
+            return this.illegalTransition("Leaving interaction after pop-state should't block so should never see a back button click");
+        };
+        return LeavingInteractionAfterPopStateTransition;
     }(AbstractInteractionTransition));
-    NavigationState.InteractionPopStateTransition = InteractionPopStateTransition;
+    NavigationState.LeavingInteractionAfterPopStateTransition = LeavingInteractionAfterPopStateTransition;
     if (false) {
         /** @type {?} */
-        InteractionPopStateTransition.prototype.isPopState;
+        LeavingInteractionAfterPopStateTransition.prototype.isPopState;
+        /** @type {?} */
+        LeavingInteractionAfterPopStateTransition.prototype.poppedHistoryUrl;
     }
-    var CancelledDuringNavigationInteraction = /** @class */ (function (_super) {
-        tslib_1.__extends(CancelledDuringNavigationInteraction, _super);
-        function CancelledDuringNavigationInteraction(context, startingUrl, startingEventWasAPopState, locationChangeTriggerUrl) {
+    // See LeavingInteractionAfterPopStateTransition.createNavigationInteractionCancelledState(...) above.
+    //
+    // export class LeavingInteractionAfterPopStateCancelled extends NavigationState {
+    //
+    //   readonly isPopState = false;
+    //   firstCancelHandled = false;
+    //   popStateHandled = false;
+    //   popStateEventUrl: string;
+    //   debugPropertyKeys = ['idle', 'startingUrl', 'poppedHistoryUrl', 'locationChangeTriggerUrl', 'popStateEventUrl', 'firstCancelHandled', 'popStateHandled'];
+    //
+    //   constructor(context: Context,
+    //               readonly startingUrl: string,
+    //               readonly locationChangeTriggerUrl: string,
+    //               readonly poppedHistoryUrl: string) {
+    //     super(context);
+    //   }
+    //
+    //   get isTransitional() {
+    //     return true;
+    //   }
+    //
+    //   onRouterStarted(event: NavigationStart): NavigationState {
+    //     return this.ignore(event);
+    //   }
+    //
+    //
+    //   onRouterCancelled(event: NavigationCancel): NavigationState {
+    //
+    //     // if (this.firstCancelHandled && this.popStateHandled) {
+    //     //   // Angular doesn't preserve the url when a guard cancels the back button.
+    //     //   // See https://github.com/angular/angular/issues/13586#issuecomment-432795720
+    //     //   Logger.get(this).info('WORK-AROUND: Updating browser location after pop state - see angular issue #13586');
+    //     //   this.resetBrowserLocation(this.locationChangeTriggerUrl); // put the second back click one back in.
+    //     //   this.resetBrowserLocation(this.poppedHistoryUrl); // put the first back click one back in.
+    //     //   if (this.interactionService.isActive()) {
+    //     //     const interactionIds = this.interactionService.activeInteractionContextIds.value;
+    //     //     this.resetBrowserLocation(this.placeRouter.parseUrl(this.startingUrl).updateInteractionIds(interactionIds).url);
+    //     //   } else {
+    //     //     this.resetBrowserLocation(this.startingUrl); // and now put our own url back in.
+    //     //   }
+    //     //   return this.createIdleState();
+    //     // } else {
+    //     //   this.firstCancelHandled = true;
+    //     return this.ignore(event);
+    //     // }
+    //   }
+    //
+    //
+    //   onRouterEnd(event: NavigationEnd): NavigationState {
+    //     return this.ignore(event);
+    //   }
+    //
+    //
+    //   onRouterError(event: NavigationError): NavigationState {
+    //     return this.ignore(event);
+    //   }
+    //
+    //
+    //   onPopState(event: NavigationStart): NavigationState {
+    //     // this.popStateHandled = true;
+    //     // this.popStateEventUrl = event.url;
+    //     return this.ignore(event);
+    //   }
+    //
+    //   async canDeactivatePlace(component: PlaceComponent, currentUrl: UrlSnapshot, nextUrl: UrlSnapshot): Promise<boolean | UrlSnapshot> {
+    //     return false;
+    //   }
+    // }
+    /**
+     * This state handles the scenario where a link navigation triggered an interaction and the user clicked back a to cancel it.
+     * The routing event sequence is different depending on the link that was clicked.
+     *
+     * If the link was the same as the previous history location (i.e. they've gone back via a link rather than clicking back) then the sequence is:
+     *
+     * -> Idle -> NavigationTransition
+     * -> confirm dialog shown.
+     * -> click back
+     * -> NavigationCancel -> clickedLinkUrl === cancel.url
+     * -> NavigationEnd
+     *
+     * Otherwise if the link is different from teh history location then the sequence is:
+     *
+     * -> Idle -> NavigationTransition
+     * -> confirm dialog shown.
+     * -> click back
+     * -> NavigationCancel -> clickedLinkUrl !== cancel.url
+     * -> NavigationEnd
+     * -> PopState
+     * -> NavigationCancel
+     */
+    var 
+    // See LeavingInteractionAfterPopStateTransition.createNavigationInteractionCancelledState(...) above.
+    //
+    // export class LeavingInteractionAfterPopStateCancelled extends NavigationState {
+    //
+    //   readonly isPopState = false;
+    //   firstCancelHandled = false;
+    //   popStateHandled = false;
+    //   popStateEventUrl: string;
+    //   debugPropertyKeys = ['idle', 'startingUrl', 'poppedHistoryUrl', 'locationChangeTriggerUrl', 'popStateEventUrl', 'firstCancelHandled', 'popStateHandled'];
+    //
+    //   constructor(context: Context,
+    //               readonly startingUrl: string,
+    //               readonly locationChangeTriggerUrl: string,
+    //               readonly poppedHistoryUrl: string) {
+    //     super(context);
+    //   }
+    //
+    //   get isTransitional() {
+    //     return true;
+    //   }
+    //
+    //   onRouterStarted(event: NavigationStart): NavigationState {
+    //     return this.ignore(event);
+    //   }
+    //
+    //
+    //   onRouterCancelled(event: NavigationCancel): NavigationState {
+    //
+    //     // if (this.firstCancelHandled && this.popStateHandled) {
+    //     //   // Angular doesn't preserve the url when a guard cancels the back button.
+    //     //   // See https://github.com/angular/angular/issues/13586#issuecomment-432795720
+    //     //   Logger.get(this).info('WORK-AROUND: Updating browser location after pop state - see angular issue #13586');
+    //     //   this.resetBrowserLocation(this.locationChangeTriggerUrl); // put the second back click one back in.
+    //     //   this.resetBrowserLocation(this.poppedHistoryUrl); // put the first back click one back in.
+    //     //   if (this.interactionService.isActive()) {
+    //     //     const interactionIds = this.interactionService.activeInteractionContextIds.value;
+    //     //     this.resetBrowserLocation(this.placeRouter.parseUrl(this.startingUrl).updateInteractionIds(interactionIds).url);
+    //     //   } else {
+    //     //     this.resetBrowserLocation(this.startingUrl); // and now put our own url back in.
+    //     //   }
+    //     //   return this.createIdleState();
+    //     // } else {
+    //     //   this.firstCancelHandled = true;
+    //     return this.ignore(event);
+    //     // }
+    //   }
+    //
+    //
+    //   onRouterEnd(event: NavigationEnd): NavigationState {
+    //     return this.ignore(event);
+    //   }
+    //
+    //
+    //   onRouterError(event: NavigationError): NavigationState {
+    //     return this.ignore(event);
+    //   }
+    //
+    //
+    //   onPopState(event: NavigationStart): NavigationState {
+    //     // this.popStateHandled = true;
+    //     // this.popStateEventUrl = event.url;
+    //     return this.ignore(event);
+    //   }
+    //
+    //   async canDeactivatePlace(component: PlaceComponent, currentUrl: UrlSnapshot, nextUrl: UrlSnapshot): Promise<boolean | UrlSnapshot> {
+    //     return false;
+    //   }
+    // }
+    /**
+     * This state handles the scenario where a link navigation triggered an interaction and the user clicked back a to cancel it.
+     * The routing event sequence is different depending on the link that was clicked.
+     *
+     * If the link was the same as the previous history location (i.e. they've gone back via a link rather than clicking back) then the sequence is:
+     *
+     * -> Idle -> NavigationTransition
+     * -> confirm dialog shown.
+     * -> click back
+     * -> NavigationCancel -> clickedLinkUrl === cancel.url
+     * -> NavigationEnd
+     *
+     * Otherwise if the link is different from teh history location then the sequence is:
+     *
+     * -> Idle -> NavigationTransition
+     * -> confirm dialog shown.
+     * -> click back
+     * -> NavigationCancel -> clickedLinkUrl !== cancel.url
+     * -> NavigationEnd
+     * -> PopState
+     * -> NavigationCancel
+     */
+    LinkTriggeredNavigationInteractionCancelled = /** @class */ (function (_super) {
+        tslib_1.__extends(LinkTriggeredNavigationInteractionCancelled, _super);
+        function LinkTriggeredNavigationInteractionCancelled(context, startingUrl, clickedLinkUrl) {
             var _this = _super.call(this, context) || this;
             _this.startingUrl = startingUrl;
-            _this.startingEventWasAPopState = startingEventWasAPopState;
-            _this.locationChangeTriggerUrl = locationChangeTriggerUrl;
+            _this.clickedLinkUrl = clickedLinkUrl;
             _this.isPopState = false;
-            _this.gotPopStateWithLeavingUrl = false;
+            _this.clickedLinkMatchedBackButtonUrl = false;
+            _this.debugPropertyKeys = ['idle', 'startingUrl', 'clickedLinkUrl', 'firstCancelEventUrl', 'clickedLinkMatchedBackButtonUrl', 'popStateEventUrl'];
             return _this;
         }
-        Object.defineProperty(CancelledDuringNavigationInteraction.prototype, "isTransitional", {
+        Object.defineProperty(LinkTriggeredNavigationInteractionCancelled.prototype, "isTransitional", {
             get: /**
              * @return {?}
              */
@@ -895,53 +1306,56 @@ if (false) {
          * @param {?} event
          * @return {?}
          */
-        CancelledDuringNavigationInteraction.prototype.onRouterStarted = /**
+        LinkTriggeredNavigationInteractionCancelled.prototype.onRouterStarted = /**
          * @param {?} event
          * @return {?}
          */
         function (event) {
             return this.ignore(event);
         };
-        // @Trace()
-        // @Trace()
         /**
          * @param {?} event
          * @return {?}
          */
-        CancelledDuringNavigationInteraction.prototype.onRouterCancelled = 
-        // @Trace()
-        /**
+        LinkTriggeredNavigationInteractionCancelled.prototype.onRouterCancelled = /**
          * @param {?} event
          * @return {?}
          */
         function (event) {
-            // Depending on the state of the router and what was done we get a different
-            // sequence of events.
-            // If the navigation change was triggered by clicking a link we'll get a cancel with the locationChangeTriggerUrl as the final event.
-            // If the navigation change was triggered with a pop state then we'll get an onPopState with the locationChangeTriggerUrl but no cancel event with it.
-            if (this.gotPopStateWithLeavingUrl && this.interactionService.isActive()) {
-                /** @type {?} */
-                var interactionIds = this.interactionService.activeInteractionContextIds.value;
-                this.resetBrowserLocation(this.placeRouter.parseUrl(this.startingUrl).updateInteractionIds(interactionIds).url);
+            // TODO: should really split this into two sub states in the first cancel event.
+            if (!this.firstCancelEventUrl) {
+                this.firstCancelEventUrl = event.url;
+                this.clickedLinkMatchedBackButtonUrl = event.url === this.clickedLinkUrl;
+                return this.ignore(event);
+            }
+            else {
+                // we wait for our popped state to come in.
+                if (!this.clickedLinkMatchedBackButtonUrl && this.popStateEventUrl) {
+                    return this.finaliseRouting();
+                }
             }
-            return this.gotPopStateWithLeavingUrl || this.locationChangeTriggerUrl === event.url ? this.createIdleState() : this.ignore(event);
         };
         /**
          * @param {?} event
          * @return {?}
          */
-        CancelledDuringNavigationInteraction.prototype.onRouterEnd = /**
+        LinkTriggeredNavigationInteractionCancelled.prototype.onRouterEnd = /**
          * @param {?} event
          * @return {?}
          */
         function (event) {
-            return this.ignore(event);
+            if (this.clickedLinkMatchedBackButtonUrl) {
+                return this.finaliseRouting();
+            }
+            else {
+                return this.ignore(event);
+            }
         };
         /**
          * @param {?} event
          * @return {?}
          */
-        CancelledDuringNavigationInteraction.prototype.onRouterError = /**
+        LinkTriggeredNavigationInteractionCancelled.prototype.onRouterError = /**
          * @param {?} event
          * @return {?}
          */
@@ -952,25 +1366,42 @@ if (false) {
          * @param {?} event
          * @return {?}
          */
-        CancelledDuringNavigationInteraction.prototype.onPopState = /**
+        LinkTriggeredNavigationInteractionCancelled.prototype.onPopState = /**
          * @param {?} event
          * @return {?}
          */
         function (event) {
-            this.gotPopStateWithLeavingUrl = this.gotPopStateWithLeavingUrl || event.url === this.locationChangeTriggerUrl;
+            this.popStateEventUrl = event.url;
             return this.ignore(event);
         };
-        // @Trace()
-        // @Trace()
+        /**
+         * @return {?}
+         */
+        LinkTriggeredNavigationInteractionCancelled.prototype.finaliseRouting = /**
+         * @return {?}
+         */
+        function () {
+            Logger.get(this).info('WORK-AROUND: Updating browser location after pop state - see angular issue #13586');
+            this.resetBrowserLocation(this.clickedLinkUrl); // put the back click one back in.
+            if (this.interactionService.isActive()) {
+                /** @type {?} */
+                var interactionIds = this.interactionService.activeInteractionContextIds.value;
+                // Angular doesn't preserve the url when a guard cancels the back button.
+                // See https://github.com/angular/angular/issues/13586#issuecomment-432795720
+                this.resetBrowserLocation(this.placeRouter.parseUrl(this.startingUrl).updateInteractionIds(interactionIds).url);
+            }
+            else {
+                this.resetBrowserLocation(this.startingUrl); // and now put our own url back in.
+            }
+            return this.createIdleState();
+        };
         /**
          * @param {?} component
          * @param {?} currentUrl
          * @param {?} nextUrl
          * @return {?}
          */
-        CancelledDuringNavigationInteraction.prototype.canDeactivatePlace = 
-        // @Trace()
-        /**
+        LinkTriggeredNavigationInteractionCancelled.prototype.canDeactivatePlace = /**
          * @param {?} component
          * @param {?} currentUrl
          * @param {?} nextUrl
@@ -983,47 +1414,185 @@ if (false) {
                 });
             });
         };
+        return LinkTriggeredNavigationInteractionCancelled;
+    }(NavigationState));
+    NavigationState.LinkTriggeredNavigationInteractionCancelled = LinkTriggeredNavigationInteractionCancelled;
+    if (false) {
+        /** @type {?} */
+        LinkTriggeredNavigationInteractionCancelled.prototype.isPopState;
+        /** @type {?} */
+        LinkTriggeredNavigationInteractionCancelled.prototype.firstCancelEventUrl;
+        /** @type {?} */
+        LinkTriggeredNavigationInteractionCancelled.prototype.popStateEventUrl;
+        /** @type {?} */
+        LinkTriggeredNavigationInteractionCancelled.prototype.clickedLinkMatchedBackButtonUrl;
+        /** @type {?} */
+        LinkTriggeredNavigationInteractionCancelled.prototype.debugPropertyKeys;
+        /** @type {?} */
+        LinkTriggeredNavigationInteractionCancelled.prototype.startingUrl;
+        /** @type {?} */
+        LinkTriggeredNavigationInteractionCancelled.prototype.clickedLinkUrl;
+    }
+    /**
+     * This state handles the scenario where a pop state triggered and interaction and the user clickeb back a second time to cancel it.
+     * The sequence of routing events/state transitions is as follows.
+     * -> Idle -> PopStateTransition (poppedHistoryUrl == page to go to, startingUrl = page to stay on )
+     * -> confirm dialog shown.
+     * -> click back
+     * -> PopStateTransition -> CancelledDuringBackButtonNavigationInteraction(trigger url is the page before the popped history url)
+     * -> NavigationCancel (for the previous back)
+     * -> PopState
+     * -> NavigationCancel
+     */
+    var /**
+     * This state handles the scenario where a pop state triggered and interaction and the user clickeb back a second time to cancel it.
+     * The sequence of routing events/state transitions is as follows.
+     * -> Idle -> PopStateTransition (poppedHistoryUrl == page to go to, startingUrl = page to stay on )
+     * -> confirm dialog shown.
+     * -> click back
+     * -> PopStateTransition -> CancelledDuringBackButtonNavigationInteraction(trigger url is the page before the popped history url)
+     * -> NavigationCancel (for the previous back)
+     * -> PopState
+     * -> NavigationCancel
+     */
+    PopStateTriggeredNavigationInteractionCancelled = /** @class */ (function (_super) {
+        tslib_1.__extends(PopStateTriggeredNavigationInteractionCancelled, _super);
+        function PopStateTriggeredNavigationInteractionCancelled(context, startingUrl, locationChangeTriggerUrl, poppedHistoryUrl) {
+            var _this = _super.call(this, context) || this;
+            _this.startingUrl = startingUrl;
+            _this.locationChangeTriggerUrl = locationChangeTriggerUrl;
+            _this.poppedHistoryUrl = poppedHistoryUrl;
+            _this.isPopState = false;
+            _this.firstCancelHandled = false;
+            _this.popStateHandled = false;
+            _this.debugPropertyKeys = ['idle', 'startingUrl', 'poppedHistoryUrl', 'locationChangeTriggerUrl', 'popStateEventUrl', 'firstCancelHandled', 'popStateHandled'];
+            return _this;
+        }
+        Object.defineProperty(PopStateTriggeredNavigationInteractionCancelled.prototype, "isTransitional", {
+            get: /**
+             * @return {?}
+             */
+            function () {
+                return true;
+            },
+            enumerable: true,
+            configurable: true
+        });
         /**
          * @param {?} event
-         * @param {?=} reason
          * @return {?}
          */
-        CancelledDuringNavigationInteraction.prototype.ignore = /**
+        PopStateTriggeredNavigationInteractionCancelled.prototype.onRouterStarted = /**
          * @param {?} event
-         * @param {?=} reason
          * @return {?}
          */
-        function (event, reason) {
-            reason = reason ? " -> " + reason : '';
-            Logger.get(this).info("ignoring router event" + reason + ": " + event.constructor.name + " -> " + event.url);
-            return this;
+        function (event) {
+            return this.ignore(event);
         };
         /**
+         * @param {?} event
          * @return {?}
          */
-        CancelledDuringNavigationInteraction.prototype.toString = /**
+        PopStateTriggeredNavigationInteractionCancelled.prototype.onRouterCancelled = /**
+         * @param {?} event
          * @return {?}
          */
-        function () {
-            return this.constructor.name + "(isIdl: " + this.idle + ", startingUrl: " + this.startingUrl + ", locationChangeTriggerUrl:" + this.locationChangeTriggerUrl + ")";
+        function (event) {
+            if (this.firstCancelHandled && this.popStateHandled) {
+                // Angular doesn't preserve the url when a guard cancels the back button.
+                // See https://github.com/angular/angular/issues/13586#issuecomment-432795720
+                Logger.get(this).info('WORK-AROUND: Updating browser location after pop state - see angular issue #13586');
+                this.resetBrowserLocation(this.locationChangeTriggerUrl); // put the second back click one back in.
+                this.resetBrowserLocation(this.poppedHistoryUrl); // put the first back click one back in.
+                if (this.interactionService.isActive()) {
+                    /** @type {?} */
+                    var interactionIds = this.interactionService.activeInteractionContextIds.value;
+                    this.resetBrowserLocation(this.placeRouter.parseUrl(this.startingUrl).updateInteractionIds(interactionIds).url);
+                }
+                else {
+                    this.resetBrowserLocation(this.startingUrl); // and now put our own url back in.
+                }
+                return this.createIdleState();
+            }
+            else {
+                this.firstCancelHandled = true;
+                return this.ignore(event);
+            }
+        };
+        /**
+         * @param {?} event
+         * @return {?}
+         */
+        PopStateTriggeredNavigationInteractionCancelled.prototype.onRouterEnd = /**
+         * @param {?} event
+         * @return {?}
+         */
+        function (event) {
+            return this.ignore(event);
+        };
+        /**
+         * @param {?} event
+         * @return {?}
+         */
+        PopStateTriggeredNavigationInteractionCancelled.prototype.onRouterError = /**
+         * @param {?} event
+         * @return {?}
+         */
+        function (event) {
+            return this.ignore(event);
         };
-        return CancelledDuringNavigationInteraction;
+        /**
+         * @param {?} event
+         * @return {?}
+         */
+        PopStateTriggeredNavigationInteractionCancelled.prototype.onPopState = /**
+         * @param {?} event
+         * @return {?}
+         */
+        function (event) {
+            this.popStateHandled = true;
+            this.popStateEventUrl = event.url;
+            return this.ignore(event);
+        };
+        /**
+         * @param {?} component
+         * @param {?} currentUrl
+         * @param {?} nextUrl
+         * @return {?}
+         */
+        PopStateTriggeredNavigationInteractionCancelled.prototype.canDeactivatePlace = /**
+         * @param {?} component
+         * @param {?} currentUrl
+         * @param {?} nextUrl
+         * @return {?}
+         */
+        function (component, currentUrl, nextUrl) {
+            return tslib_1.__awaiter(this, void 0, void 0, function () {
+                return tslib_1.__generator(this, function (_a) {
+                    return [2 /*return*/, false];
+                });
+            });
+        };
+        return PopStateTriggeredNavigationInteractionCancelled;
     }(NavigationState));
-    NavigationState.CancelledDuringNavigationInteraction = CancelledDuringNavigationInteraction;
+    NavigationState.PopStateTriggeredNavigationInteractionCancelled = PopStateTriggeredNavigationInteractionCancelled;
     if (false) {
         /** @type {?} */
-        CancelledDuringNavigationInteraction.prototype.isPopState;
-        /**
-         * @type {?}
-         * @private
-         */
-        CancelledDuringNavigationInteraction.prototype.gotPopStateWithLeavingUrl;
+        PopStateTriggeredNavigationInteractionCancelled.prototype.isPopState;
+        /** @type {?} */
+        PopStateTriggeredNavigationInteractionCancelled.prototype.firstCancelHandled;
+        /** @type {?} */
+        PopStateTriggeredNavigationInteractionCancelled.prototype.popStateHandled;
+        /** @type {?} */
+        PopStateTriggeredNavigationInteractionCancelled.prototype.popStateEventUrl;
+        /** @type {?} */
+        PopStateTriggeredNavigationInteractionCancelled.prototype.debugPropertyKeys;
         /** @type {?} */
-        CancelledDuringNavigationInteraction.prototype.startingUrl;
+        PopStateTriggeredNavigationInteractionCancelled.prototype.startingUrl;
         /** @type {?} */
-        CancelledDuringNavigationInteraction.prototype.startingEventWasAPopState;
+        PopStateTriggeredNavigationInteractionCancelled.prototype.locationChangeTriggerUrl;
         /** @type {?} */
-        CancelledDuringNavigationInteraction.prototype.locationChangeTriggerUrl;
+        PopStateTriggeredNavigationInteractionCancelled.prototype.poppedHistoryUrl;
     }
 })(NavigationState || (NavigationState = {}));
 //# sourceMappingURL=navigation-state.js.map