Merge pull request #4790 from NativeScript/vladimirov/fix-preview

fix: handle preview issues

Author: rosen-vladimirov

lib/controllers/prepare-controller.ts

@@ -80,24 +80,24 @@ export class PrepareController extends EventEmitter {
 				nativeFilesWatcher: null,
 				webpackCompilerProcess: null
 			};
-		}
+			await this.startJSWatcherWithPrepare(platformData, projectData, prepareData); // -> start watcher + initial compilation
+			const hasNativeChanges = await this.startNativeWatcherWithPrepare(platformData, projectData, prepareData); // -> start watcher + initial prepare
+			const result = { platform: platformData.platformNameLowerCase, hasNativeChanges };
 
-		await this.startJSWatcherWithPrepare(platformData, projectData, prepareData); // -> start watcher + initial compilation
-		const hasNativeChanges = await this.startNativeWatcherWithPrepare(platformData, projectData, prepareData); // -> start watcher + initial prepare
+			const hasPersistedDataWithNativeChanges = this.persistedData.find(data => data.platform === result.platform && data.hasNativeChanges);
+			if (hasPersistedDataWithNativeChanges) {
+				result.hasNativeChanges = true;
+			}
 
-		const result = { platform: platformData.platformNameLowerCase, hasNativeChanges };
-		const hasPersistedDataWithNativeChanges = this.persistedData.find(data => data.platform === result.platform && data.hasNativeChanges);
-		if (hasPersistedDataWithNativeChanges) {
-			result.hasNativeChanges = true;
-		}
+			// TODO: Do not persist this in `this` context. Also it should be per platform.
+			this.isInitialPrepareReady = true;
 
-		this.isInitialPrepareReady = true;
+			if (this.persistedData && this.persistedData.length) {
+				this.emitPrepareEvent({ files: [], hasOnlyHotUpdateFiles: false, hasNativeChanges: result.hasNativeChanges, hmrData: null, platform: platformData.platformNameLowerCase });
+			}
 
-		if (this.persistedData && this.persistedData.length) {
-			this.emitPrepareEvent({ files: [], hasOnlyHotUpdateFiles: false, hasNativeChanges: result.hasNativeChanges, hmrData: null, platform: platformData.platformNameLowerCase });
+			return result;
 		}
-
-		return result;
 	}
 
 	private async startJSWatcherWithPrepare(platformData: IPlatformData, projectData: IProjectData, prepareData: IPrepareData): Promise<void> {

lib/controllers/preview-app-controller.ts

@@ -9,7 +9,8 @@ import { PrepareDataService } from "../services/prepare-data-service";
 import { PreviewAppLiveSyncEvents } from "../services/livesync/playground/preview-app-constants";
 
 export class PreviewAppController extends EventEmitter implements IPreviewAppController {
-	private deviceInitializationPromise: IDictionary<Promise<FilesPayload>> = {};
+	private deviceInitializationPromise: IDictionary<boolean> = {};
+	private platformPrepareHandlers: IDictionary<boolean> = {};
 	private promise = Promise.resolve();
 
 	constructor(
@@ -49,9 +50,14 @@ export class PreviewAppController extends EventEmitter implements IPreviewAppCon
 				}
 
 				if (this.deviceInitializationPromise[device.id]) {
-					return this.deviceInitializationPromise[device.id];
+					// In some cases devices are reported several times during initialization.
+					// In case we are already preparing the sending of initial files, disregard consecutive requests for initial files
+					// until we send the files we are currently preparing.
+					return null;
 				}
 
+				this.deviceInitializationPromise[device.id] = true;
+
 				if (device.uniqueId) {
 					await this.$analyticsService.trackEventActionInGoogleAnalytics({
 						action: TrackActionNames.PreviewAppData,
@@ -68,20 +74,25 @@ export class PreviewAppController extends EventEmitter implements IPreviewAppCon
 
 				await this.$previewAppPluginsService.comparePluginsOnDevice(data, device);
 
-				this.$prepareController.on(PREPARE_READY_EVENT_NAME, async currentPrepareData => {
-					await this.handlePrepareReadyEvent(data, currentPrepareData.hmrData, currentPrepareData.files, device.platform);
-				});
+				if (!this.platformPrepareHandlers[device.platform]) {
+					// TODO: Unset this property once the preview operation for this platform is stopped
+					this.platformPrepareHandlers[device.platform] = true;
+
+					// TODO: Remove the handler once the preview operation for this platform is stopped
+					this.$prepareController.on(PREPARE_READY_EVENT_NAME, async currentPrepareData => {
+						await this.handlePrepareReadyEvent(data, currentPrepareData.hmrData, currentPrepareData.files, device.platform);
+					});
 
-				if (!data.env) { data.env = { }; }
+				}
+
+				data.env = data.env || {};
 				data.env.externals = this.$previewAppPluginsService.getExternalPlugins(device);
 
-				const prepareData = this.$prepareDataService.getPrepareData(data.projectDir, device.platform.toLowerCase(),  { ...data, nativePrepare: { skipNativePrepare: true }, watch: true });
+				const prepareData = this.$prepareDataService.getPrepareData(data.projectDir, device.platform.toLowerCase(), { ...data, nativePrepare: { skipNativePrepare: true }, watch: true });
 				await this.$prepareController.prepare(prepareData);
 
-				this.deviceInitializationPromise[device.id] = this.getInitialFilesForPlatformSafe(data, device.platform);
-
 				try {
-					const payloads = await this.deviceInitializationPromise[device.id];
+					const payloads = await this.getInitialFilesForPlatformSafe(data, device.platform);
 					return payloads;
 				} finally {
 					this.deviceInitializationPromise[device.id] = null;
@@ -116,7 +127,7 @@ export class PreviewAppController extends EventEmitter implements IPreviewAppCon
 						if (status === HmrConstants.HMR_ERROR_STATUS) {
 							const originalUseHotModuleReload = data.useHotModuleReload;
 							data.useHotModuleReload = false;
-							await this.syncFilesForPlatformSafe(data, { filesToSync: platformHmrData.fallbackFiles }, platform, previewDevice.id );
+							await this.syncFilesForPlatformSafe(data, { filesToSync: platformHmrData.fallbackFiles }, platform, previewDevice.id);
 							data.useHotModuleReload = originalUseHotModuleReload;
 						}
 					}));

lib/services/livesync/playground/preview-qr-code-service.ts

@@ -44,8 +44,6 @@ export class PreviewQrCodeService implements IPreviewQrCodeService {
 		const qrCodeUrl = this.$previewSdkService.getQrCodeUrl(options);
 		const url = await this.getShortenUrl(qrCodeUrl);
 
-		this.$logger.info("======== qrCodeUrl ======== ", qrCodeUrl);
-
 		this.$logger.info();
 		const message = `${EOL} Generating qrcode for url ${url}.`;
 		this.$logger.trace(message);