fix(location-strategy): crash when going back on nested named lazy loaded module (#1618)

Author: ADjenkov

nativescript-angular/router/ns-location-strategy.ts

@@ -16,13 +16,15 @@ export class Outlet {
     // in module that lazy loads children (loadChildren) and has outlet name.
     outletKeys: Array<string>;
 
+    // More than one frame available when using NSEmptyOutletComponent component
+    // in module that lazy loads children (loadChildren) and has outlet name.
+    frames: Array<Frame> = [];
     // The url path to the Outlet.
     // E.G: the path to Outlet3 that is nested Outlet1(home)->Outlet2(nested1)->Outlet3(nested2)
     // will be 'home/nested1'
     path: string;
     pathByOutlets: string;
     states: Array<LocationState> = [];
-    frame: Frame;
 
     // Used in reuse-strategy by its children to determine if they should be detached too.
     shouldDetach: boolean = true;
@@ -35,6 +37,10 @@ export class Outlet {
         this.path = path;
     }
 
+    containsFrame(frame: Frame): boolean {
+        return this.frames.indexOf(frame) > -1;
+    }
+
     peekState(): LocationState {
         if (this.states.length > 0) {
             return this.states[this.states.length - 1];
@@ -244,7 +250,7 @@ export class NSLocationStrategy extends LocationStrategy {
                     const topmostFrame = this.frameService.getFrame();
                     this.currentOutlet = this.getOutletByFrame(topmostFrame);
                 }
-                this.currentOutlet.frame.goBack();
+                this.currentOutlet.frames[this.currentOutlet.frames.length - 1].goBack();
             } else {
                 // Nested navigation - just pop the state
                 if (isLogEnabled()) {
@@ -423,7 +429,9 @@ export class NSLocationStrategy extends LocationStrategy {
     }
 
     updateOutletFrame(outlet: Outlet, frame: Frame) {
-        outlet.frame = frame;
+        if (!outlet.containsFrame(frame)) {
+            outlet.frames.push(frame);
+        }
         this.currentOutlet = outlet;
     }
 
@@ -436,10 +444,10 @@ export class NSLocationStrategy extends LocationStrategy {
             }
 
             // Remove outlet from the url tree.
-            if (currentOutlet.frame === frame && !isEqualToCurrent) {
+            if (currentOutlet.containsFrame(frame) && !isEqualToCurrent) {
                 this.callPopState(null, true, currentOutlet);
             }
-            return currentOutlet.frame !== frame;
+            return !currentOutlet.containsFrame(frame);
         });
     }
 
@@ -528,7 +536,7 @@ export class NSLocationStrategy extends LocationStrategy {
         for (let index = 0; index < this.outlets.length; index++) {
             const currentOutlet = this.outlets[index];
 
-            if (currentOutlet.frame === frame) {
+            if (currentOutlet.containsFrame(frame)) {
                 outlet = currentOutlet;
                 break;
             }

nativescript-angular/router/page-router-outlet.ts

@@ -391,7 +391,7 @@ export class PageRouterOutlet implements OnDestroy { // tslint:disable-line:dire
             let outletKeyForRoute = this.locationStrategy.getRouteFullPath(nodeToMark);
             let outlet = this.locationStrategy.findOutletByKey(outletKeyForRoute);
 
-            if (outlet && outlet.frame) {
+            if (outlet && outlet.frames.length) {
                 nodeToMark[pageRouterActivatedSymbol] = true;
                 if (isLogEnabled()) {
                     log("Activated route marked as page: " + routeToString(nodeToMark));

tests/app/tests/modal-dialog.ts

@@ -97,7 +97,7 @@ describe("modal-dialog", () => {
 
                 let parentView = fixture.componentRef.instance.vcRef.element.nativeElement;
                 parentView = parentView.page && parentView.page.frame;
-                outlet.frame = parentView;
+                outlet.frames.push(parentView);
                 locStrategy._getOutlets().push(outlet);
 
                 locStrategy.pushState(null, "test", "/test", null);
@@ -119,7 +119,7 @@ describe("modal-dialog", () => {
 
                 let parentView = fixture.componentRef.instance.vcRef.element.nativeElement;
                 parentView = parentView.page && parentView.page.frame;
-                outlet.frame = parentView;
+                outlet.frames.push(parentView);
                 locStrategy._getOutlets().push(outlet);
 
                 locStrategy.pushState(null, "test", "/test", null);

tests/app/tests/ns-location-strategy.ts

@@ -143,7 +143,7 @@ function simulatePageNavigation(strategy: NSLocationStrategy, url: string, frame
     strategy.pushState(null, null, url, null);
 
     const outlet: Outlet = strategy.findOutletByOutletPath(outletName);
-    outlet.frame = frame;
+    outlet.frames.push(frame);
     strategy._beginPageNavigation(frame);
 }