feat(hmr): preserve navigation history on applying changes (#7146)

tns-core-modules/ui/core/view-base/view-base.d.ts

@@ -160,7 +160,7 @@ export abstract class ViewBase extends Observable {
 
     /**
      * @deprecated use showModal with ShowModalOptions instead
-     * 
+     *
      * Shows the View contained in moduleName as a modal view.
      * @param moduleName - The name of the module to load starting from the application root.
      * @param context - Any context you want to pass to the modally shown view.
@@ -175,7 +175,7 @@ export abstract class ViewBase extends Observable {
 
     /**
      * @deprecated use showModal with ShowModalOptions instead
-     * 
+     *
      * Shows the view passed as parameter as a modal view.
      * @param view - View instance to be shown modally.
      * @param context - Any context you want to pass to the modally shown view. This same context will be available in the arguments of the shownModally event handler.
@@ -367,7 +367,7 @@ export abstract class ViewBase extends Observable {
     public _goToVisualState(state: string): void;
     /**
      * @deprecated
-     * 
+     *
      * This used to be the way to set attribute values in early {N} versions.
      * Now attributes are expected to be set as plain properties on the view instances.
      */

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

@@ -7,8 +7,7 @@ import {
 import {
     ViewBase, Property, booleanConverter, eachDescendant, EventData, layout,
     getEventOrGestureName, traceEnabled, traceWrite, traceCategories,
-    InheritedProperty,
-    ShowModalOptions
+    InheritedProperty, ShowModalOptions
 } from "../view-base";
 
 import { HorizontalAlignment, VerticalAlignment, Visibility, Length, PercentLength } from "../../styling/style-properties";
@@ -38,6 +37,12 @@ function ensureAnimationModule() {
     }
 }
 
+export enum ModuleType {
+    markup = "markup",
+    script = "script",
+    style = "style"
+}
+
 export function CSSType(type: string): ClassDecorator {
     return (cls) => {
         cls.prototype.cssType = type;
@@ -138,12 +143,22 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
     }
 
     public _onLivesync(context?: ModuleContext): boolean {
+        if (traceEnabled()) {
+            traceWrite(`${this}._onLivesync(${JSON.stringify(context)})`, traceCategories.Livesync);
+        }
+
         _rootModalViews.forEach(v => v.closeModal());
         _rootModalViews.length = 0;
 
-        // Currently, we pass `context` only for style modules
-        if (context && context.path) {
-            return this.changeLocalStyles(context.path);
+        if (context && context.type && context.path) {
+            // Handle local styles
+            if (context.type === ModuleType.style) {
+                return this.changeLocalStyles(context.path);
+            }
+            // Handle module markup and script changes
+            else {
+                return this.changeModule(context);
+            }
         }
 
         return false;
@@ -156,11 +171,16 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
                 return true;
             });
         }
-        // Do not execute frame navigation for a change in styles
+
+        // Do not reset activity/window content for local styles changes
         return true;
     }
 
     private changeStyles(view: ViewBase, contextPath: string): boolean {
+        if (traceEnabled()) {
+            traceWrite(`${view}.${view._moduleName}`, traceCategories.Livesync);
+        }
+
         if (view._moduleName && contextPath.includes(view._moduleName)) {
             (<this>view).changeCssFile(contextPath);
             return true;
@@ -168,6 +188,23 @@ export abstract class ViewCommon extends ViewBase implements ViewDefinition {
         return false;
     }
 
+    private changeModule(context: ModuleContext): boolean {
+        eachDescendant(this, (child: ViewBase) => {
+            if (traceEnabled()) {
+                traceWrite(`${child}.${child._moduleName}`, traceCategories.Livesync);
+            }
+
+            // Handle changes in module's Page
+            if (child._moduleName && context.path.includes(child._moduleName) && child.page) {
+                child.page._onLivesync(context);
+            }
+            return true;
+        });
+
+        // Do not reset activity/window content for module changes
+        return true;
+    }
+
     _setupAsRootView(context: any): void {
         super._setupAsRootView(context);
         if (!this._styleScope) {