From 07f918e9cede30f4c919f718644964ca1cfbb204 Mon Sep 17 00:00:00 2001 From: Adam Bradley Date: Sat, 12 Nov 2016 08:53:53 -0600 Subject: [PATCH] fix(error): reload immediately after js/html update --- bin/ion-dev.js | 9 ++++-- src/build.ts | 45 ++++++++++++++++----------- src/dev-server/notification-server.ts | 18 +++++------ src/util/interfaces.ts | 13 ++++++++ 4 files changed, 55 insertions(+), 30 deletions(-) diff --git a/bin/ion-dev.js b/bin/ion-dev.js index 0579d32e..6518e423 100644 --- a/bin/ion-dev.js +++ b/bin/ion-dev.js @@ -216,10 +216,15 @@ window.IonicDevServer = { }, 50); } else { - status = msg.data.diagnosticsHtml ? 'error' : 'success'; - clearTimeout(this.toastTimerId); + if (msg.data.reloadApp) { + this.reloadApp(); + return; + } + + status = msg.data.diagnosticsHtml ? 'error' : 'success'; + var toastEle = document.getElementById('ion-diagnostics-toast'); if (toastEle) { toastEle.classList.remove('ion-diagnostics-toast-active'); diff --git a/src/build.ts b/src/build.ts index 16950ff7..671ea82d 100644 --- a/src/build.ts +++ b/src/build.ts @@ -1,4 +1,4 @@ -import { BuildContext, BuildState } from './util/interfaces'; +import { BuildContext, BuildState, BuildUpdateMessage } from './util/interfaces'; import { BuildError } from './util/errors'; import { bundle, bundleUpdate } from './bundle'; import { clean } from './clean'; @@ -45,6 +45,8 @@ function buildProd(context: BuildContext) { // sync empty the www/build directory clean(context); + buildId++; + // async tasks // these can happen all while other tasks are running const copyPromise = copy(context); @@ -90,6 +92,8 @@ function buildDev(context: BuildContext) { // sync empty the www/build directory clean(context); + buildId++; + // async tasks // these can happen all while other tasks are running const copyPromise = copy(context); @@ -121,8 +125,13 @@ export function buildUpdate(event: string, filePath: string, context: BuildConte return new Promise(resolve => { const logger = new Logger('build'); - buildUpdateId++; - emit(EventType.BuildUpdateStarted, buildUpdateId); + buildId++; + + const buildUpdateMsg: BuildUpdateMessage = { + buildId: buildId, + reloadApp: false + }; + emit(EventType.BuildUpdateStarted, buildUpdateMsg); function buildTasksDone(resolveValue: BuildTaskResolveValue) { // all build tasks have been resolved or one of them @@ -131,13 +140,13 @@ export function buildUpdate(event: string, filePath: string, context: BuildConte parallelTasksPromise.then(() => { // all parallel tasks are also done // so now we're done done - emit(EventType.BuildUpdateCompleted, buildUpdateId); - - if (resolveValue.requiresRefresh) { - // emit that we need to do a full page refresh - emit(EventType.ReloadApp); + const buildUpdateMsg: BuildUpdateMessage = { + buildId: buildId, + reloadApp: resolveValue.requiresAppReload + }; + emit(EventType.BuildUpdateCompleted, buildUpdateMsg); - } else { + if (!resolveValue.requiresAppReload) { // just emit that only a certain file changed // this one is useful when only a sass changed happened // and the webpack only needs to livereload the css @@ -169,7 +178,7 @@ export function buildUpdate(event: string, filePath: string, context: BuildConte .then(buildTasksDone) .catch(() => { buildTasksDone({ - requiresRefresh: false, + requiresAppReload: false, changedFile: filePath }); }); @@ -182,7 +191,7 @@ export function buildUpdate(event: string, filePath: string, context: BuildConte */ function buildUpdateTasks(event: string, filePath: string, context: BuildContext) { const resolveValue: BuildTaskResolveValue = { - requiresRefresh: false, + requiresAppReload: false, changedFile: filePath }; @@ -190,7 +199,7 @@ function buildUpdateTasks(event: string, filePath: string, context: BuildContext .then(() => { // TEMPLATE if (context.templateState === BuildState.RequiresUpdate) { - resolveValue.requiresRefresh = true; + resolveValue.requiresAppReload = true; return templateUpdate(event, filePath, context); } // no template updates required @@ -200,7 +209,7 @@ function buildUpdateTasks(event: string, filePath: string, context: BuildContext .then(() => { // TRANSPILE if (context.transpileState === BuildState.RequiresUpdate) { - resolveValue.requiresRefresh = true; + resolveValue.requiresAppReload = true; // we've already had a successful transpile once, only do an update // not that we've also already started a transpile diagnostics only // build that only needs to be completed by the end of buildUpdate @@ -208,7 +217,7 @@ function buildUpdateTasks(event: string, filePath: string, context: BuildContext } else if (context.transpileState === BuildState.RequiresBuild) { // run the whole transpile - resolveValue.requiresRefresh = true; + resolveValue.requiresAppReload = true; return transpile(context); } // no transpiling required @@ -219,12 +228,12 @@ function buildUpdateTasks(event: string, filePath: string, context: BuildContext // BUNDLE if (context.bundleState === BuildState.RequiresUpdate) { // we need to do a bundle update - resolveValue.requiresRefresh = true; + resolveValue.requiresAppReload = true; return bundleUpdate(event, filePath, context); } else if (context.bundleState === BuildState.RequiresBuild) { // we need to do a full bundle build - resolveValue.requiresRefresh = true; + resolveValue.requiresAppReload = true; return bundle(context); } // no bundling required @@ -254,7 +263,7 @@ function buildUpdateTasks(event: string, filePath: string, context: BuildContext } interface BuildTaskResolveValue { - requiresRefresh: boolean; + requiresAppReload: boolean; changedFile: string; } @@ -273,4 +282,4 @@ function buildUpdateParallelTasks(event: string, filePath: string, context: Buil return Promise.all(parallelTasks); } -let buildUpdateId = 0; +let buildId = 0; diff --git a/src/dev-server/notification-server.ts b/src/dev-server/notification-server.ts index 30eed6f7..3f93cae0 100644 --- a/src/dev-server/notification-server.ts +++ b/src/dev-server/notification-server.ts @@ -1,4 +1,5 @@ // Ionic Dev Server: Server Side Logger +import { BuildUpdateMessage, WsMessage } from '../util/interfaces'; import { Logger } from '../logger/logger'; import { generateRuntimeDiagnosticContent } from '../logger/logger-runtime'; import { hasDiagnostics, getDiagnosticsHtmlContent } from '../logger/logger-diagnostics'; @@ -32,24 +33,27 @@ export function createNotificationServer(config: ServeConfig) { } // a build update has started, notify the client - on(EventType.BuildUpdateStarted, (buildUpdateId) => { + on(EventType.BuildUpdateStarted, (buildUpdateMsg: BuildUpdateMessage) => { const msg: WsMessage = { category: 'buildUpdate', type: 'started', data: { - buildUpdateId: buildUpdateId + buildId: buildUpdateMsg.buildId, + reloadApp: buildUpdateMsg.reloadApp, + diagnosticsHtml: null } }; queueMessageSend(msg); }); // a build update has completed, notify the client - on(EventType.BuildUpdateCompleted, (buildUpdateId) => { + on(EventType.BuildUpdateCompleted, (buildUpdateMsg: BuildUpdateMessage) => { const msg: WsMessage = { category: 'buildUpdate', type: 'completed', data: { - buildUpdateId: buildUpdateId, + buildId: buildUpdateMsg.buildId, + reloadApp: buildUpdateMsg.reloadApp, diagnosticsHtml: hasDiagnostics(config.buildDir) ? getDiagnosticsHtmlContent(config.buildDir) : null } }; @@ -132,9 +136,3 @@ export function createNotificationServer(config: ServeConfig) { } } - -export interface WsMessage { - category: string; - type: string; - data: any; -} diff --git a/src/util/interfaces.ts b/src/util/interfaces.ts index 960816d7..f36ae7ba 100644 --- a/src/util/interfaces.ts +++ b/src/util/interfaces.ts @@ -86,3 +86,16 @@ export interface PrintLine { errorCharStart: number; errorLength: number; } + + +export interface WsMessage { + category: string; + type: string; + data: any; +} + + +export interface BuildUpdateMessage { + buildId: number; + reloadApp: boolean; +}