From 7996e9db3cf1727f5da36e6c051d3aac5680c465 Mon Sep 17 00:00:00 2001 From: Jason San Jose Date: Thu, 6 Mar 2014 20:15:02 -0800 Subject: [PATCH 1/5] Do not close/reopen live preview on currentDocumentChange. Use Page.navigate() instead and update agent and server state as needed. --- src/LiveDevelopment/Agents/NetworkAgent.js | 8 ++++-- src/LiveDevelopment/Agents/RemoteAgent.js | 13 +++------ src/LiveDevelopment/Agents/ScriptAgent.js | 22 +++++++++++++-- src/LiveDevelopment/Inspector/Inspector.js | 25 +++++++++++------ src/LiveDevelopment/LiveDevelopment.js | 31 +++++++++++++++------- src/nls/root/strings.js | 8 +++--- 6 files changed, 71 insertions(+), 36 deletions(-) diff --git a/src/LiveDevelopment/Agents/NetworkAgent.js b/src/LiveDevelopment/Agents/NetworkAgent.js index cb7460e7e66..f7f6f742b8c 100644 --- a/src/LiveDevelopment/Agents/NetworkAgent.js +++ b/src/LiveDevelopment/Agents/NetworkAgent.js @@ -67,6 +67,7 @@ define(function NetworkAgent(require, exports, module) { // WebInspector Event: Page.frameNavigated function _onFrameNavigated(event, res) { // res = {frame} + _reset(); _logURL(res.frame.url); } @@ -78,6 +79,10 @@ define(function NetworkAgent(require, exports, module) { return Inspector.Network.enable(); } + function _reset() { + _urlRequested = {}; + } + /** Initialize the agent */ function load() { $(Inspector.Page).on("frameNavigated.NetworkAgent", _onFrameNavigated); @@ -86,8 +91,7 @@ define(function NetworkAgent(require, exports, module) { /** Unload the agent */ function unload() { - _urlRequested = {}; - + _reset(); $(Inspector.Page).off(".NetworkAgent"); $(Inspector.Network).off(".NetworkAgent"); } diff --git a/src/LiveDevelopment/Agents/RemoteAgent.js b/src/LiveDevelopment/Agents/RemoteAgent.js index a7b67d5daa2..7c8b596ff42 100644 --- a/src/LiveDevelopment/Agents/RemoteAgent.js +++ b/src/LiveDevelopment/Agents/RemoteAgent.js @@ -121,18 +121,11 @@ define(function RemoteAgent(require, exports, module) { call("keepAlive"); }, 1000); } - - /** - * @private - * Cancel the keepAlive interval if the page reloads - */ - function _onFrameStartedLoading(event, res) { - _stopKeepAliveInterval(); - } - + // WebInspector Event: Page.frameNavigated function _onFrameNavigated(event, res) { // res = {timestamp} + _stopKeepAliveInterval(); // inject RemoteFunctions var command = "window._LD=" + RemoteFunctions + "(" + LiveDevelopment.config.experimental + ");"; @@ -153,7 +146,7 @@ define(function RemoteAgent(require, exports, module) { function load() { _load = new $.Deferred(); $(Inspector.Page).on("frameNavigated.RemoteAgent", _onFrameNavigated); - $(Inspector.Page).on("frameStartedLoading.RemoteAgent", _onFrameStartedLoading); + $(Inspector.Page).on("frameStartedLoading.RemoteAgent", _stopKeepAliveInterval); $(Inspector.DOM).on("attributeModified.RemoteAgent", _onAttributeModified); return _load.promise(); diff --git a/src/LiveDevelopment/Agents/ScriptAgent.js b/src/LiveDevelopment/Agents/ScriptAgent.js index 58014f9dec0..a4c01505c66 100644 --- a/src/LiveDevelopment/Agents/ScriptAgent.js +++ b/src/LiveDevelopment/Agents/ScriptAgent.js @@ -117,10 +117,25 @@ define(function ScriptAgent(require, exports, module) { } - /** Initialize the agent */ - function load() { + function _reset() { _urlToScript = {}; _idToScript = {}; + } + + /** + * @private + * WebInspector Event: Page.frameNavigated + * @param {jQuery.Event} event + * @param {frame: Frame} res + */ + function _onFrameNavigated(event, res) { + // Clear maps when navigating to a new page + _reset(); + } + + /** Initialize the agent */ + function load() { + _reset(); _load = new $.Deferred(); var enableResult = new $.Deferred(); @@ -131,6 +146,7 @@ define(function ScriptAgent(require, exports, module) { }); }); + $(Inspector.Page).on("frameNavigated.ScriptAgent", _onFrameNavigated); $(DOMAgent).on("getDocument.ScriptAgent", _onGetDocument); $(Inspector.Debugger) .on("scriptParsed.ScriptAgent", _onScriptParsed) @@ -143,6 +159,8 @@ define(function ScriptAgent(require, exports, module) { /** Clean up */ function unload() { + _reset(); + $(Inspector.Page).off(".ScriptAgent"); $(DOMAgent).off(".ScriptAgent"); $(Inspector.Debugger).off(".ScriptAgent"); $(Inspector.DOM).off(".ScriptAgent"); diff --git a/src/LiveDevelopment/Inspector/Inspector.js b/src/LiveDevelopment/Inspector/Inspector.js index 6baac318dcb..35f0b14df5b 100644 --- a/src/LiveDevelopment/Inspector/Inspector.js +++ b/src/LiveDevelopment/Inspector/Inspector.js @@ -88,8 +88,13 @@ define(function Inspector(require, exports, module) { // jQuery exports object for events var $exports = $(exports); + /** + * Map message IDs to the callback function and original JSON message + * @type {Object. function} for remote method calls var _socket; // remote debugger WebSocket var _connectDeferred; // The deferred connect @@ -125,7 +130,7 @@ define(function Inspector(require, exports, module) { return (new $.Deferred()).reject().promise(); } - var id, callback, args, i, params = {}, promise; + var id, callback, args, i, params = {}, promise, msg; // extract the parameters, the callback function, and the message id args = Array.prototype.slice.call(arguments, 2); @@ -144,7 +149,6 @@ define(function Inspector(require, exports, module) { } id = _messageId++; - _messageCallbacks[id] = callback; // verify the parameters against the method signature // this also constructs the params object of type {name -> value} @@ -156,7 +160,10 @@ define(function Inspector(require, exports, module) { } } - _socket.send(JSON.stringify({ method: method, id: id, params: params })); + // Store message callback and send message + msg = { method: method, id: id, params: params }; + _messageCallbacks[id] = { callback: callback, message: msg }; + _socket.send(JSON.stringify(msg)); return promise; } @@ -204,10 +211,12 @@ define(function Inspector(require, exports, module) { * @param {object} message */ function _onMessage(message) { - var response = JSON.parse(message.data), - callback = _messageCallbacks[response.id]; + var response = JSON.parse(message.data), + msgRecord = _messageCallbacks[response.id], + callback = msgRecord && msgRecord.callback, + message = (msgRecord && msgRecord.message) || "No message"; - if (callback) { + if (msgRecord) { // Messages with an ID are a response to a command, fire callback callback(response.result, response.error); delete _messageCallbacks[response.id]; @@ -224,7 +233,7 @@ define(function Inspector(require, exports, module) { $exports.triggerHandler("message", [response]); if (response.error) { - $exports.triggerHandler("error", [response.error]); + $exports.triggerHandler("error", [response.error, message]); } } diff --git a/src/LiveDevelopment/LiveDevelopment.js b/src/LiveDevelopment/LiveDevelopment.js index a3e9fdcfff9..f4e4f2b268b 100644 --- a/src/LiveDevelopment/LiveDevelopment.js +++ b/src/LiveDevelopment/LiveDevelopment.js @@ -407,7 +407,7 @@ define(function LiveDevelopment(require, exports, module) { } /** Triggered by Inspector.error */ - function _onError(event, error) { + function _onError(event, error, msgData) { var message; // Sometimes error.message is undefined @@ -430,7 +430,7 @@ define(function LiveDevelopment(require, exports, module) { } // Show the message, but include the error object for further information (e.g. error code) - console.error(message, error); + console.error(message, error, msgData); } function _styleSheetAdded(event, url) { @@ -1106,19 +1106,22 @@ define(function LiveDevelopment(require, exports, module) { } }); } + + function _createLiveDocumentForFrame(doc) { + // create live document + doc._ensureMasterEditor(); + _liveDocument = _createDocument(doc, doc._masterEditor); + _server.add(_liveDocument); + } // helper function that actually does the launch once we are sure we have // a doc and the server for that doc is up and running. function _doLaunchAfterServerReady(initialDoc) { // update status _setStatus(STATUS_CONNECTING); - - // create live document - initialDoc._ensureMasterEditor(); - _liveDocument = _createDocument(initialDoc, initialDoc._masterEditor); + _createLiveDocumentForFrame(initialDoc); // start listening for requests - _server.add(_liveDocument); _server.start(); // Install a one-time event handler when connected to the launcher page @@ -1255,9 +1258,17 @@ define(function LiveDevelopment(require, exports, module) { isViewable = exports.config.experimental || (_server && _server.canServe(doc.file.fullPath)); if (!wasRequested && isViewable) { - // TODO (jasonsanjose): optimize this by reusing the same connection - // no need to fully teardown. - close().done(open); + // TODO setStatus()? + + // clear related docs + _closeDocuments(); + + // TODO change live doc + _createLiveDocumentForFrame(doc); + + // Navigate to the new page within this site. Agents must handle + // frameNavigated event to clear any saved state. + Inspector.Page.navigate(docUrl); } else if (wasRequested) { // Update highlight showHighlight(); diff --git a/src/nls/root/strings.js b/src/nls/root/strings.js index 657511bb586..0e244147d58 100644 --- a/src/nls/root/strings.js +++ b/src/nls/root/strings.js @@ -77,7 +77,7 @@ define({ "ERROR_MAX_FILES_TITLE" : "Error Indexing Files", "ERROR_MAX_FILES" : "The maximum number of files have been indexed. Actions that look up files in the index may function incorrectly.", - // Live Development error strings + // Live Preview error strings "ERROR_LAUNCHING_BROWSER_TITLE" : "Error launching browser", "ERROR_CANT_FIND_CHROME" : "The Google Chrome browser could not be found. Please make sure it is installed.", "ERROR_LAUNCHING_BROWSER" : "An error occurred when launching the browser. (error {0})", @@ -85,13 +85,13 @@ define({ "LIVE_DEVELOPMENT_ERROR_TITLE" : "Live Preview Error", "LIVE_DEVELOPMENT_RELAUNCH_TITLE" : "Connecting to Browser", "LIVE_DEVELOPMENT_ERROR_MESSAGE" : "In order for Live Preview to connect, Chrome needs to be relaunched with remote debugging enabled.

Would you like to relaunch Chrome and enable remote debugging?", - "LIVE_DEV_LOADING_ERROR_MESSAGE" : "Unable to load Live Development page", + "LIVE_DEV_LOADING_ERROR_MESSAGE" : "Unable to load Live Preview page", "LIVE_DEV_NEED_HTML_MESSAGE" : "Open an HTML file or make sure there is an index.html file in your project in order to launch live preview.", "LIVE_DEV_NEED_BASEURL_MESSAGE" : "To launch live preview with a server-side file, you need to specify a Base URL for this project.", - "LIVE_DEV_SERVER_NOT_READY_MESSAGE" : "Error starting up the HTTP server for live development files. Please try again.", + "LIVE_DEV_SERVER_NOT_READY_MESSAGE" : "Error starting up the HTTP server for live preview files. Please try again.", "LIVE_DEVELOPMENT_INFO_TITLE" : "Welcome to Live Preview!", "LIVE_DEVELOPMENT_INFO_MESSAGE" : "Live Preview connects {APP_NAME} to your browser. It launches a preview of your HTML file in the browser, then updates the preview instantly as you edit your code.

In this early version of {APP_NAME}, Live Preview only works with Google Chrome and updates live as you edit CSS or HTML files. Changes to JavaScript files are automatically reloaded when you save.

(You'll only see this message once.)", - "LIVE_DEVELOPMENT_TROUBLESHOOTING" : "For more information, see Troubleshooting Live Development connection errors.", + "LIVE_DEVELOPMENT_TROUBLESHOOTING" : "For more information, see Troubleshooting Live Preview connection errors.", "LIVE_DEV_STATUS_TIP_NOT_CONNECTED" : "Live Preview", "LIVE_DEV_STATUS_TIP_PROGRESS1" : "Live Preview: Connecting\u2026", From f14459155b1758d57dfbb8d1c6ce569c8a5781c5 Mon Sep 17 00:00:00 2001 From: Jason San Jose Date: Thu, 6 Mar 2014 20:27:43 -0800 Subject: [PATCH 2/5] update status when changing HTML documents --- src/LiveDevelopment/LiveDevelopment.js | 13 +++++++++---- 1 file changed, 9 insertions(+), 4 deletions(-) diff --git a/src/LiveDevelopment/LiveDevelopment.js b/src/LiveDevelopment/LiveDevelopment.js index f4e4f2b268b..bac15ddf5cb 100644 --- a/src/LiveDevelopment/LiveDevelopment.js +++ b/src/LiveDevelopment/LiveDevelopment.js @@ -1258,17 +1258,22 @@ define(function LiveDevelopment(require, exports, module) { isViewable = exports.config.experimental || (_server && _server.canServe(doc.file.fullPath)); if (!wasRequested && isViewable) { - // TODO setStatus()? + // Update status + _setStatus(STATUS_CONNECTING); - // clear related docs + // clear live doc and related docs _closeDocuments(); - // TODO change live doc + // create new live doc _createLiveDocumentForFrame(doc); // Navigate to the new page within this site. Agents must handle // frameNavigated event to clear any saved state. - Inspector.Page.navigate(docUrl); + Inspector.Page.navigate(docUrl).then(function () { + _setStatus(STATUS_ACTIVE); + }, function () { + _close(false, "closed_unknown_reason"); + }); } else if (wasRequested) { // Update highlight showHighlight(); From 0e300ad807c3464c6e0c84a1e77ab87e53ed9bf0 Mon Sep 17 00:00:00 2001 From: Jason San Jose Date: Fri, 7 Mar 2014 11:12:46 -0800 Subject: [PATCH 3/5] fix jslint errors --- src/LiveDevelopment/Agents/NetworkAgent.js | 8 ++++---- src/LiveDevelopment/Inspector/Inspector.js | 4 ++-- 2 files changed, 6 insertions(+), 6 deletions(-) diff --git a/src/LiveDevelopment/Agents/NetworkAgent.js b/src/LiveDevelopment/Agents/NetworkAgent.js index f7f6f742b8c..5852df47ee2 100644 --- a/src/LiveDevelopment/Agents/NetworkAgent.js +++ b/src/LiveDevelopment/Agents/NetworkAgent.js @@ -64,6 +64,10 @@ define(function NetworkAgent(require, exports, module) { _logURL(res.request.url); } + function _reset() { + _urlRequested = {}; + } + // WebInspector Event: Page.frameNavigated function _onFrameNavigated(event, res) { // res = {frame} @@ -79,10 +83,6 @@ define(function NetworkAgent(require, exports, module) { return Inspector.Network.enable(); } - function _reset() { - _urlRequested = {}; - } - /** Initialize the agent */ function load() { $(Inspector.Page).on("frameNavigated.NetworkAgent", _onFrameNavigated); diff --git a/src/LiveDevelopment/Inspector/Inspector.js b/src/LiveDevelopment/Inspector/Inspector.js index 35f0b14df5b..40713abd836 100644 --- a/src/LiveDevelopment/Inspector/Inspector.js +++ b/src/LiveDevelopment/Inspector/Inspector.js @@ -214,7 +214,7 @@ define(function Inspector(require, exports, module) { var response = JSON.parse(message.data), msgRecord = _messageCallbacks[response.id], callback = msgRecord && msgRecord.callback, - message = (msgRecord && msgRecord.message) || "No message"; + msgText = (msgRecord && msgRecord.message) || "No message"; if (msgRecord) { // Messages with an ID are a response to a command, fire callback @@ -233,7 +233,7 @@ define(function Inspector(require, exports, module) { $exports.triggerHandler("message", [response]); if (response.error) { - $exports.triggerHandler("error", [response.error, message]); + $exports.triggerHandler("error", [response.error, msgText]); } } From 39de98142550731da6e7719a39f17524eff84167 Mon Sep 17 00:00:00 2001 From: Jason San Jose Date: Fri, 7 Mar 2014 13:16:44 -0800 Subject: [PATCH 4/5] sanity check args in BaseServer add/remove --- src/LiveDevelopment/Servers/BaseServer.js | 8 ++++++++ src/extensions/psd-lens | 1 + 2 files changed, 9 insertions(+) create mode 160000 src/extensions/psd-lens diff --git a/src/LiveDevelopment/Servers/BaseServer.js b/src/LiveDevelopment/Servers/BaseServer.js index aab6c66edfd..ac7e25fab4f 100644 --- a/src/LiveDevelopment/Servers/BaseServer.js +++ b/src/LiveDevelopment/Servers/BaseServer.js @@ -169,6 +169,10 @@ define(function (require, exports, module) { * @param {Object} liveDocument */ BaseServer.prototype.add = function (liveDocument) { + if (!liveDocument) { + return; + } + // use the project relative path as a key to lookup requests var key = this._documentKey(liveDocument.doc.file.fullPath); @@ -181,6 +185,10 @@ define(function (require, exports, module) { * @param {Object} liveDocument */ BaseServer.prototype.remove = function (liveDocument) { + if (!liveDocument) { + return; + } + var key = this._liveDocuments[this._documentKey(liveDocument.doc.file.fullPath)]; if (key) { diff --git a/src/extensions/psd-lens b/src/extensions/psd-lens new file mode 160000 index 00000000000..d71e1a78376 --- /dev/null +++ b/src/extensions/psd-lens @@ -0,0 +1 @@ +Subproject commit d71e1a783761a18d229e5531e3ef9d23b6114604 From e34e931b8841a9886dece2c0ed6fd13469bc2ec6 Mon Sep 17 00:00:00 2001 From: Jason San Jose Date: Fri, 7 Mar 2014 13:30:03 -0800 Subject: [PATCH 5/5] remove extraneous dir --- src/extensions/psd-lens | 1 - 1 file changed, 1 deletion(-) delete mode 160000 src/extensions/psd-lens diff --git a/src/extensions/psd-lens b/src/extensions/psd-lens deleted file mode 160000 index d71e1a78376..00000000000 --- a/src/extensions/psd-lens +++ /dev/null @@ -1 +0,0 @@ -Subproject commit d71e1a783761a18d229e5531e3ef9d23b6114604