DevTools: implement proxy server for hosted mode

third_party/WebKit/Source/devtools/hosted_mode/server.js

+// Copyright (c) 2016 The Chromium Authors. All rights reserved.

[lushnikov, 2016/07/25 19:33:44]

Let's create hosted_mode under scripts/ folder

[chenwilliam, 2016/07/25 21:58:45]

Done.

+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+var fs = require("fs");
+var http = require("http");
+var https = require("https");
+var path = require("path");
+var parseUrl = require("url").parse;

[lushnikov, 2016/07/25 19:33:44]

nit: parseURL (abbreviation should be capitalized)

[chenwilliam, 2016/07/25 21:58:46]

Done.

+
+var port = parseInt(process.env.PORT, 10) || 8090;
+
+http.createServer(requestHandler).listen(port);
+console.log("Starting hosted mode server at:\n  http://localhost:" + port);

[lushnikov, 2016/07/25 19:33:44]

nit: "Started hosted mode server at http://localhost:" + port

[chenwilliam, 2016/07/25 21:58:46]

Done.

+
+function requestHandler(request, response)
+{
+    var filePath = parseUrl(request.url).pathname;
+

[lushnikov, 2016/07/25 19:33:44]

nit: let's kill newline

[chenwilliam, 2016/07/25 21:58:46]

Done.

+    if (filePath === "/front_end/InspectorBackendCommands.js") {
+        sendResponse(200, " ");
+        return;
+    }
+
+    if (proxy(filePath, sendResponse))
+        return;
+
+    var absoluteFilePath = path.join(process.cwd(), filePath);
+    fs.exists(absoluteFilePath, fsExistsCallback);
+
+    function fsExistsCallback(fileExists)
+    {
+        if (!fileExists) {
+            sendResponse(404, "404 - File not found");
+            return;
+        }
+        fs.readFile(absoluteFilePath, "binary", readFileCallback);
+    }
+
+    function readFileCallback(err, file)
+    {
+        if (err) {
+            sendResponse(500, `500 - Can't read file: ${err}`);
+            return;
+        }
+        sendResponse(200, file);
+    }
+
+    function sendResponse(statusCode, data)
+    {
+        response.writeHead(statusCode);
+        response.write(data, "binary");
+        response.end();
+    }
+}
+
+var protocolFileToPath = {

[lushnikov, 2016/07/25 19:33:44]

can we proxy SupportedCSSProperties.js in the same fashion?

[chenwilliam, 2016/07/25 21:58:45]

I don't think we can because SupportedCSSProperties.js is a generated file and I
can't find it on googlesource.com (or codesearch)

+    "/front_end/sdk/protocol/js_protocol.json": "core/inspector/browser_protocol.json",
+    "/front_end/sdk/protocol/browser_protocol.json": "platform/v8_inspector/js_protocol.json"
+};
+
+var protocolFileCache = new Map();
+
+function proxy(filePath, sendResponse)

[lushnikov, 2016/07/25 19:33:44]

let's not pass sendResponse in proxy

[chenwilliam, 2016/07/25 21:58:45]

Done.

+{
+    if (!(filePath in protocolFileToPath))
+        return null;
+    return fetch("http://localhost:9222/json/version")
+        .then(onBrowserMetadata)
+        .then(data => sendResponse(200, data))
+        .catch(err => console.log(`Error getting ${filePath}:`, err));
+
+    function onBrowserMetadata(metadata)
+    {
+        var metadataObject = JSON.parse(metadata);
+        var match = metadataObject["WebKit-Version"].match(/\s\(@(\b[0-9a-f]{5,40}\b)/);
+        var commitHash = match[1];
+        var protocolFileURL = getURL(filePath, commitHash);
+        if (protocolFileCache.has(protocolFileURL))
+            return protocolFileCache.get(protocolFileURL);
+        return fetch(protocolFileURL)
+            .then(text => new Buffer(text, "base64").toString("binary"))
+            .then(cacheProtocolFile.bind(null, protocolFileURL));
+    }
+
+    function getURL(protocolFile, commitHash)
+    {
+        var path = protocolFileToPath[protocolFile];
+        return `https://chromium.googlesource.com/chromium/src/+/${commitHash}/third_party/WebKit/Source/${path}?format=TEXT`;
+    }
+
+    function cacheProtocolFile(protocolFileURL, data)
+    {
+        protocolFileCache.set(protocolFileURL, data);
+        return data;
+    }
+}
+
+function fetch(url)
+{
+    return new Promise((resolve, reject) => {

[lushnikov, 2016/07/25 19:33:44]

style: we don't use multiline arrow functions, let's extract in a named function

[chenwilliam, 2016/07/25 21:58:46]

Done.

+        var request;
+        var protocol = parseUrl(url).protocol;
+
+        if (protocol === "https:") {
+            request = https.get(url, handleResponse);
+        } else if (protocol === "http:") {
+            request = http.get(url, handleResponse);
+        } else {
+            reject(new Error(`Invalid protocol for url: ${url}`));
+            return;
+        }
+
+        function handleResponse(response)

[lushnikov, 2016/07/25 19:33:44]

let's unnest this (the less nesting, the better!)

[chenwilliam, 2016/07/25 21:58:46]

Done.

+        {
+            if (response.statusCode !== 200) {
+                reject(new Error(`Request error: + ${response.statusCode}`));
+                return;
+            }
+            var body = "";
+            response.on("data", chunk => body += chunk);
+            response.on("end", () => resolve(body));
+        }
+
+        request.on("error", (err) => reject(err));
+    });
+}