Using AppSync in a dev environment #39

Author: EddyVerbruggen

README.md

@@ -151,6 +151,7 @@ import { AppSync, InstallMode, SyncStatus } from "nativescript-app-sync";
 import { isIOS } from "tns-core-modules/platform";
 
 AppSync.sync({
+    enabledWhenUsingHmr: false, // this is optional and by default false so AppSync and HMR don't fight over app updates
     deploymentKey: isIOS ? "your-ios-deployment-key" : "your-android-deployment-key",
     installMode: InstallMode.ON_NEXT_RESTART, // this is the default install mode; the app updates upon the next cold boot (unless the --mandatory flag was specified while pushing the update) 
     mandatoryInstallMode: isIOS ? InstallMode.ON_NEXT_RESUME : InstallMode.IMMEDIATE, // the default is InstallMode.ON_NEXT_RESUME which doesn't bother the user as long as the app is in the foreground. InstallMode.IMMEDIATE shows an installation prompt. Don't use that for iOS AppStore distributions because Apple doesn't want you to, but if you have an Enterprise-distributed app, go right ahead!
@@ -182,6 +183,7 @@ var SyncStatus = require("nativescript-app-sync").SyncStatus;
 var platform = require("tns-core-modules/platform");
 
 AppSync.sync({
+    enabledWhenUsingHmr: false, // this is optional and by default false so AppSync and HMR don't fight over app updates
     deploymentKey: platform.isIOS ? "your-ios-deployment-key" : "your-android-deployment-key",
     installMode: InstallMode.ON_NEXT_RESTART,
     mandatoryInstallMode: platform.isIOS ? InstallMode.ON_NEXT_RESUME : InstallMode.IMMEDIATE,

demo/demoapp/app.css

@@ -1 +1 @@
-@import '~nativescript-theme-core/css/core.light.css';
+

demo/demoapp/main-view-model.ts

@@ -29,6 +29,8 @@ export class HelloWorldModel extends Observable {
     application.on(application.resumeEvent, () => {
       this.syncWithAppSyncServer();
     });
+
+    this.set("message", "HMR enabled: " +  (typeof (<any>global).hmrRefresh === "function"));
   }
 
   public setAppSettings() {
@@ -70,6 +72,7 @@ export class HelloWorldModel extends Observable {
   private syncWithAppSyncServer(): void {
     this.set("message", "Querying AppSync..");
     AppSync.sync({
+      enabledWhenUsingHmr: false,
       deploymentKey: isIOS ? HelloWorldModel.APPSYNC_IOS_STAGING_KEY : HelloWorldModel.APPSYNC_ANDROID_STAGING_KEY,
       installMode: InstallMode.ON_NEXT_RESTART, // default InstallMode.ON_NEXT_RESTART
       mandatoryInstallMode: isIOS ? InstallMode.ON_NEXT_RESUME : InstallMode.IMMEDIATE, // default InstallMode.ON_NEXT_RESUME
@@ -86,6 +89,8 @@ export class HelloWorldModel extends Observable {
         this.set("message", `AppSync: up to date: ${updateLabel}`);
       } else if (syncStatus === SyncStatus.UPDATE_INSTALLED) {
         this.set("message", `AppSync: update installed: ${updateLabel}`);
+      } else {
+        this.set("message", `AppSync: status changed to: ${syncStatus}`);
       }
     });
   }

demo/package.json

@@ -31,7 +31,7 @@
     "ci.tslint": "npm i && tslint --config '../tslint.json' 'demoapp/**/*.ts' --exclude '**/node_modules/**' --exclude '**/typings/**'"
   },
   "dependencies": {
-    "nativescript-app-sync": "file:../publish/package/nativescript-app-sync-1.0.5.tgz",
+    "nativescript-app-sync": "file:../publish/package/nativescript-app-sync-1.0.6.tgz",
     "nativescript-theme-core": "~1.0.4",
     "nativescript-unit-test-runner": "0.7.0",
     "tns-core-modules": "~6.0.0"

src/app-sync.ts

@@ -2,9 +2,9 @@
 
 import * as appSettings from "application-settings";
 import * as AppVersion from "nativescript-appversion";
+import * as application from "tns-core-modules/application";
 import { device } from "tns-core-modules/platform";
 import { confirm } from "tns-core-modules/ui/dialogs";
-import * as application from "tns-core-modules/application";
 import { TNSAcquisitionManager } from "./TNSAcquisitionManager";
 import { TNSLocalPackage } from "./TNSLocalPackage";
 import { TNSRemotePackage } from "./TNSRemotePackage";
@@ -50,6 +50,11 @@ export enum SyncStatus {
    */
   ERROR = <any>"ERROR",
 
+  /**
+   * Returned if HMR is enabled and not overridden by the user.
+   */
+  SKIPPING_BECAUSE_HMR_ENABLED = <any>"SKIPPING_BECAUSE_HMR_ENABLED",
+
   /**
    * There is an ongoing sync in progress, so this attempt to sync has been aborted.
    */
@@ -95,10 +100,12 @@ export class AppSync {
       throw new Error("Missing deploymentKey, pass it as part of the first parameter of the 'sync' function: { deploymentKey: 'your-key' }");
     }
 
-    if (AppSync.syncInProgress) {
-      syncCallback && syncCallback(SyncStatus.IN_PROGRESS);
+    // skip AppSync when HMR is detected, unless it's explicitly allowed
+    if (typeof (<any>global).hmrRefresh === "function" && !options.enabledWhenUsingHmr) {
+      syncCallback && syncCallback(SyncStatus.SKIPPING_BECAUSE_HMR_ENABLED);
       return;
     }
+
     AppSync.syncInProgress = true;
 
     // by default, use our Cloud server

src/code-push-lib.d.ts

@@ -334,6 +334,12 @@ interface SyncOptions extends InstallOptions {
      * Overrides the default server URL (https://appsync-server.nativescript.org/).
      */
     serverUrl?: string;
+
+    /**
+     * By default we ignore AppSync updates when running with HMR.
+     * But if you feel adventurous you can override that behaviour by setting this to true.
+     */
+    enabledWhenUsingHmr?: boolean;
 }
 
 /**

src/package.json

@@ -1,6 +1,6 @@
 {
   "name": "nativescript-app-sync",
-  "version": "1.0.5",
+  "version": "1.0.6",
   "description": "Use AppSync to hot deploy updates to your app.",
   "main": "app-sync",
   "typings": "index.d.ts",