Skip to content

C
coopwire-hypothesis
Unverified Commit acfd9871 authored by Robert Knight's avatar Robert Knight Committed by GitHub
Browse files
Options

Merge pull request #1839 from hypothesis/remove-live-reload 

Remove live-reload functionality from dev server
parents 599e25e5 0d0d683c
Hide whitespace changes
Inline Side-by-side
Showing with 12 additions and 238 deletions
gulpfile.js
View file @ acfd9871
......@@ -7,7 +7,6 @@ const path = require('path');
const changed = require('gulp-changed');
const commander = require('commander');
const debounce = require('lodash.debounce');
const log = require('fancy-log');
const gulp = require('gulp');
const replace = require('gulp-replace');
......@@ -25,14 +24,6 @@ const SCRIPT_DIR = 'build/scripts';
const STYLE_DIR = 'build/styles';
const FONTS_DIR = 'build/fonts';
const IMAGES_DIR = 'build/images';
const TEMPLATES_DIR = 'src/sidebar/templates';
// LiveReloadServer instance for sending messages to connected
// development clients
let liveReloadServer;
// List of file paths that changed since the last live-reload
// notification was dispatched
let liveReloadChangedFiles = [];
function parseCommandLine() {
commander
......@@ -234,47 +225,9 @@ gulp.task(
})
);
gulp.task('watch-templates', function() {
gulp.watch(TEMPLATES_DIR + '/*.html', function(file) {
liveReloadServer.notifyChanged([file.path]);
});
});
const MANIFEST_SOURCE_FILES =
'build/@(fonts|images|scripts|styles)/*.@(js|css|woff|jpg|png|svg)';
let prevManifest = {};
/**
* Return an array of asset paths that changed between
* two versions of a manifest.
*/
function changedAssets(prevManifest, newManifest) {
return Object.keys(newManifest).filter(function(asset) {
return newManifest[asset] !== prevManifest[asset];
});
}
const debouncedLiveReload = debounce(function() {
// Notify dev clients about the changed assets. Note: This currently has an
// issue that if CSS, JS and templates are all changed in quick succession,
// some of the assets might be empty/incomplete files that are still being
// generated when this is invoked, causing the reload to fail.
//
// Live reload notifications are debounced to reduce the likelihood of this
// happening.
liveReloadServer.notifyChanged(liveReloadChangedFiles);
liveReloadChangedFiles = [];
}, 250);
function triggerLiveReload(changedFiles) {
if (!liveReloadServer) {
return;
}
liveReloadChangedFiles = liveReloadChangedFiles.concat(changedFiles);
debouncedLiveReload();
}
let isFirstBuild = true;
/**
......@@ -328,11 +281,7 @@ function generateManifest(opts) {
.pipe(manifest({ name: 'manifest.json' }))
.pipe(
through.obj(function(file, enc, callback) {
// Trigger a reload of the client in the dev server at localhost:3000
const newManifest = JSON.parse(file.contents.toString());
const changed = changedAssets(prevManifest, newManifest);
prevManifest = newManifest;
triggerLiveReload(changed);
// Expand template vars in boot script bundle
generateBootScript(newManifest, opts);
......@@ -354,9 +303,9 @@ gulp.task('serve-package', function() {
servePackage(3001);
});
gulp.task('serve-live-reload', function() {
const LiveReloadServer = require('./scripts/gulp/live-reload-server');
liveReloadServer = new LiveReloadServer(3000, {
gulp.task('serve-test-pages', function() {
const DevServer = require('./scripts/gulp/dev-server');
new DevServer(3000, {
// The scheme is omitted here as the client asset server will use the same
// protcol (HTTP or HTTPS) as the test page server.
clientUrl: `//{current_host}:3001/hypothesis`,
......@@ -375,13 +324,12 @@ gulp.task(
'watch',
gulp.parallel(
'serve-package',
'serve-live-reload',
'serve-test-pages',
'watch-js',
'watch-css',
'watch-fonts',
'watch-images',
'watch-manifest',
'watch-templates'
'watch-manifest'
)
);
......
package.json
View file @ acfd9871
......@@ -108,7 +108,6 @@
"unorm": "^1.3.3",
"vinyl": "^2.2.0",
"watchify": "^3.7.0",
"websocket": "^1.0.22",
"whatwg-fetch": "^3.0.0",
"wicked-good-xpath": "^1.3.0",
"wrap-text": "^1.0.7",
......
scripts/gulp/live-reload-server.js → scripts/gulp/dev-server.js
View file @ acfd9871
......@@ -2,7 +2,6 @@
const fs = require('fs');
const log = require('fancy-log');
const WebSocketServer = require('websocket').server;
const urlParser = require('url');
const { createServer, useSsl } = require('./create-server');
......@@ -25,21 +24,14 @@ function codeOfConductText() {
*/
/**
* An HTTP and WebSocket server which enables live reloading of the client.
*
* A simple HTTP and WebSocket server
* which serves a test page with the Hypothesis client embedded
* and notifies connected clients when assets are modified, enabling
* the client to live-reload.
* An HTTP server which serves a test page with the development client embedded.
*
* @param {number} port - The port that the test server should listen on.
* @param {Config} config - Config for the server
*
* @constructor
*/
function LiveReloadServer(port, config) {
let connections = [];
function DevServer(port, config) {
function listen() {
const app = function(req, response) {
const url = urlParser.parse(req.url);
......@@ -95,7 +87,6 @@ function LiveReloadServer(port, config) {
window.hypothesisConfig = function () {
return {
liveReloadServer: 'ws://' + appHost + ':${port}',
// Force into focused user mode
// Example focused user mode
......@@ -112,12 +103,6 @@ function LiveReloadServer(port, config) {
};
};
window.addEventListener('message', function (event) {
if (event.data.type && event.data.type === 'reloadrequest') {
window.location.reload();
}
});
var embedScript = document.createElement('script');
embedScript.src = '${
config.clientUrl
......@@ -153,49 +138,14 @@ function LiveReloadServer(port, config) {
const server = createServer(app);
server.listen(port, function(err) {
if (err) {
log('Setting up live reload server failed', err);
log('Setting up dev server failed', err);
}
const scheme = useSsl ? 'https' : 'http';
log(`Live reload server listening at ${scheme}://localhost:${port}/`);
});
const ws = new WebSocketServer({
httpServer: server,
});
ws.on('request', function(req) {
log('Live reload client connected');
const conn = req.accept(null, req.origin);
connections.push(conn);
conn.on('close', function() {
const closedConn = conn;
connections = connections.filter(function(conn) {
return conn !== closedConn;
});
});
log(`Dev server listening at ${scheme}://localhost:${port}/`);
});
}
/**
* Notify connected clients about assets that changed.
*
* @param {Array<string>} assets - A list of paths of assets that changed.
* Paths are relative to the root asset
* build directory.
*/
this.notifyChanged = function(assets) {
connections.forEach(function(conn) {
conn.sendUTF(
JSON.stringify({
type: 'assets-changed',
changed: assets,
})
);
});
};
listen();
}
module.exports = LiveReloadServer;
module.exports = DevServer;
src/sidebar/index.js
View file @ acfd9871
......@@ -332,10 +332,6 @@ function startAngularApp(config) {
.run(setupApi)
.run(crossOriginRPC.server.start);
if (config.liveReloadServer) {
require('./live-reload-client').connect(config.liveReloadServer);
}
// Work around a check in Angular's $sniffer service that causes it to
// incorrectly determine that Firefox extensions are Chrome Packaged Apps which
// do not support the HTML 5 History API. This results Angular redirecting the
......
src/sidebar/live-reload-client.js deleted 100644 → 0
View file @ 599e25e5
/* eslint no-console: "off" */
import * as queryString from 'query-string';
import Socket from './websocket';
/**
* Return a URL with a cache-busting query string parameter added.
*
* @param {string} url - The original asset URL
* @return {string} The URL with a cache-buster added.
*/
function cacheBustURL(url) {
let newUrl = url;
const cacheBuster = queryString.parse({ timestamp: Date.now() });
if (url.indexOf('?') !== -1) {
newUrl += '&' + cacheBuster;
} else {
newUrl += '?' + cacheBuster;
}
return newUrl;
}
/**
* Return true if a URL matches a list of paths of modified assets.
*
* @param {string} url - The URL of the stylesheet, script or other resource.
* @param {Array<string>} changed - List of paths of modified assets.
*/
function didAssetChange(url, changed) {
return changed.some(function(path) {
return url.indexOf(path) !== -1;
});
}
/**
* Reload a stylesheet or media element if it references a file
* in a list of changed assets.
*
* @param {Element} element - An HTML <link> tag or media element.
* @param {Array<string>} changed - List of paths of modified assets.
*/
function maybeReloadElement(element, changed) {
const parentElement = element.parentNode;
const newElement = element.cloneNode();
const srcKeys = ['href', 'src'];
srcKeys.forEach(function(key) {
if (key in element && didAssetChange(element[key], changed)) {
newElement[key] = cacheBustURL(element[key]);
}
});
parentElement.replaceChild(newElement, element);
}
function reloadExternalStyleSheets(changed) {
const linkTags = [].slice.apply(document.querySelectorAll('link'));
linkTags.forEach(function(tag) {
maybeReloadElement(tag, changed);
});
}
/**
* Connect to the live-reload server at @p url.
*
* @param {string} url - The URL of the live reload server. If undefined,
* the 'livereloadserver' query string parameter is
* used.
*/
export function connect(url) {
const conn = new Socket(url);
conn.on('open', function() {
console.log('Live reload client listening');
});
conn.on('message', function(event) {
const message = JSON.parse(event.data);
if (message.type === 'assets-changed') {
const scriptsOrTemplatesChanged = message.changed.some(function(path) {
return path.match(/\.(html|js)$/);
});
const stylesChanged = message.changed.some(function(path) {
return path.match(/\.css$/);
});
if (scriptsOrTemplatesChanged) {
// Ask the host page to reload the client (eg. by reloading itself).
window.top.postMessage({ type: 'reloadrequest' }, '*');
return;
}
if (stylesChanged) {
reloadExternalStyleSheets(message.changed);
}
}
});
conn.on('error', function(err) {
console.error('Error connecting to live reload server:', err);
});
}
yarn.lock
View file @ acfd9871
......@@ -4800,7 +4800,7 @@ is-symbol@^1.0.2:
dependencies:
has-symbols "^1.0.0"
is-typedarray@^1.0.0, is-typedarray@~1.0.0:
is-typedarray@~1.0.0:
version "1.0.0"
resolved "https://registry.yarnpkg.com/is-typedarray/-/is-typedarray-1.0.0.tgz#e479c80858df0c1b11ddda6940f96011fcda4a9a"
integrity sha1-5HnICFjfDBsR3dppQPlgEfzaSpo=
......@@ -5687,7 +5687,7 @@ mute-stream@0.0.8:
resolved "https://registry.yarnpkg.com/mute-stream/-/mute-stream-0.0.8.tgz#1630c42b2251ff81e2a283de96a5497ea92e5e0d"
integrity sha512-nnbWWOkoWyUsTjKrhgD0dcz22mdkSnpYqbEjIm2nhwhuxlSkpywJmBo8h0ZqJdkp73mb90SssHkN4rsRaBAfAA==
nan@^2.12.1, nan@^2.14.0:
nan@^2.12.1:
version "2.14.0"
resolved "https://registry.yarnpkg.com/nan/-/nan-2.14.0.tgz#7818f722027b2459a86f0295d434d1fc2336c52c"
integrity sha512-INOFj37C7k3AfaNTtX8RhsTw7qRy7eLET14cROi9+5HAVbbHuIWUHEauBv5qT4Av2tWasiTY1Jw6puUNqRJXQg==
......@@ -8130,13 +8130,6 @@ type@^1.0.1:
resolved "https://registry.yarnpkg.com/type/-/type-1.0.1.tgz#084c9a17fcc9151a2cdb1459905c2e45e4bb7d61"
integrity sha512-MAM5dBMJCJNKs9E7JXo4CXRAansRfG0nlJxW7Wf6GZzSOvH31zClSaHdIMWLehe/EGMBkqeC55rrkaOr5Oo7Nw==
typedarray-to-buffer@^3.1.5:
version "3.1.5"
resolved "https://registry.yarnpkg.com/typedarray-to-buffer/-/typedarray-to-buffer-3.1.5.tgz#a97ee7a9ff42691b9f783ff1bc5112fe3fca9080"
integrity sha512-zdu8XMNEDepKKR+XYOXAVPtWui0ly0NtohUscw+UmaHiAWT8hrV1rr//H6V+0DvJ3OQ19S979M0laLfX8rm82Q==
dependencies:
is-typedarray "^1.0.0"
typedarray@^0.0.6:
version "0.0.6"
resolved "https://registry.yarnpkg.com/typedarray/-/typedarray-0.0.6.tgz#867ac74e3864187b1d3d47d996a78ec5c8830777"
......@@ -8482,17 +8475,6 @@ webidl-conversions@^4.0.2:
resolved "https://registry.yarnpkg.com/webidl-conversions/-/webidl-conversions-4.0.2.tgz#a855980b1f0b6b359ba1d5d9fb39ae941faa63ad"
integrity sha512-YQ+BmxuTgd6UXZW3+ICGfyqRyHXVlD5GtQr5+qjiNW7bF0cqrzX500HVXPBOvgXb5YnzDd+h0zqyv61KUD7+Sg==
websocket@^1.0.22:
version "1.0.31"
resolved "https://registry.yarnpkg.com/websocket/-/websocket-1.0.31.tgz#e5d0f16c3340ed87670e489ecae6144c79358730"
integrity sha512-VAouplvGKPiKFDTeCCO65vYHsyay8DqoBSlzIO3fayrfOgU94lQN5a1uWVnFrMLceTJw/+fQXR5PGbUVRaHshQ==
dependencies:
debug "^2.2.0"
es5-ext "^0.10.50"
nan "^2.14.0"
typedarray-to-buffer "^3.1.5"
yaeti "^0.0.6"
whatwg-fetch@^3.0.0:
version "3.0.0"
resolved "https://registry.yarnpkg.com/whatwg-fetch/-/whatwg-fetch-3.0.0.tgz#fc804e458cc460009b1a2b966bc8817d2578aefb"
......@@ -8662,11 +8644,6 @@ y18n@^4.0.0:
resolved "https://registry.yarnpkg.com/y18n/-/y18n-4.0.0.tgz#95ef94f85ecc81d007c264e190a120f0a3c8566b"
integrity sha512-r9S/ZyXu/Xu9q1tYlpsLIsa3EeLXXk0VwlxqTcFRfg9EhMW+17kbt9G0NrgCmhGb5vT2hyhJZLfDGx+7+5Uj/w==
yaeti@^0.0.6:
version "0.0.6"
resolved "https://registry.yarnpkg.com/yaeti/-/yaeti-0.0.6.tgz#f26f484d72684cf42bedfb76970aa1608fbf9577"
integrity sha1-8m9ITXJoTPQr7ft2lwqhYI+/lXc=
yallist@^2.1.2:
version "2.1.2"
resolved "https://registry.yarnpkg.com/yallist/-/yallist-2.1.2.tgz#1c11f9218f076089a47dd512f93c6699a6a81d52"
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment