--- a/.eslintignore
+++ b/.eslintignore
@@ -75,35 +75,30 @@ browser/extensions/pdfjs/**
 browser/extensions/pocket/content/panels/js/tmpl.js
 browser/extensions/pocket/content/panels/js/vendor/**
 browser/locales/**
 
 # devtools/ exclusions
 devtools/client/canvasdebugger/**
 devtools/client/commandline/**
 devtools/client/debugger/**
-devtools/client/eyedropper/**
 devtools/client/framework/**
 !devtools/client/framework/selection.js
 !devtools/client/framework/toolbox.js
 devtools/client/jsonview/lib/**
 devtools/client/memory/**
 devtools/client/netmonitor/test/**
 devtools/client/netmonitor/har/test/**
 devtools/client/projecteditor/**
 devtools/client/promisedebugger/**
 devtools/client/responsivedesign/**
 devtools/client/scratchpad/**
 devtools/client/shadereditor/**
 devtools/client/shared/*.jsm
 devtools/client/shared/webgl-utils.js
-devtools/client/shared/components/test/**
-devtools/client/shared/redux/middleware/test/**
-devtools/client/shared/test/**
-!devtools/client/shared/test/test-actor-registry.js
 devtools/client/shared/widgets/*.jsm
 devtools/client/sourceeditor/test/*.js
 devtools/client/webaudioeditor/**
 devtools/client/webconsole/**
 !devtools/client/webconsole/panel.js
 !devtools/client/webconsole/jsterm.js
 !devtools/client/webconsole/console-commands.js
 devtools/client/webide/**

--- a/devtools/client/shared/components/test/browser/browser_notification_box_basic.js
+++ b/devtools/client/shared/components/test/browser/browser_notification_box_basic.js
@@ -1,15 +1,17 @@
 /* -*- indent-tabs-mode: nil; js-indent-level: 2 -*- */
 /* vim: set ts=2 et sw=2 tw=80: */
 /* Any copyright is dedicated to the Public Domain.
  * http://creativecommons.org/publicdomain/zero/1.0/ */
 
 "use strict";
 
+/* import-globals-from ../../../../framework/test/shared-head.js */
+
 Services.scriptloader.loadSubScript(
   "chrome://mochitests/content/browser/devtools/client/framework/test/shared-head.js", this);
 
 const TEST_URI = "data:text/html;charset=utf-8,Test page";
 
 /**
  * Basic test that checks existence of the Notification box.
  */

--- a/devtools/client/shared/components/test/mochitest/head.js
+++ b/devtools/client/shared/components/test/mochitest/head.js
@@ -44,39 +44,39 @@ SimpleTest.waitForExplicitFinish();
 
 function onNextAnimationFrame(fn) {
   return () =>
     requestAnimationFrame(() =>
       requestAnimationFrame(fn));
 }
 
 function setState(component, newState) {
-  var deferred = defer();
-  component.setState(newState, onNextAnimationFrame(deferred.resolve));
-  return deferred.promise;
+  return new Promise(resolve => {
+    component.setState(newState, onNextAnimationFrame(resolve));
+  });
 }
 
-function setProps(component, newState) {
-  var deferred = defer();
-  component.setProps(newState, onNextAnimationFrame(deferred.resolve));
-  return deferred.promise;
+function setProps(component, newProps) {
+  return new Promise(resolve => {
+    component.setProps(newProps, onNextAnimationFrame(resolve));
+  });
 }
 
 function dumpn(msg) {
   dump(`SHARED-COMPONENTS-TEST: ${msg}\n`);
 }
 
 /**
  * Tree
  */
 
 var TEST_TREE_INTERFACE = {
   getParent: x => TEST_TREE.parent[x],
   getChildren: x => TEST_TREE.children[x],
-  renderItem: (x, depth, focused, arrow) => "-".repeat(depth) + x + ":" + focused + "\n",
+  renderItem: (x, depth, focused) => "-".repeat(depth) + x + ":" + focused + "\n",
   getRoots: () => ["A", "M"],
   getKey: x => "key-" + x,
   itemHeight: 1,
   onExpand: x => TEST_TREE.expanded.add(x),
   onCollapse: x => TEST_TREE.expanded.delete(x),
   isExpanded: x => TEST_TREE.expanded.has(x),
 };
 
@@ -140,28 +140,31 @@ var TEST_TREE = {
     O: "N"
   },
   expanded: new Set(),
 };
 
 /**
  * Frame
  */
-function checkFrameString({ el, file, line, column, source, functionName, shouldLink, tooltip }) {
+function checkFrameString({
+  el, file, line, column, source, functionName, shouldLink, tooltip
+}) {
   let $ = selector => el.querySelector(selector);
 
   let $func = $(".frame-link-function-display-name");
   let $source = $(".frame-link-source");
   let $sourceInner = $(".frame-link-source-inner");
   let $filename = $(".frame-link-filename");
   let $line = $(".frame-link-line");
 
   is($filename.textContent, file, "Correct filename");
   is(el.getAttribute("data-line"), line ? `${line}` : null, "Expected `data-line` found");
-  is(el.getAttribute("data-column"), column ? `${column}` : null, "Expected `data-column` found");
+  is(el.getAttribute("data-column"),
+     column ? `${column}` : null, "Expected `data-column` found");
   is($sourceInner.getAttribute("title"), tooltip, "Correct tooltip");
   is($source.tagName, shouldLink ? "A" : "SPAN", "Correct linkable status");
   if (shouldLink) {
     is($source.getAttribute("href"), source, "Correct source");
   }
 
   if (line != null) {
     let lineText = `:${line}`;

--- a/devtools/client/shared/components/test/mochitest/test_stack-trace.html
+++ b/devtools/client/shared/components/test/mochitest/test_stack-trace.html
@@ -11,20 +11,25 @@ Test the rendering of a stack trace
   <title>StackTrace component test</title>
   <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
   <script src="chrome://mochikit/content/tests/SimpleTest/SpawnTask.js"></script>
   <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
 </head>
 <body>
 <script src="head.js"></script>
 <script>
-window.onload = function() {
+/* import-globals-from head.js */
+"use strict";
+
+window.onload = function () {
   let ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
   let React = browserRequire("devtools/client/shared/vendor/react");
-  let StackTrace = React.createFactory(browserRequire("devtools/client/shared/components/stack-trace"));
+  let StackTrace = React.createFactory(
+    browserRequire("devtools/client/shared/components/stack-trace")
+  );
   ok(StackTrace, "Got the StackTrace factory");
 
   add_task(function* () {
     let stacktrace = [
       {
         filename: "http://myfile.com/mahscripts.js",
         lineNumber: 55,
         columnNumber: 10
@@ -62,17 +67,18 @@ window.onload = function() {
       file: "http://myfile.com/mahscripts.js",
       line: 55,
       column: 10,
       shouldLink: true,
       tooltip: "View source in Debugger → http://myfile.com/mahscripts.js:55:10",
     });
 
     // Check the async cause node
-    is(frameEls[1].className, "frame-link-async-cause", "Async cause has the right class");
+    is(frameEls[1].className, "frame-link-async-cause",
+       "Async cause has the right class");
     is(frameEls[1].textContent, "(Async: because)", "Async cause has the right label");
 
     // Check the third frame, the source should be parsed into a valid source URL
     checkFrameString({
       el: frameEls[2],
       functionName: "loadFunc",
       source: "http://myfile.com/loadee.js",
       file: "http://myfile.com/loadee.js",
@@ -85,12 +91,12 @@ window.onload = function() {
     // Check the tabs and newlines in the stack trace textContent
     let traceText = traceEl.textContent;
     let traceLines = traceText.split("\n");
     ok(traceLines.length > 0, "There are newlines in the stack trace text");
     is(traceLines.pop(), "", "There is a newline at the end of the stack trace text");
     is(traceLines.length, 3, "The stack trace text has 3 lines");
     ok(traceLines.every(l => l[0] == "\t"), "Every stack trace line starts with tab");
   });
-}
+};
 </script>
 </body>
 </html>

new file mode 100644
--- /dev/null
+++ b/devtools/client/shared/redux/middleware/test/.eslintrc.js
@@ -0,0 +1,17 @@
+"use strict";
+
+module.exports = {
+  // Extend from the shared list of defined globals for mochitests.
+  "extends": "../../../../../.eslintrc.mochitests.js",
+  "globals": {
+    "run_test": true,
+    "run_next_test": true,
+    "equal": true,
+    "do_print": true,
+    "waitUntilState": true
+  },
+  "rules": {
+    // Stop giving errors for run_test
+    "camelcase": "off"
+  }
+};

--- a/devtools/client/shared/redux/middleware/test/head.js
+++ b/devtools/client/shared/redux/middleware/test/head.js
@@ -1,28 +1,27 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
-var { classes: Cc, interfaces: Ci, utils: Cu, results: Cr } = Components;
-var { require } = Cu.import("resource://devtools/shared/Loader.jsm", {});
-var flags = require("devtools/shared/flags");
-var promise = require("promise");
-var defer = require("devtools/shared/defer");
+/* exported waitUntilState */
+
+"use strict";
+
+const { require } = Components.utils.import("resource://devtools/shared/Loader.jsm", {});
+const flags = require("devtools/shared/flags");
 
 flags.testing = true;
 
 function waitUntilState(store, predicate) {
-  let deferred = defer();
-  let unsubscribe = store.subscribe(check);
-
-  function check() {
-    if (predicate(store.getState())) {
-      unsubscribe();
-      deferred.resolve();
+  return new Promise(resolve => {
+    let unsubscribe = store.subscribe(check);
+    function check() {
+      if (predicate(store.getState())) {
+        unsubscribe();
+        resolve();
+      }
     }
-  }
 
-  // Fire the check immediately incase the action has already occurred
-  check();
-
-  return deferred.promise;
+    // Fire the check immediately incase the action has already occurred
+    check();
+  });
 }

--- a/devtools/client/shared/redux/middleware/test/test_middleware-task-01.js
+++ b/devtools/client/shared/redux/middleware/test/test_middleware-task-01.js
@@ -1,12 +1,14 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
+"use strict";
+
 const { createStore, applyMiddleware } = require("devtools/client/shared/vendor/redux");
 const { task } = require("devtools/client/shared/redux/middleware/task");
 
 /**
  * Tests that task middleware allows dispatching generators, promises and objects
  * that return actions;
  */
 
@@ -14,21 +16,23 @@ function run_test() {
   run_next_test();
 }
 
 add_task(function* () {
   let store = applyMiddleware(task)(createStore)(reducer);
 
   store.dispatch(fetch1("generator"));
   yield waitUntilState(store, () => store.getState().length === 1);
-  equal(store.getState()[0].data, "generator", "task middleware async dispatches an action via generator");
+  equal(store.getState()[0].data, "generator",
+        "task middleware async dispatches an action via generator");
 
   store.dispatch(fetch2("sync"));
   yield waitUntilState(store, () => store.getState().length === 2);
-  equal(store.getState()[1].data, "sync", "task middleware sync dispatches an action via sync");
+  equal(store.getState()[1].data, "sync",
+        "task middleware sync dispatches an action via sync");
 });
 
 function fetch1(data) {
   return function* (dispatch, getState) {
     equal(getState().length, 0, "`getState` is accessible in a generator action");
     let moreData = yield new Promise(resolve => resolve(data));
     // Ensure it handles more than one yield
     moreData = yield new Promise(resolve => resolve(data));

--- a/devtools/client/shared/redux/middleware/test/test_middleware-task-02.js
+++ b/devtools/client/shared/redux/middleware/test/test_middleware-task-02.js
@@ -1,12 +1,14 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
+"use strict";
+
 /**
  * Tests that task middleware allows dispatching generators that dispatch
  * additional sync and async actions.
  */
 
 const { createStore, applyMiddleware } = require("devtools/client/shared/vendor/redux");
 const { task } = require("devtools/client/shared/redux/middleware/task");
 
@@ -15,22 +17,28 @@ function run_test() {
 }
 
 add_task(function* () {
   let store = applyMiddleware(task)(createStore)(reducer);
 
   store.dispatch(comboAction());
   yield waitUntilState(store, () => store.getState().length === 3);
 
-  equal(store.getState()[0].type, "fetchAsync-start", "Async dispatched actions in a generator task are fired");
-  equal(store.getState()[1].type, "fetchAsync-end", "Async dispatched actions in a generator task are fired");
-  equal(store.getState()[2].type, "fetchSync", "Return values of yielded sync dispatched actions are correct");
-  equal(store.getState()[3].type, "fetch-done", "Return values of yielded async dispatched actions are correct");
-  equal(store.getState()[3].data.sync.data, "sync", "Return values of dispatched sync values are correct");
-  equal(store.getState()[3].data.async, "async", "Return values of dispatched async values are correct");
+  equal(store.getState()[0].type, "fetchAsync-start",
+        "Async dispatched actions in a generator task are fired");
+  equal(store.getState()[1].type, "fetchAsync-end",
+        "Async dispatched actions in a generator task are fired");
+  equal(store.getState()[2].type, "fetchSync",
+        "Return values of yielded sync dispatched actions are correct");
+  equal(store.getState()[3].type, "fetch-done",
+        "Return values of yielded async dispatched actions are correct");
+  equal(store.getState()[3].data.sync.data, "sync",
+        "Return values of dispatched sync values are correct");
+  equal(store.getState()[3].data.async, "async",
+        "Return values of dispatched async values are correct");
 });
 
 function comboAction() {
   return function* (dispatch, getState) {
     let data = {};
     data.async = yield dispatch(fetchAsync("async"));
     data.sync = yield dispatch(fetchSync("sync"));
     dispatch({ type: "fetch-done", data });

--- a/devtools/client/shared/redux/middleware/test/test_middleware-task-03.js
+++ b/devtools/client/shared/redux/middleware/test/test_middleware-task-03.js
@@ -1,35 +1,40 @@
 /* This Source Code Form is subject to the terms of the Mozilla Public
  * License, v. 2.0. If a copy of the MPL was not distributed with this
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
+"use strict";
+
 const { createStore, applyMiddleware } = require("devtools/client/shared/vendor/redux");
 const { task, ERROR_TYPE } = require("devtools/client/shared/redux/middleware/task");
 
 /**
  * Tests that the middleware handles errors thrown in tasks, and rejected promises.
  */
 
 function run_test() {
   run_next_test();
 }
 
 add_task(function* () {
   let store = applyMiddleware(task)(createStore)(reducer);
 
   store.dispatch(generatorError());
   yield waitUntilState(store, () => store.getState().length === 1);
-  equal(store.getState()[0].type, ERROR_TYPE, "generator errors dispatch ERROR_TYPE actions");
-  equal(store.getState()[0].error, "task-middleware-error-generator", "generator errors dispatch ERROR_TYPE actions with error");
+  equal(store.getState()[0].type, ERROR_TYPE,
+        "generator errors dispatch ERROR_TYPE actions");
+  equal(store.getState()[0].error, "task-middleware-error-generator",
+        "generator errors dispatch ERROR_TYPE actions with error");
 });
 
 function generatorError() {
   return function* (dispatch, getState) {
-    throw "task-middleware-error-generator";
+    let error = "task-middleware-error-generator";
+    throw error;
   };
 }
 
 function reducer(state = [], action) {
   do_print("Action called: " + action.type);
   if (action.type === ERROR_TYPE) {
     state.push(action);
   }

--- a/devtools/client/shared/test/.eslintrc.js
+++ b/devtools/client/shared/test/.eslintrc.js
@@ -1,6 +1,9 @@
 "use strict";
 
 module.exports = {
   // Extend from the shared list of defined globals for mochitests.
-  "extends": "../../../.eslintrc.mochitests.js"
+  "extends": "../../../.eslintrc.mochitests.js",
+  "globals": {
+    "DeveloperToolbar": true
+  }
 };

--- a/devtools/client/shared/test/browser_css_angle.js
+++ b/devtools/client/shared/test/browser_css_angle.js
@@ -36,18 +36,20 @@ function testAngleUtils() {
   }
 }
 
 function testAngleValidity() {
   let data = getAngleValidityData();
 
   for (let {angle, result} of data) {
     let testAngle = new angleUtils.CssAngle(angle);
+    let validString = testAngle.valid ? " a valid" : "an invalid";
 
-    is(testAngle.valid, result, `Testing that "${angle}" is ${testAngle.valid ? " a valid" : "an invalid" } angle`);
+    is(testAngle.valid, result,
+       `Testing that "${angle}" is ${validString} angle`);
   }
 }
 
 function testToString(angle, deg, rad, grad, turn) {
   angle.angleUnit = angleUtils.CssAngle.ANGLEUNIT.deg;
   is(angle.toString(), deg, "toString() with deg type");
 
   angle.angleUnit = angleUtils.CssAngle.ANGLEUNIT.rad;

--- a/devtools/client/shared/test/browser_css_color.js
+++ b/devtools/client/shared/test/browser_css_color.js
@@ -1,21 +1,21 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 const TEST_URI = "data:text/html;charset=utf-8,browser_css_color.js";
 var {colorUtils} = require("devtools/shared/css/color");
 /* global getFixtureColorData */
 loadHelperScript("helper_color_data.js");
 
-var origColorUnit;
-
 add_task(function* () {
   yield addTab("about:blank");
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [host,, doc] = yield createHost("bottom", TEST_URI);
 
   info("Creating a test canvas element to test colors");
   let canvas = createTestCanvas(doc);
   info("Starting the test");
   testColorUtils(canvas);
 
   host.destroy();
   gBrowser.removeCurrentTab();
@@ -64,41 +64,42 @@ function testToString(color, name, hex, 
 
 function testColorMatch(name, hex, hsl, rgb, rgba, canvas) {
   let target;
   let ctx = canvas.getContext("2d");
 
   let clearCanvas = function () {
     canvas.width = 1;
   };
-  let setColor = function (aColor) {
-    ctx.fillStyle = aColor;
+  let setColor = function (color) {
+    ctx.fillStyle = color;
     ctx.fillRect(0, 0, 1, 1);
   };
   let setTargetColor = function () {
     clearCanvas();
     // All colors have rgba so we can use this to compare against.
     setColor(rgba);
     let [r, g, b, a] = ctx.getImageData(0, 0, 1, 1).data;
     target = {r: r, g: g, b: b, a: a};
   };
-  let test = function (aColor, type) {
-    let tolerance = 3; // hsla -> rgba -> hsla produces inaccurate results so we
-                       // need some tolerence here.
+  let test = function (color, type) {
+    // hsla -> rgba -> hsla produces inaccurate results so we
+    // need some tolerence here.
+    let tolerance = 3;
     clearCanvas();
 
-    setColor(aColor);
+    setColor(color);
     let [r, g, b, a] = ctx.getImageData(0, 0, 1, 1).data;
 
     let rgbFail = Math.abs(r - target.r) > tolerance ||
                   Math.abs(g - target.g) > tolerance ||
                   Math.abs(b - target.b) > tolerance;
     ok(!rgbFail, "color " + rgba + " matches target. Type: " + type);
     if (rgbFail) {
-      info("target: " + (target.toSource()) + ", color: [r: " + r + ", g: " + g + ", b: " + b + ", a: " + a + "]");
+      info(`target: ${target.toSource()}, color: [r: ${r}, g: ${g}, b: ${b}, a: ${a}]`);
     }
 
     let alphaFail = a !== target.a;
     ok(!alphaFail, "color " + rgba + " alpha value matches target.");
   };
 
   setTargetColor();
 
@@ -115,20 +116,22 @@ function testSetAlpha() {
     ["rgba", "rgba(120, 34, 23, 1)", 0.25, "rgba(120, 34, 23, 0.25)"],
     ["rgb", "rgb(120, 34, 23)", 0.25, "rgba(120, 34, 23, 0.25)"],
     ["hsl", "hsl(208, 100%, 97%)", 0.75, "rgba(240, 248, 255, 0.75)"],
     ["hsla", "hsla(208, 100%, 97%, 1)", 0.75, "rgba(240, 248, 255, 0.75)"],
     ["alphahex", "#f08f", 0.6, "rgba(255, 0, 136, 0.6)"],
     ["longalphahex", "#00ff80ff", 0.2, "rgba(0, 255, 128, 0.2)"]
   ];
   values.forEach(([type, value, alpha, expected]) => {
-    is(colorUtils.setAlpha(value, alpha), expected, "correctly sets alpha value for " + type);
+    is(colorUtils.setAlpha(value, alpha), expected,
+       "correctly sets alpha value for " + type);
   });
 
   try {
     colorUtils.setAlpha("rgb(24, 25%, 45, 1)", 1);
     ok(false, "Should fail when passing in an invalid color.");
   } catch (e) {
     ok(true, "Fails when setAlpha receives an invalid color.");
   }
 
-  is(colorUtils.setAlpha("#fff"), "rgba(255, 255, 255, 1)", "sets alpha to 1 if invalid.");
+  is(colorUtils.setAlpha("#fff"), "rgba(255, 255, 255, 1)",
+     "sets alpha to 1 if invalid.");
 }

--- a/devtools/client/shared/test/browser_cubic-bezier-01.js
+++ b/devtools/client/shared/test/browser_cubic-bezier-01.js
@@ -7,17 +7,17 @@
 // Tests that the CubicBezierWidget generates content in a given parent node
 
 const {CubicBezierWidget} =
   require("devtools/client/shared/widgets/CubicBezierWidget");
 
 const TEST_URI = `data:text/html,<div id="cubic-bezier-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [host,, doc] = yield createHost("bottom", TEST_URI);
 
   info("Checking that the graph markup is created in the parent");
   let container = doc.querySelector("#cubic-bezier-container");
   let w = new CubicBezierWidget(container);
 
   ok(container.querySelector(".display-wrap"),
     "The display has been added");
 

--- a/devtools/client/shared/test/browser_cubic-bezier-02.js
+++ b/devtools/client/shared/test/browser_cubic-bezier-02.js
@@ -106,87 +106,87 @@ function* curveCanBeClicked(widget, win,
 
 function* pointsCanBeMovedWithKeyboard(widget, win, doc, offsets) {
   info("Checking that points respond to keyboard events");
 
   let singleStep = 3;
   let shiftStep = 30;
 
   info("Moving P1 to the left");
-  let newOffset = parseInt(widget.p1.style.left) - singleStep;
-  let x = widget.bezierCanvas.
-          offsetsToCoordinates({style: {left: newOffset}})[0];
+  let newOffset = parseInt(widget.p1.style.left, 10) - singleStep;
+  let x = widget.bezierCanvas
+          .offsetsToCoordinates({style: {left: newOffset}})[0];
 
   let onUpdated = widget.once("updated");
   widget._onPointKeyDown(getKeyEvent(widget.p1, 37));
   let bezier = yield onUpdated;
 
   is(bezier.P1[0], x, "The new P1 time coordinate is correct");
   is(bezier.P1[1], 0.75, "The new P1 progress coordinate is correct");
 
   info("Moving P1 to the left, fast");
-  newOffset = parseInt(widget.p1.style.left) - shiftStep;
-  x = widget.bezierCanvas.
-      offsetsToCoordinates({style: {left: newOffset}})[0];
+  newOffset = parseInt(widget.p1.style.left, 10) - shiftStep;
+  x = widget.bezierCanvas
+      .offsetsToCoordinates({style: {left: newOffset}})[0];
 
   onUpdated = widget.once("updated");
   widget._onPointKeyDown(getKeyEvent(widget.p1, 37, true));
   bezier = yield onUpdated;
   is(bezier.P1[0], x, "The new P1 time coordinate is correct");
   is(bezier.P1[1], 0.75, "The new P1 progress coordinate is correct");
 
   info("Moving P1 to the right, fast");
-  newOffset = parseInt(widget.p1.style.left) + shiftStep;
-  x = widget.bezierCanvas.
-    offsetsToCoordinates({style: {left: newOffset}})[0];
+  newOffset = parseInt(widget.p1.style.left, 10) + shiftStep;
+  x = widget.bezierCanvas
+    .offsetsToCoordinates({style: {left: newOffset}})[0];
 
   onUpdated = widget.once("updated");
   widget._onPointKeyDown(getKeyEvent(widget.p1, 39, true));
   bezier = yield onUpdated;
   is(bezier.P1[0], x, "The new P1 time coordinate is correct");
   is(bezier.P1[1], 0.75, "The new P1 progress coordinate is correct");
 
   info("Moving P1 to the bottom");
-  newOffset = parseInt(widget.p1.style.top) + singleStep;
-  let y = widget.bezierCanvas.
-    offsetsToCoordinates({style: {top: newOffset}})[1];
+  newOffset = parseInt(widget.p1.style.top, 10) + singleStep;
+  let y = widget.bezierCanvas
+    .offsetsToCoordinates({style: {top: newOffset}})[1];
 
   onUpdated = widget.once("updated");
   widget._onPointKeyDown(getKeyEvent(widget.p1, 40));
   bezier = yield onUpdated;
   is(bezier.P1[0], x, "The new P1 time coordinate is correct");
   is(bezier.P1[1], y, "The new P1 progress coordinate is correct");
 
   info("Moving P1 to the bottom, fast");
-  newOffset = parseInt(widget.p1.style.top) + shiftStep;
-  y = widget.bezierCanvas.
-    offsetsToCoordinates({style: {top: newOffset}})[1];
+  newOffset = parseInt(widget.p1.style.top, 10) + shiftStep;
+  y = widget.bezierCanvas
+    .offsetsToCoordinates({style: {top: newOffset}})[1];
 
   onUpdated = widget.once("updated");
   widget._onPointKeyDown(getKeyEvent(widget.p1, 40, true));
   bezier = yield onUpdated;
   is(bezier.P1[0], x, "The new P1 time coordinate is correct");
   is(bezier.P1[1], y, "The new P1 progress coordinate is correct");
 
   info("Moving P1 to the top, fast");
-  newOffset = parseInt(widget.p1.style.top) - shiftStep;
-  y = widget.bezierCanvas.
-    offsetsToCoordinates({style: {top: newOffset}})[1];
+  newOffset = parseInt(widget.p1.style.top, 10) - shiftStep;
+  y = widget.bezierCanvas
+    .offsetsToCoordinates({style: {top: newOffset}})[1];
 
   onUpdated = widget.once("updated");
   widget._onPointKeyDown(getKeyEvent(widget.p1, 38, true));
   bezier = yield onUpdated;
   is(bezier.P1[0], x, "The new P1 time coordinate is correct");
   is(bezier.P1[1], y, "The new P1 progress coordinate is correct");
 
   info("Checking that keyboard events also work with P2");
   info("Moving P2 to the left");
-  newOffset = parseInt(widget.p2.style.left) - singleStep;
-  x = widget.bezierCanvas.
-    offsetsToCoordinates({style: {left: newOffset}})[0];
+  newOffset = parseInt(widget.p2.style.left, 10) - singleStep;
+  x = widget.bezierCanvas
+    .offsetsToCoordinates({style: {left: newOffset}})[0];
 
   onUpdated = widget.once("updated");
   widget._onPointKeyDown(getKeyEvent(widget.p2, 37));
   bezier = yield onUpdated;
   is(bezier.P2[0], x, "The new P2 time coordinate is correct");
   is(bezier.P2[1], 0.25, "The new P2 progress coordinate is correct");
 }
 

--- a/devtools/client/shared/test/browser_cubic-bezier-03.js
+++ b/devtools/client/shared/test/browser_cubic-bezier-03.js
@@ -8,17 +8,17 @@
 
 const {CubicBezierWidget} =
   require("devtools/client/shared/widgets/CubicBezierWidget");
 const {PREDEFINED} = require("devtools/client/shared/widgets/CubicBezierPresets");
 
 const TEST_URI = `data:text/html,<div id="cubic-bezier-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [host,, doc] = yield createHost("bottom", TEST_URI);
 
   let container = doc.querySelector("#cubic-bezier-container");
   let w = new CubicBezierWidget(container, PREDEFINED.linear);
 
   yield coordinatesCanBeChangedByProvidingAnArray(w);
   yield coordinatesCanBeChangedByProvidingAValue(w);
 
   w.destroy();

--- a/devtools/client/shared/test/browser_cubic-bezier-04.js
+++ b/devtools/client/shared/test/browser_cubic-bezier-04.js
@@ -8,17 +8,17 @@
 
 const {CubicBezierPresetWidget} =
   require("devtools/client/shared/widgets/CubicBezierWidget");
 const {PRESETS} = require("devtools/client/shared/widgets/CubicBezierPresets");
 
 const TEST_URI = `data:text/html,<div id="cubic-bezier-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [host,, doc] = yield createHost("bottom", TEST_URI);
 
   let container = doc.querySelector("#cubic-bezier-container");
   let w = new CubicBezierPresetWidget(container);
 
   info("Checking that the presets are created in the parent");
   ok(container.querySelector(".preset-pane"),
      "The preset pane has been added");
 

--- a/devtools/client/shared/test/browser_cubic-bezier-05.js
+++ b/devtools/client/shared/test/browser_cubic-bezier-05.js
@@ -9,29 +9,29 @@
 const {CubicBezierPresetWidget} =
   require("devtools/client/shared/widgets/CubicBezierWidget");
 const {PREDEFINED, PRESETS, DEFAULT_PRESET_CATEGORY} =
   require("devtools/client/shared/widgets/CubicBezierPresets");
 
 const TEST_URI = `data:text/html,<div id="cubic-bezier-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [host,, doc] = yield createHost("bottom", TEST_URI);
 
   let container = doc.querySelector("#cubic-bezier-container");
   let w = new CubicBezierPresetWidget(container);
 
   info("Checking that preset is selected if coordinates are known");
 
   w.refreshMenu([0, 0, 0, 0]);
   is(w.activeCategory, container.querySelector(`#${DEFAULT_PRESET_CATEGORY}`),
     "The default category is selected");
   is(w._activePreset, null, "There is no selected category");
 
-  w.refreshMenu(PREDEFINED["linear"]);
+  w.refreshMenu(PREDEFINED.linear);
   is(w.activeCategory, container.querySelector("#ease-in-out"),
      "The ease-in-out category is active");
   is(w._activePreset, container.querySelector("#ease-in-out-linear"),
      "The ease-in-out-linear preset is active");
 
   w.refreshMenu(PRESETS["ease-out"]["ease-out-sine"]);
   is(w.activeCategory, container.querySelector("#ease-out"),
      "The ease-out category is active");

--- a/devtools/client/shared/test/browser_devices.js
+++ b/devtools/client/shared/test/browser_devices.js
@@ -1,11 +1,13 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 const {
   getDevices,
   getDeviceString,
   addDevice
 } = require("devtools/client/shared/devices");
 
 add_task(function* () {
   Services.prefs.setCharPref("devtools.devices.url",

--- a/devtools/client/shared/test/browser_filter-editor-01.js
+++ b/devtools/client/shared/test/browser_filter-editor-01.js
@@ -21,17 +21,17 @@ function verifyURL(string) {
   if (!token || token.tokenType !== "url") {
     return false;
   }
 
   return lexer.nextToken() === null;
 }
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
   let widget = new CSSFilterEditorWidget(container, "none", cssIsValid);
 
   info("Test parsing of a valid CSS Filter value");
   widget.setCssValue("blur(2px) contrast(200%)");
   is(widget.getCssValue(),

--- a/devtools/client/shared/test/browser_filter-editor-02.js
+++ b/devtools/client/shared/test/browser_filter-editor-02.js
@@ -10,17 +10,17 @@ const {getClientCssProperties} = require
 
 const { LocalizationHelper } = require("devtools/shared/l10n");
 const STRINGS_URI = "devtools/client/locales/filterwidget.properties";
 const L10N = new LocalizationHelper(STRINGS_URI);
 
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const TEST_DATA = [
     {
       cssValue: "blur(2px) contrast(200%) hue-rotate(20.2deg) drop-shadow(5px 5px black)",
       expected: [
         {
           label: "blur",
@@ -70,34 +70,32 @@ add_task(function* () {
     }
   ];
 
   const container = doc.querySelector("#filter-container");
   let widget = new CSSFilterEditorWidget(container, "none", cssIsValid);
 
   info("Test rendering of different types");
 
-
   for (let {cssValue, expected} of TEST_DATA) {
     widget.setCssValue(cssValue);
 
     if (cssValue === "none") {
       const text = container.querySelector("#filters").textContent;
       ok(text.indexOf(L10N.getStr("emptyFilterList")) > -1,
          "Contains |emptyFilterList| string when given value 'none'");
       ok(text.indexOf(L10N.getStr("addUsingList")) > -1,
          "Contains |addUsingList| string when given value 'none'");
       continue;
     }
     const filters = container.querySelectorAll(".filter");
     testRenderedFilters(filters, expected);
   }
 });
 
-
 function testRenderedFilters(filters, expected) {
   for (let [index, filter] of [...filters].entries()) {
     let [name, value] = filter.children,
       label = name.children[1],
       [input, unit] = value.children;
 
     const eq = expected[index];
     is(label.textContent, eq.label, "Label should match");

--- a/devtools/client/shared/test/browser_filter-editor-03.js
+++ b/devtools/client/shared/test/browser_filter-editor-03.js
@@ -8,17 +8,17 @@
 const {CSSFilterEditorWidget} = require("devtools/client/shared/widgets/FilterWidget");
 const {getClientCssProperties} = require("devtools/shared/fronts/css-properties");
 const GRAYSCALE_MAX = 100;
 const INVERT_MIN = 0;
 
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
   let widget = new CSSFilterEditorWidget(container, "none", cssIsValid);
 
   info("Test add method");
   const blur = widget.add("blur", "10.2px");
   is(widget.getCssValue(), "blur(10.2px)",

--- a/devtools/client/shared/test/browser_filter-editor-04.js
+++ b/devtools/client/shared/test/browser_filter-editor-04.js
@@ -7,17 +7,17 @@
 
 const {CSSFilterEditorWidget} = require("devtools/client/shared/widgets/FilterWidget");
 const {getClientCssProperties} = require("devtools/shared/fronts/css-properties");
 const LIST_ITEM_HEIGHT = 32;
 
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
   const initialValue = "blur(2px) contrast(200%) brightness(200%)";
   let widget = new CSSFilterEditorWidget(container, initialValue, cssIsValid);
 
   const filters = widget.el.querySelector("#filters");
   function first() {
@@ -25,17 +25,16 @@ add_task(function* () {
   }
   function mid() {
     return filters.children[1];
   }
   function last() {
     return filters.children[2];
   }
 
-
   info("Test re-ordering neighbour filters");
   widget._mouseDown({
     target: first().querySelector("i"),
     pageY: 0
   });
   widget._mouseMove({ pageY: LIST_ITEM_HEIGHT });
 
   // Element re-ordering should be instant

--- a/devtools/client/shared/test/browser_filter-editor-05.js
+++ b/devtools/client/shared/test/browser_filter-editor-05.js
@@ -15,21 +15,23 @@ const SLOW_VALUE_MULTIPLIER = 0.1;
 const DEFAULT_VALUE_MULTIPLIER = 1;
 
 const GRAYSCALE_MAX = 100,
   GRAYSCALE_MIN = 0;
 
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
-  let widget = new CSSFilterEditorWidget(container, "grayscale(0%) url(test.svg)", cssIsValid);
+  let widget = new CSSFilterEditorWidget(
+    container, "grayscale(0%) url(test.svg)", cssIsValid
+  );
 
   const filters = widget.el.querySelector("#filters");
   const grayscale = filters.children[0];
   const url = filters.children[1];
 
   info("Test label-dragging on number-type filters without modifiers");
   widget._mouseDown({
     target: grayscale.querySelector("label"),
@@ -45,29 +47,31 @@ add_task(function* () {
   });
   let expected = DEFAULT_VALUE_MULTIPLIER * 12;
   is(widget.getValueAt(0),
      `${expected}%`,
      "Should update value correctly without modifiers");
 
   info("Test label-dragging on number-type filters with alt");
   widget._mouseMove({
-    pageX: 20, // 20 - 12 = 8
+    // 20 - 12 = 8
+    pageX: 20,
     altKey: true,
     shiftKey: false
   });
 
   expected = expected + SLOW_VALUE_MULTIPLIER * 8;
   is(widget.getValueAt(0),
      `${expected}%`,
      "Should update value correctly with alt key");
 
   info("Test label-dragging on number-type filters with shift");
   widget._mouseMove({
-    pageX: 25, // 25 - 20 = 5
+    // 25 - 20 = 5
+    pageX: 25,
     altKey: false,
     shiftKey: true
   });
 
   expected = expected + FAST_VALUE_MULTIPLIER * 5;
   is(widget.getValueAt(0),
      `${expected}%`,
      "Should update value correctly with shift key");
@@ -92,17 +96,18 @@ add_task(function* () {
   expected = expected + DEFAULT_VALUE_MULTIPLIER * 5;
   is(widget.getValueAt(0),
      `${expected}%`,
      "Should reset multiplier to default");
 
   info("Test value ranges");
 
   widget._mouseMove({
-    pageX: 30, // 30 - 25 = 5
+    // 30 - 25 = 5
+    pageX: 30,
     altKey: false,
     shiftKey: true
   });
 
   expected = GRAYSCALE_MAX;
   is(widget.getValueAt(0),
      `${expected}%`,
      "Shouldn't allow values higher than max");

--- a/devtools/client/shared/test/browser_filter-editor-06.js
+++ b/devtools/client/shared/test/browser_filter-editor-06.js
@@ -10,17 +10,17 @@ const {getClientCssProperties} = require
 
 const { LocalizationHelper } = require("devtools/shared/l10n");
 const STRINGS_URI = "devtools/client/locales/filterwidget.properties";
 const L10N = new LocalizationHelper(STRINGS_URI);
 
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
   let widget = new CSSFilterEditorWidget(container, "none", cssIsValid);
 
   const select = widget.el.querySelector("select"),
     add = widget.el.querySelector("#add-filter");
 

--- a/devtools/client/shared/test/browser_filter-editor-07.js
+++ b/devtools/client/shared/test/browser_filter-editor-07.js
@@ -3,27 +3,25 @@
 
 "use strict";
 
 // Tests the Filter Editor Widget's remove button
 
 const {CSSFilterEditorWidget} = require("devtools/client/shared/widgets/FilterWidget");
 const {getClientCssProperties} = require("devtools/shared/fronts/css-properties");
 
-const { LocalizationHelper } = require("devtools/shared/l10n");
-const STRINGS_URI = "devtools/client/locales/filterwidget.properties";
-const L10N = new LocalizationHelper(STRINGS_URI);
-
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
-  let widget = new CSSFilterEditorWidget(container, "blur(2px) contrast(200%)", cssIsValid);
+  let widget = new CSSFilterEditorWidget(
+    container, "blur(2px) contrast(200%)", cssIsValid
+  );
 
   info("Test removing filters with remove button");
   widget.el.querySelector(".filter button").click();
 
   is(widget.getCssValue(), "contrast(200%)",
      "Should remove the clicked filter");
 });

--- a/devtools/client/shared/test/browser_filter-editor-08.js
+++ b/devtools/client/shared/test/browser_filter-editor-08.js
@@ -11,17 +11,17 @@ const {getClientCssProperties} = require
 
 const FAST_VALUE_MULTIPLIER = 10;
 const SLOW_VALUE_MULTIPLIER = 0.1;
 const DEFAULT_VALUE_MULTIPLIER = 1;
 
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
   const initialValue = "blur(2px)";
   let widget = new CSSFilterEditorWidget(container, initialValue, cssIsValid);
 
   let value = 2;
 

--- a/devtools/client/shared/test/browser_filter-editor-09.js
+++ b/devtools/client/shared/test/browser_filter-editor-09.js
@@ -11,17 +11,17 @@ const {getClientCssProperties} = require
 
 const FAST_VALUE_MULTIPLIER = 10;
 const SLOW_VALUE_MULTIPLIER = 0.1;
 const DEFAULT_VALUE_MULTIPLIER = 1;
 
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
   const initialValue = "drop-shadow(rgb(0, 0, 0) 1px 1px 0px)";
   let widget = new CSSFilterEditorWidget(container, initialValue, cssIsValid);
   widget.el.querySelector("#filters input").setSelectionRange(13, 13);
 
   let value = 1;

--- a/devtools/client/shared/test/browser_filter-editor-10.js
+++ b/devtools/client/shared/test/browser_filter-editor-10.js
@@ -4,24 +4,22 @@
 "use strict";
 
 // Tests the Filter Editor Widget inputs increase/decrease value when cursor is
 // on a number using arrow keys if cursor is behind/mid/after the number strings
 
 const {CSSFilterEditorWidget} = require("devtools/client/shared/widgets/FilterWidget");
 const {getClientCssProperties} = require("devtools/shared/fronts/css-properties");
 
-const FAST_VALUE_MULTIPLIER = 10;
-const SLOW_VALUE_MULTIPLIER = 0.1;
 const DEFAULT_VALUE_MULTIPLIER = 1;
 
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
   const initialValue = "drop-shadow(rgb(0, 0, 0) 10px 1px 0px)";
   let widget = new CSSFilterEditorWidget(container, initialValue, cssIsValid);
   const input = widget.el.querySelector("#filters input");
 
   let value = 10;

--- a/devtools/client/shared/test/browser_filter-presets-01.js
+++ b/devtools/client/shared/test/browser_filter-presets-01.js
@@ -6,17 +6,17 @@
 // Tests saving presets
 
 const {CSSFilterEditorWidget} = require("devtools/client/shared/widgets/FilterWidget");
 const {getClientCssProperties} = require("devtools/shared/fronts/css-properties");
 
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
   let widget = new CSSFilterEditorWidget(container, "none", cssIsValid);
   // First render
   yield widget.once("render");
 
   const VALUE = "blur(2px) contrast(150%)";

--- a/devtools/client/shared/test/browser_filter-presets-02.js
+++ b/devtools/client/shared/test/browser_filter-presets-02.js
@@ -6,17 +6,17 @@
 // Tests loading presets
 
 const {CSSFilterEditorWidget} = require("devtools/client/shared/widgets/FilterWidget");
 const {getClientCssProperties} = require("devtools/shared/fronts/css-properties");
 
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
   let widget = new CSSFilterEditorWidget(container, "none", cssIsValid);
   // First render
   yield widget.once("render");
 
   const VALUE = "blur(2px) contrast(150%)";

--- a/devtools/client/shared/test/browser_filter-presets-03.js
+++ b/devtools/client/shared/test/browser_filter-presets-03.js
@@ -6,17 +6,17 @@
 // Tests deleting presets
 
 const {CSSFilterEditorWidget} = require("devtools/client/shared/widgets/FilterWidget");
 const {getClientCssProperties} = require("devtools/shared/fronts/css-properties");
 
 const TEST_URI = `data:text/html,<div id="filter-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [,, doc] = yield createHost("bottom", TEST_URI);
   const cssIsValid = getClientCssProperties().getValidityChecker(doc);
 
   const container = doc.querySelector("#filter-container");
   let widget = new CSSFilterEditorWidget(container, "none", cssIsValid);
   // First render
   yield widget.once("render");
 
   const NAME = "Test";

--- a/devtools/client/shared/test/browser_flame-graph-01.js
+++ b/devtools/client/shared/test/browser_flame-graph-01.js
@@ -1,29 +1,34 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that flame graph widget works properly.
 
-var {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
+const {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost();
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new FlameGraph(doc.body);
 
   let readyEventEmitted;
-  graph.once("ready", () => readyEventEmitted = true);
+  graph.once("ready", () => {
+    readyEventEmitted = true;
+  });
 
   yield graph.ready();
   ok(readyEventEmitted, "The 'ready' event should have been emitted");
 
   testGraph(host, graph);
 
   yield graph.destroy();
   host.destroy();

--- a/devtools/client/shared/test/browser_flame-graph-02.js
+++ b/devtools/client/shared/test/browser_flame-graph-02.js
@@ -1,24 +1,27 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that flame graph widgets may have a fixed width or height.
 
-var {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
+const {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost();
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new FlameGraph(doc.body);
   graph.fixedWidth = 200;
   graph.fixedHeight = 100;
 
   yield graph.ready();
   testGraph(host, graph);
 

--- a/devtools/client/shared/test/browser_flame-graph-03a.js
+++ b/devtools/client/shared/test/browser_flame-graph-03a.js
@@ -1,29 +1,46 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that selections in the flame graph widget work properly.
 
-var TEST_DATA = [{ color: "#f00", blocks: [{ x: 0, y: 0, width: 50, height: 20, text: "FOO" }, { x: 50, y: 0, width: 100, height: 20, text: "BAR" }] }, { color: "#00f", blocks: [{ x: 0, y: 30, width: 30, height: 20, text: "BAZ" }] }];
-var TEST_BOUNDS = { startTime: 0, endTime: 150 };
-var TEST_WIDTH = 200;
-var TEST_HEIGHT = 100;
+const TEST_DATA = [
+  {
+    color: "#f00",
+    blocks: [
+      { x: 0, y: 0, width: 50, height: 20, text: "FOO" },
+      { x: 50, y: 0, width: 100, height: 20, text: "BAR" }
+    ]
+  },
+  {
+    color: "#00f",
+    blocks: [
+      { x: 0, y: 30, width: 30, height: 20, text: "BAZ" }
+    ]
+  }
+];
+const TEST_BOUNDS = { startTime: 0, endTime: 150 };
+const TEST_WIDTH = 200;
+const TEST_HEIGHT = 100;
 
-var {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
+const {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost();
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new FlameGraph(doc.body, 1);
   graph.fixedWidth = TEST_WIDTH;
   graph.fixedHeight = TEST_HEIGHT;
   graph.horizontalPanThreshold = 0;
   graph.verticalPanThreshold = 0;
 
   yield graph.ready();
@@ -109,13 +126,13 @@ function dragStop(graph, x, y = 1) {
 
 var HORIZONTAL_AXIS = 1;
 var VERTICAL_AXIS = 2;
 
 function scroll(graph, wheel, axis, x, y = 1) {
   x /= window.devicePixelRatio;
   y /= window.devicePixelRatio;
   graph._onMouseMove({ testX: x, testY: y });
-  graph._onMouseWheel({ testX: x, testY: y, axis, detail: wheel, axis,
+  graph._onMouseWheel({ testX: x, testY: y, axis, detail: wheel,
     HORIZONTAL_AXIS,
     VERTICAL_AXIS
   });
 }

--- a/devtools/client/shared/test/browser_flame-graph-03b.js
+++ b/devtools/client/shared/test/browser_flame-graph-03b.js
@@ -1,30 +1,47 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that selections in the flame graph widget work properly on HiDPI.
 
-var TEST_DATA = [{ color: "#f00", blocks: [{ x: 0, y: 0, width: 50, height: 20, text: "FOO" }, { x: 50, y: 0, width: 100, height: 20, text: "BAR" }] }, { color: "#00f", blocks: [{ x: 0, y: 30, width: 30, height: 20, text: "BAZ" }] }];
-var TEST_BOUNDS = { startTime: 0, endTime: 150 };
-var TEST_WIDTH = 200;
-var TEST_HEIGHT = 100;
-var TEST_DPI_DENSITIY = 2;
+const TEST_DATA = [
+  {
+    color: "#f00",
+    blocks: [
+      { x: 0, y: 0, width: 50, height: 20, text: "FOO" },
+      { x: 50, y: 0, width: 100, height: 20, text: "BAR" }
+    ]
+  },
+  {
+    color: "#00f",
+    blocks: [
+      { x: 0, y: 30, width: 30, height: 20, text: "BAZ" }
+    ]
+  }
+];
+const TEST_BOUNDS = { startTime: 0, endTime: 150 };
+const TEST_WIDTH = 200;
+const TEST_HEIGHT = 100;
+const TEST_DPI_DENSITIY = 2;
 
 var {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost();
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new FlameGraph(doc.body, TEST_DPI_DENSITIY);
   graph.fixedWidth = TEST_WIDTH;
   graph.fixedHeight = TEST_HEIGHT;
 
   yield graph.ready();
 
   testGraph(graph);
@@ -63,13 +80,13 @@ function testGraph(graph) {
 
 var HORIZONTAL_AXIS = 1;
 var VERTICAL_AXIS = 2;
 
 function scroll(graph, wheel, axis, x, y = 1) {
   x /= window.devicePixelRatio;
   y /= window.devicePixelRatio;
   graph._onMouseMove({ testX: x, testY: y });
-  graph._onMouseWheel({ testX: x, testY: y, axis, detail: wheel, axis,
+  graph._onMouseWheel({ testX: x, testY: y, axis, detail: wheel,
     HORIZONTAL_AXIS,
     VERTICAL_AXIS
   });
 }

--- a/devtools/client/shared/test/browser_flame-graph-03c.js
+++ b/devtools/client/shared/test/browser_flame-graph-03c.js
@@ -1,30 +1,47 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that vertical panning in the flame graph widget works properly.
 
-var TEST_DATA = [{ color: "#f00", blocks: [{ x: 0, y: 0, width: 50, height: 20, text: "FOO" }, { x: 50, y: 0, width: 100, height: 20, text: "BAR" }] }, { color: "#00f", blocks: [{ x: 0, y: 30, width: 30, height: 20, text: "BAZ" }] }];
-var TEST_BOUNDS = { startTime: 0, endTime: 150 };
-var TEST_WIDTH = 200;
-var TEST_HEIGHT = 100;
-var TEST_DPI_DENSITIY = 2;
+const TEST_DATA = [
+  {
+    color: "#f00",
+    blocks: [
+      { x: 0, y: 0, width: 50, height: 20, text: "FOO" },
+      { x: 50, y: 0, width: 100, height: 20, text: "BAR" }
+    ]
+  },
+  {
+    color: "#00f",
+    blocks: [
+      { x: 0, y: 30, width: 30, height: 20, text: "BAZ" }
+    ]
+  }
+];
+const TEST_BOUNDS = { startTime: 0, endTime: 150 };
+const TEST_WIDTH = 200;
+const TEST_HEIGHT = 100;
+const TEST_DPI_DENSITIY = 2;
 
-var {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
+const {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost();
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new FlameGraph(doc.body, TEST_DPI_DENSITIY);
   graph.fixedWidth = TEST_WIDTH;
   graph.fixedHeight = TEST_HEIGHT;
 
   yield graph.ready();
 
   testGraph(graph);

--- a/devtools/client/shared/test/browser_flame-graph-04.js
+++ b/devtools/client/shared/test/browser_flame-graph-04.js
@@ -1,27 +1,29 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that text metrics in the flame graph widget work properly.
 
-var HTML_NS = "http://www.w3.org/1999/xhtml";
-var {ELLIPSIS} = require("devtools/shared/l10n");
-var {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
-var {FLAME_GRAPH_BLOCK_TEXT_FONT_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
-var {FLAME_GRAPH_BLOCK_TEXT_FONT_FAMILY} = require("devtools/client/shared/widgets/FlameGraph");
+const HTML_NS = "http://www.w3.org/1999/xhtml";
+const {ELLIPSIS} = require("devtools/shared/l10n");
+const {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
+const {FLAME_GRAPH_BLOCK_TEXT_FONT_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
+const {FLAME_GRAPH_BLOCK_TEXT_FONT_FAMILY} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new FlameGraph(doc.body, 1);
   yield graph.ready();
 
   testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }
@@ -59,18 +61,19 @@ function testGraph(graph) {
     "The fitted text for text font size width is correct.");
 
   is(graph._getFittedText(text, 1), "",
     "The fitted text for 1px width is correct.");
 }
 
 function getAverageCharWidth() {
   let letterWidthsSum = 0;
-  let start = 32; // space
-  let end = 123; // "z"
+
+  let start = " ".charCodeAt(0);
+  let end = "z".charCodeAt(0) + 1;
 
   for (let i = start; i < end; i++) {
     let char = String.fromCharCode(i);
     letterWidthsSum += getCharWidth(char);
   }
 
   return letterWidthsSum / (end - start);
 }

--- a/devtools/client/shared/test/browser_flame-graph-05.js
+++ b/devtools/client/shared/test/browser_flame-graph-05.js
@@ -1,33 +1,49 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that flame graph widget has proper keyboard support.
 
-var TEST_DATA = [{ color: "#f00", blocks: [{ x: 0, y: 0, width: 50, height: 20, text: "FOO" }, { x: 50, y: 0, width: 100, height: 20, text: "BAR" }] }, { color: "#00f", blocks: [{ x: 0, y: 30, width: 30, height: 20, text: "BAZ" }] }];
-var TEST_BOUNDS = { startTime: 0, endTime: 150 };
-var TEST_DPI_DENSITIY = 2;
+const TEST_DATA = [
+  {
+    color: "#f00",
+    blocks: [
+      { x: 0, y: 0, width: 50, height: 20, text: "FOO" },
+      { x: 50, y: 0, width: 100, height: 20, text: "BAR" }
+    ]
+  },
+  {
+    color: "#00f",
+    blocks: [
+      { x: 0, y: 30, width: 30, height: 20, text: "BAZ" }
+    ]
+  }
+];
+const TEST_BOUNDS = { startTime: 0, endTime: 150 };
+const TEST_DPI_DENSITIY = 2;
 
 const KEY_CODE_UP = 38;
-const KEY_CODE_DOWN = 40;
 const KEY_CODE_LEFT = 37;
 const KEY_CODE_RIGHT = 39;
 
 var {FlameGraph} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost();
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new FlameGraph(doc.body, TEST_DPI_DENSITIY);
   yield graph.ready();
 
   yield testGraph(host, graph);
 
   yield graph.destroy();
   host.destroy();
@@ -73,27 +89,25 @@ function* testGraph(host, graph) {
   let distanceLeft = graph._selection.start;
   let distanceRight = TEST_BOUNDS.endTime * TEST_DPI_DENSITIY - graph._selection.end;
 
   ok(Math.abs(distanceRight - distanceLeft) < 0.1,
     "The graph zoomed correctly towards the center point.");
 }
 
 function pressKeyForTime(graph, keyCode, ms) {
-  let deferred = defer();
-
   graph._onKeyDown({
     keyCode,
-    preventDefault: () => { },
-    stopPropagation: () => { },
+    preventDefault: () => {},
+    stopPropagation: () => {},
   });
 
-  setTimeout(() => {
-    graph._onKeyUp({
-      keyCode,
-      preventDefault: () => { },
-      stopPropagation: () => { },
-    });
-    deferred.resolve();
-  }, ms);
-
-  return deferred.promise;
+  return new Promise(resolve => {
+    setTimeout(() => {
+      graph._onKeyUp({
+        keyCode,
+        preventDefault: () => {},
+        stopPropagation: () => {},
+      });
+      resolve();
+    }, ms);
+  });
 }

--- a/devtools/client/shared/test/browser_flame-graph-utils-01.js
+++ b/devtools/client/shared/test/browser_flame-graph-utils-01.js
@@ -1,16 +1,18 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that text metrics and data conversion from profiler samples
 // widget work properly in the flame graph.
 
-var {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
-var {PALLETTE_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
+const {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
+const {PALLETTE_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {

--- a/devtools/client/shared/test/browser_flame-graph-utils-02.js
+++ b/devtools/client/shared/test/browser_flame-graph-utils-02.js
@@ -1,15 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests consecutive duplicate frames are removed from the flame graph data.
 
-var {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
-var {PALLETTE_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
+const {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
+const {PALLETTE_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {

--- a/devtools/client/shared/test/browser_flame-graph-utils-03.js
+++ b/devtools/client/shared/test/browser_flame-graph-utils-03.js
@@ -1,16 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests if platform frames are removed from the flame graph data.
 
-var {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
-var {PALLETTE_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
-var {FrameNode} = require("devtools/client/performance/modules/logic/tree-model");
+const {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
+const {PALLETTE_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
@@ -55,17 +56,16 @@ var TEST_DATA = synthesizeProfileForTest
   }, {
     location: "chrome://D"
   }, {
     location: "resource://E"
   }],
   time: 50,
 }]);
 
-
 var EXPECTED_OUTPUT = [{
   blocks: []
 }, {
   blocks: []
 }, {
   blocks: [{
     startTime: 0,
     frameKey: "http://A",

--- a/devtools/client/shared/test/browser_flame-graph-utils-04.js
+++ b/devtools/client/shared/test/browser_flame-graph-utils-04.js
@@ -1,16 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests if (idle) nodes are added when necessary in the flame graph data.
 
-var {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
-var {PALLETTE_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
-var {FrameNode} = require("devtools/client/performance/modules/logic/tree-model");
+const {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
+const {PALLETTE_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {

--- a/devtools/client/shared/test/browser_flame-graph-utils-05.js
+++ b/devtools/client/shared/test/browser_flame-graph-utils-05.js
@@ -1,31 +1,37 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that flame graph data is cached, and that the cache may be cleared.
 
-var {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
+const {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
   let out1 = FlameGraphUtils.createFlameGraphDataFromThread(TEST_DATA);
   let out2 = FlameGraphUtils.createFlameGraphDataFromThread(TEST_DATA);
   is(out1, out2, "The outputted data is identical.");
 
-  let out3 = FlameGraphUtils.createFlameGraphDataFromThread(TEST_DATA, { flattenRecursion: true });
+  let out3 = FlameGraphUtils.createFlameGraphDataFromThread(
+    TEST_DATA, { flattenRecursion: true }
+  );
   is(out2, out3, "The outputted data is still identical.");
 
   FlameGraphUtils.removeFromCache(TEST_DATA);
-  let out4 = FlameGraphUtils.createFlameGraphDataFromThread(TEST_DATA, { flattenRecursion: true });
+  let out4 = FlameGraphUtils.createFlameGraphDataFromThread(
+    TEST_DATA, { flattenRecursion: true }
+  );
   isnot(out3, out4, "The outputted data is not identical anymore.");
 }
 
 var TEST_DATA = synthesizeProfileForTest([{
   frames: [{
     location: "A"
   }, {
     location: "A"

--- a/devtools/client/shared/test/browser_flame-graph-utils-06.js
+++ b/devtools/client/shared/test/browser_flame-graph-utils-06.js
@@ -1,18 +1,20 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that the text displayed is the function name, file name and line number
 // if applicable and demangling.
 
-var {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
-var {PALLETTE_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
-var MANGLED_FN = "__Z3FooIiEvv";
-var UNMANGLED_FN = "void Foo<int>()";
+const {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
+const {PALLETTE_SIZE} = require("devtools/client/shared/widgets/FlameGraph");
+const MANGLED_FN = "__Z3FooIiEvv";
+const UNMANGLED_FN = "void Foo<int>()";
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {

--- a/devtools/client/shared/test/browser_flame-graph-utils-hash.js
+++ b/devtools/client/shared/test/browser_flame-graph-utils-hash.js
@@ -1,24 +1,24 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests if (idle) nodes are added when necessary in the flame graph data.
 
-var {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
+const {FlameGraphUtils} = require("devtools/client/shared/widgets/FlameGraph");
 
-var test = Task.async(function* () {
+add_task(function* () {
   let hash1 = FlameGraphUtils._getStringHash("abc");
   let hash2 = FlameGraphUtils._getStringHash("acb");
   let hash3 = FlameGraphUtils._getStringHash(Array.from(Array(100000)).join("a"));
   let hash4 = FlameGraphUtils._getStringHash(Array.from(Array(100000)).join("b"));
 
   isnot(hash1, hash2, "The hashes should not be equal (1).");
   isnot(hash2, hash3, "The hashes should not be equal (2).");
   isnot(hash3, hash4, "The hashes should not be equal (3).");
 
   ok(Number.isInteger(hash1), "The hashes should be integers, not Infinity or NaN (1).");
   ok(Number.isInteger(hash2), "The hashes should be integers, not Infinity or NaN (2).");
   ok(Number.isInteger(hash3), "The hashes should be integers, not Infinity or NaN (3).");
   ok(Number.isInteger(hash4), "The hashes should be integers, not Infinity or NaN (4).");
-
-  finish();
 });

--- a/devtools/client/shared/test/browser_graphs-01.js
+++ b/devtools/client/shared/test/browser_graphs-01.js
@@ -1,30 +1,35 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that graph widgets works properly.
 
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
   finish();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost();
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new LineGraphWidget(doc.body, "fps");
 
   let readyEventEmitted;
-  graph.once("ready", () => readyEventEmitted = true);
+  graph.once("ready", () => {
+    readyEventEmitted = true;
+  });
 
   yield graph.ready();
   ok(readyEventEmitted, "The 'ready' event should have been emitted");
 
   testGraph(host, graph);
 
   yield graph.destroy();
   host.destroy();

--- a/devtools/client/shared/test/browser_graphs-02.js
+++ b/devtools/client/shared/test/browser_graphs-02.js
@@ -1,25 +1,48 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that graph widgets can properly add data, regions and highlights.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
 const TEST_REGIONS = [{ start: 320, end: 460 }, { start: 780, end: 860 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
 
   testDataAndRegions(graph);
   testHighlights(graph);
 
   yield graph.destroy();
   host.destroy();
@@ -44,21 +67,23 @@ function testDataAndRegions(graph) {
     thrown2 = true;
   }
   ok(thrown2, "Setting regions twice shouldn't work.");
 
   ok(graph.hasData(), "The graph should now have the data source set.");
   ok(graph.hasRegions(), "The graph should now have the regions set.");
 
   is(graph.dataScaleX,
-     graph.width / 4180, // last & first tick in TEST_DATA
+     // last & first tick in TEST_DATA
+     graph.width / 4180,
     "The data scale on the X axis is correct.");
 
   is(graph.dataScaleY,
-     graph.height / 60 * 0.85, // max value in TEST_DATA * GRAPH_DAMPEN_VALUES
+     // max value in TEST_DATA * GRAPH_DAMPEN_VALUES
+     graph.height / 60 * 0.85,
     "The data scale on the Y axis is correct.");
 
   for (let i = 0; i < TEST_REGIONS.length; i++) {
     let original = TEST_REGIONS[i];
     let normalized = graph._regions[i];
 
     is(original.start * graph.dataScaleX, normalized.start,
       "The region's start value was properly normalized.");

--- a/devtools/client/shared/test/browser_graphs-03.js
+++ b/devtools/client/shared/test/browser_graphs-03.js
@@ -1,24 +1,26 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that graph widgets can handle clients getting/setting the
 // selection or cursor.
 
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
 
   yield testSelection(graph);
   yield testCursor(graph);
 
   yield graph.destroy();
   host.destroy();

--- a/devtools/client/shared/test/browser_graphs-04.js
+++ b/devtools/client/shared/test/browser_graphs-04.js
@@ -1,23 +1,25 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that graph widgets can correctly compare selections and cursors.
 
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
 
   testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }

--- a/devtools/client/shared/test/browser_graphs-05.js
+++ b/devtools/client/shared/test/browser_graphs-05.js
@@ -1,25 +1,48 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that graph widgets can correctly determine which regions are hovered.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
 const TEST_REGIONS = [{ start: 320, end: 460 }, { start: 780, end: 860 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
 
   testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }

--- a/devtools/client/shared/test/browser_graphs-06.js
+++ b/devtools/client/shared/test/browser_graphs-06.js
@@ -1,25 +1,48 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests if clicking on regions adds a selection spanning that region.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
 const TEST_REGIONS = [{ start: 320, end: 460 }, { start: 780, end: 860 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
 
   testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }

--- a/devtools/client/shared/test/browser_graphs-07a.js
+++ b/devtools/client/shared/test/browser_graphs-07a.js
@@ -1,24 +1,47 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests if selecting, resizing, moving selections and zooming in/out works.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
   testGraph(graph, normalDragStop);
   yield graph.destroy();
 
   let graph2 = new LineGraphWidget(doc.body, "fps");
   yield graph2.once("ready");
   testGraph(graph2, buggyDragStop);
@@ -169,24 +192,16 @@ function testGraph(graph, dragStop) {
 // EventUtils just doesn't work!
 
 function hover(graph, x, y = 1) {
   x /= window.devicePixelRatio;
   y /= window.devicePixelRatio;
   graph._onMouseMove({ testX: x, testY: y });
 }
 
-function click(graph, x, y = 1) {
-  x /= window.devicePixelRatio;
-  y /= window.devicePixelRatio;
-  graph._onMouseMove({ testX: x, testY: y });
-  graph._onMouseDown({ testX: x, testY: y });
-  graph._onMouseUp({ testX: x, testY: y });
-}
-
 function dragStart(graph, x, y = 1) {
   x /= window.devicePixelRatio;
   y /= window.devicePixelRatio;
   graph._onMouseMove({ testX: x, testY: y });
   graph._onMouseDown({ testX: x, testY: y });
 }
 
 function normalDragStop(graph, x, y = 1) {

--- a/devtools/client/shared/test/browser_graphs-07b.js
+++ b/devtools/client/shared/test/browser_graphs-07b.js
@@ -1,24 +1,47 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests if selections can't be added via clicking, while not allowed.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
 var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
 
   testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }

--- a/devtools/client/shared/test/browser_graphs-07c.js
+++ b/devtools/client/shared/test/browser_graphs-07c.js
@@ -1,26 +1,49 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests if movement via event dispatching using screenX / screenY
 // works.  All of the other tests directly use the graph's mouse event
 // callbacks with textX / testY for convenience.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
   testGraph(graph);
   yield graph.destroy();
   host.destroy();
 }
 
 function testGraph(graph) {

--- a/devtools/client/shared/test/browser_graphs-07d.js
+++ b/devtools/client/shared/test/browser_graphs-07d.js
@@ -1,25 +1,48 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that selections are drawn onto the canvas.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
 const TEST_REGIONS = [{ start: 320, end: 460 }, { start: 780, end: 860 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
 
   testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }

--- a/devtools/client/shared/test/browser_graphs-07e.js
+++ b/devtools/client/shared/test/browser_graphs-07e.js
@@ -1,25 +1,48 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that selections are drawn onto the canvas.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
-var CURRENT_ZOOM = 1;
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+let CURRENT_ZOOM = 1;
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
   graph.setData(TEST_DATA);
 
   info("Testing with normal zoom.");
   testGraph(graph);
 
   info("Testing while zoomed out.");

--- a/devtools/client/shared/test/browser_graphs-08.js
+++ b/devtools/client/shared/test/browser_graphs-08.js
@@ -1,24 +1,47 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests if a selection is dropped when clicking outside of it.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
 
   testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }

--- a/devtools/client/shared/test/browser_graphs-09a.js
+++ b/devtools/client/shared/test/browser_graphs-09a.js
@@ -1,24 +1,47 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that line graphs properly create the gutter and tooltips.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, { metric: "fps" });
 
   yield testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }
 
@@ -60,22 +83,22 @@ function* testGraph(graph) {
 
   is(graph._maxTooltip.querySelector("[text=metric]").textContent, "fps",
     "The maximum tooltip displays the correct metric.");
   is(graph._avgTooltip.querySelector("[text=metric]").textContent, "fps",
     "The average tooltip displays the correct metric.");
   is(graph._minTooltip.querySelector("[text=metric]").textContent, "fps",
     "The minimum tooltip displays the correct metric.");
 
-  is(parseInt(graph._maxTooltip.style.top), 22,
+  is(parseInt(graph._maxTooltip.style.top, 10), 22,
     "The maximum tooltip is positioned correctly.");
-  is(parseInt(graph._avgTooltip.style.top), 61,
+  is(parseInt(graph._avgTooltip.style.top, 10), 61,
     "The average tooltip is positioned correctly.");
-  is(parseInt(graph._minTooltip.style.top), 128,
+  is(parseInt(graph._minTooltip.style.top, 10), 128,
     "The minimum tooltip is positioned correctly.");
 
-  is(parseInt(graph._maxGutterLine.style.top), 22,
+  is(parseInt(graph._maxGutterLine.style.top, 10), 22,
     "The maximum gutter line is positioned correctly.");
-  is(parseInt(graph._avgGutterLine.style.top), 61,
+  is(parseInt(graph._avgGutterLine.style.top, 10), 61,
     "The average gutter line is positioned correctly.");
-  is(parseInt(graph._minGutterLine.style.top), 128,
+  is(parseInt(graph._minGutterLine.style.top, 10), 128,
     "The minimum gutter line is positioned correctly.");
 }

--- a/devtools/client/shared/test/browser_graphs-09b.js
+++ b/devtools/client/shared/test/browser_graphs-09b.js
@@ -1,24 +1,47 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that line graphs properly use the tooltips configuration properties.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
   graph.withTooltipArrows = false;
   graph.withFixedTooltipPositions = true;
 
   yield testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
@@ -38,22 +61,22 @@ function* testGraph(graph) {
 
   is(graph._maxTooltip.getAttribute("with-arrows"), "false",
     "The maximum tooltip has the correct 'with-arrows' attribute.");
   is(graph._avgTooltip.getAttribute("with-arrows"), "false",
     "The average tooltip has the correct 'with-arrows' attribute.");
   is(graph._minTooltip.getAttribute("with-arrows"), "false",
     "The minimum tooltip has the correct 'with-arrows' attribute.");
 
-  is(parseInt(graph._maxTooltip.style.top), 8,
+  is(parseInt(graph._maxTooltip.style.top, 10), 8,
     "The maximum tooltip is positioned correctly.");
-  is(parseInt(graph._avgTooltip.style.top), 8,
+  is(parseInt(graph._avgTooltip.style.top, 10), 8,
     "The average tooltip is positioned correctly.");
-  is(parseInt(graph._minTooltip.style.top), 142,
+  is(parseInt(graph._minTooltip.style.top, 10), 142,
     "The minimum tooltip is positioned correctly.");
 
-  is(parseInt(graph._maxGutterLine.style.top), 22,
+  is(parseInt(graph._maxGutterLine.style.top, 10), 22,
     "The maximum gutter line is positioned correctly.");
-  is(parseInt(graph._avgGutterLine.style.top), 61,
+  is(parseInt(graph._avgGutterLine.style.top, 10), 61,
     "The average gutter line is positioned correctly.");
-  is(parseInt(graph._minGutterLine.style.top), 128,
+  is(parseInt(graph._minGutterLine.style.top, 10), 128,
     "The minimum gutter line is positioned correctly.");
 }

--- a/devtools/client/shared/test/browser_graphs-09c.js
+++ b/devtools/client/shared/test/browser_graphs-09c.js
@@ -1,24 +1,26 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that line graphs hide the tooltips when there's no data available.
 
 const TEST_DATA = [];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
 
   yield testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }
 

--- a/devtools/client/shared/test/browser_graphs-09d.js
+++ b/devtools/client/shared/test/browser_graphs-09d.js
@@ -1,25 +1,27 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that line graphs hide the 'max' tooltip when the distance between
 // the 'min' and 'max' tooltip is too small.
 
 const TEST_DATA = [{ delta: 100, value: 60 }, { delta: 200, value: 59.9 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
 
   yield testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }
 

--- a/devtools/client/shared/test/browser_graphs-09e.js
+++ b/devtools/client/shared/test/browser_graphs-09e.js
@@ -1,27 +1,50 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that line graphs hide the gutter and tooltips when there's no data,
 // but show them when there is.
 
 const NO_DATA = [];
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
 
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
 
   yield testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }
 

--- a/devtools/client/shared/test/browser_graphs-09f.js
+++ b/devtools/client/shared/test/browser_graphs-09f.js
@@ -1,25 +1,27 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests the constructor options for `min`, `max` and `avg` on displaying the
 // gutter/tooltips and lines.
 
 const TEST_DATA = [{ delta: 100, value: 60 }, { delta: 200, value: 1 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
 
   yield testGraph(doc.body, { avg: false });
   yield testGraph(doc.body, { min: false });
   yield testGraph(doc.body, { max: false });
   yield testGraph(doc.body, { min: false, max: false, avg: false });
   yield testGraph(doc.body, {});
 
   host.destroy();

--- a/devtools/client/shared/test/browser_graphs-10a.js
+++ b/devtools/client/shared/test/browser_graphs-10a.js
@@ -1,25 +1,49 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that graphs properly handle resizing.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost("window");
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost("window");
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
 
   let refreshCount = 0;
   graph.on("refresh", () => refreshCount++);
 
   yield testGraph(host, graph);

--- a/devtools/client/shared/test/browser_graphs-10b.js
+++ b/devtools/client/shared/test/browser_graphs-10b.js
@@ -1,26 +1,50 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that graphs aren't refreshed when the owner window resizes but
 // the graph dimensions stay the same.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost("window");
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost("window");
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new LineGraphWidget(doc.body, "fps");
   graph.fixedWidth = 200;
   graph.fixedHeight = 100;
   yield graph.once("ready");
 
   let refreshCount = 0;
   let refreshCancelledCount = 0;

--- a/devtools/client/shared/test/browser_graphs-10c.js
+++ b/devtools/client/shared/test/browser_graphs-10c.js
@@ -1,23 +1,47 @@
+
+"use strict";
 
 // Tests that graphs properly handle resizing.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost("window");
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost("window");
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new LineGraphWidget(doc.body, "fps");
   yield graph.once("ready");
 
   let refreshCount = 0;
   graph.on("refresh", () => refreshCount++);
 
   yield testGraph(host, graph);

--- a/devtools/client/shared/test/browser_graphs-11a.js
+++ b/devtools/client/shared/test/browser_graphs-11a.js
@@ -1,29 +1,31 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that bar graph create a legend as expected.
 
-var BarGraphWidget = require("devtools/client/shared/widgets/BarGraphWidget");
+const BarGraphWidget = require("devtools/client/shared/widgets/BarGraphWidget");
 
 const CATEGORIES = [
   { color: "#46afe3", label: "Foo" },
   { color: "#eb5368", label: "Bar" },
   { color: "#70bf53", label: "Baz" }
 ];
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new BarGraphWidget(doc.body);
   yield graph.once("ready");
 
   testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }
@@ -37,22 +39,22 @@ function testGraph(graph) {
     "A legend container should be available.");
   is(legendContainer.childNodes.length, 3,
     "Three legend items should have been created.");
 
   let legendItems = graph._document.querySelectorAll(".bar-graph-widget-legend-item");
   is(legendItems.length, 3,
     "Three legend items should exist in the entire graph.");
 
-  is(legendItems[0].querySelector("[view=color]").style.backgroundColor, "rgb(70, 175, 227)",
-    "The first legend item has the correct color.");
-  is(legendItems[1].querySelector("[view=color]").style.backgroundColor, "rgb(235, 83, 104)",
-    "The second legend item has the correct color.");
-  is(legendItems[2].querySelector("[view=color]").style.backgroundColor, "rgb(112, 191, 83)",
-    "The third legend item has the correct color.");
+  is(legendItems[0].querySelector("[view=color]").style.backgroundColor,
+     "rgb(70, 175, 227)", "The first legend item has the correct color.");
+  is(legendItems[1].querySelector("[view=color]").style.backgroundColor,
+     "rgb(235, 83, 104)", "The second legend item has the correct color.");
+  is(legendItems[2].querySelector("[view=color]").style.backgroundColor,
+     "rgb(112, 191, 83)", "The third legend item has the correct color.");
 
   is(legendItems[0].querySelector("[view=label]").textContent, "Foo",
     "The first legend item has the correct label.");
   is(legendItems[1].querySelector("[view=label]").textContent, "Bar",
     "The second legend item has the correct label.");
   is(legendItems[2].querySelector("[view=label]").textContent, "Baz",
     "The third legend item has the correct label.");
 }

--- a/devtools/client/shared/test/browser_graphs-11b.js
+++ b/devtools/client/shared/test/browser_graphs-11b.js
@@ -1,30 +1,33 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that bar graph's legend items handle mouseover/mouseout.
 
-var BarGraphWidget = require("devtools/client/shared/widgets/BarGraphWidget");
+const BarGraphWidget = require("devtools/client/shared/widgets/BarGraphWidget");
 
 const CATEGORIES = [
   { color: "#46afe3", label: "Foo" },
   { color: "#eb5368", label: "Bar" },
   { color: "#70bf53", label: "Baz" }
 ];
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost();
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new BarGraphWidget(doc.body, 1);
   graph.fixedWidth = 200;
   graph.fixedHeight = 100;
 
   yield graph.once("ready");
   yield testGraph(graph);
 
@@ -44,16 +47,17 @@ function* testGraph(graph) {
   }, {
     delta: 1400, values: [0, 3, 1]
   }, {
     delta: 1500, values: [3, 0, 2]
   }, {
     delta: 1600, values: [3, 2, 0]
   }]);
 
+  /* eslint-disable max-len */
   is(graph._blocksBoundingRects.toSource(), "[{type:1, start:0, end:33.33333333333333, top:70, bottom:100}, {type:2, start:0, end:33.33333333333333, top:24, bottom:69}, {type:0, start:34.33333333333333, end:66.66666666666666, top:85, bottom:100}, {type:2, start:34.33333333333333, end:66.66666666666666, top:54, bottom:84}, {type:0, start:67.66666666666666, end:100, top:70, bottom:100}, {type:1, start:67.66666666666666, end:100, top:54, bottom:69}, {type:1, start:101, end:133.33333333333331, top:55, bottom:100}, {type:2, start:101, end:133.33333333333331, top:39, bottom:54}, {type:0, start:134.33333333333331, end:166.66666666666666, top:55, bottom:100}, {type:2, start:134.33333333333331, end:166.66666666666666, top:24, bottom:54}, {type:0, start:167.66666666666666, end:200, top:55, bottom:100}, {type:1, start:167.66666666666666, end:200, top:24, bottom:54}]",
     "The correct blocks bounding rects were calculated for the bar graph.");
 
   let legendItems = graph._document.querySelectorAll(".bar-graph-widget-legend-item");
   is(legendItems.length, 3,
     "Three legend items should exist in the entire graph.");
 
   yield testLegend(graph, 0, {
@@ -69,16 +73,17 @@ function* testGraph(graph) {
     rightmost: "({type:1, start:167.66666666666666, end:200, top:24, bottom:54})"
   });
   yield testLegend(graph, 2, {
     highlights: "[{type:2, start:0, end:33.33333333333333, top:24, bottom:69}, {type:2, start:34.33333333333333, end:66.66666666666666, top:54, bottom:84}, {type:2, start:101, end:133.33333333333331, top:39, bottom:54}, {type:2, start:134.33333333333331, end:166.66666666666666, top:24, bottom:54}]",
     selection: "({start:0, end:166.66666666666666})",
     leftmost: "({type:2, start:0, end:33.33333333333333, top:24, bottom:69})",
     rightmost: "({type:2, start:134.33333333333331, end:166.66666666666666, top:24, bottom:54})"
   });
+  /* eslint-enable max-len */
 }
 
 function* testLegend(graph, index, { highlights, selection, leftmost, rightmost }) {
   // Hover.
 
   let legendItems = graph._document.querySelectorAll(".bar-graph-widget-legend-item");
   let colorBlock = legendItems[index].querySelector("[view=color]");
 

--- a/devtools/client/shared/test/browser_graphs-12.js
+++ b/devtools/client/shared/test/browser_graphs-12.js
@@ -1,26 +1,29 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that canvas graphs can have their selection linked.
 
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
-var BarGraphWidget = require("devtools/client/shared/widgets/BarGraphWidget");
-var {CanvasGraphUtils} = require("devtools/client/shared/widgets/Graphs");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const BarGraphWidget = require("devtools/client/shared/widgets/BarGraphWidget");
+const {CanvasGraphUtils} = require("devtools/client/shared/widgets/Graphs");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost();
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let first = document.createElement("div");
   first.setAttribute("style", "display: inline-block; width: 100%; height: 50%;");
   doc.body.appendChild(first);
 
   let second = document.createElement("div");
   second.setAttribute("style", "display: inline-block; width: 100%; height: 50%;");
   doc.body.appendChild(second);

--- a/devtools/client/shared/test/browser_graphs-13.js
+++ b/devtools/client/shared/test/browser_graphs-13.js
@@ -1,24 +1,27 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that graph widgets may have a fixed width or height.
 
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
-  doc.body.setAttribute("style", "position: fixed; width: 100%; height: 100%; margin: 0;");
+  let [host,, doc] = yield createHost();
+  doc.body.setAttribute("style",
+                        "position: fixed; width: 100%; height: 100%; margin: 0;");
 
   let graph = new LineGraphWidget(doc.body, "fps");
   graph.fixedWidth = 200;
   graph.fixedHeight = 100;
 
   yield graph.ready();
   testGraph(host, graph);
 

--- a/devtools/client/shared/test/browser_graphs-14.js
+++ b/devtools/client/shared/test/browser_graphs-14.js
@@ -1,24 +1,47 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that graph widgets correctly emit mouse input events.
 
-const TEST_DATA = [{ delta: 112, value: 48 }, { delta: 213, value: 59 }, { delta: 313, value: 60 }, { delta: 413, value: 59 }, { delta: 530, value: 59 }, { delta: 646, value: 58 }, { delta: 747, value: 60 }, { delta: 863, value: 48 }, { delta: 980, value: 37 }, { delta: 1097, value: 30 }, { delta: 1213, value: 29 }, { delta: 1330, value: 23 }, { delta: 1430, value: 10 }, { delta: 1534, value: 17 }, { delta: 1645, value: 20 }, { delta: 1746, value: 22 }, { delta: 1846, value: 39 }, { delta: 1963, value: 26 }, { delta: 2080, value: 27 }, { delta: 2197, value: 35 }, { delta: 2312, value: 47 }, { delta: 2412, value: 53 }, { delta: 2514, value: 60 }, { delta: 2630, value: 37 }, { delta: 2730, value: 36 }, { delta: 2830, value: 37 }, { delta: 2946, value: 36 }, { delta: 3046, value: 40 }, { delta: 3163, value: 47 }, { delta: 3280, value: 41 }, { delta: 3380, value: 35 }, { delta: 3480, value: 27 }, { delta: 3580, value: 39 }, { delta: 3680, value: 42 }, { delta: 3780, value: 49 }, { delta: 3880, value: 55 }, { delta: 3980, value: 60 }, { delta: 4080, value: 60 }, { delta: 4180, value: 60 }];
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const TEST_DATA = [
+  { delta: 112, value: 48 }, { delta: 213, value: 59 },
+  { delta: 313, value: 60 }, { delta: 413, value: 59 },
+  { delta: 530, value: 59 }, { delta: 646, value: 58 },
+  { delta: 747, value: 60 }, { delta: 863, value: 48 },
+  { delta: 980, value: 37 }, { delta: 1097, value: 30 },
+  { delta: 1213, value: 29 }, { delta: 1330, value: 23 },
+  { delta: 1430, value: 10 }, { delta: 1534, value: 17 },
+  { delta: 1645, value: 20 }, { delta: 1746, value: 22 },
+  { delta: 1846, value: 39 }, { delta: 1963, value: 26 },
+  { delta: 2080, value: 27 }, { delta: 2197, value: 35 },
+  { delta: 2312, value: 47 }, { delta: 2412, value: 53 },
+  { delta: 2514, value: 60 }, { delta: 2630, value: 37 },
+  { delta: 2730, value: 36 }, { delta: 2830, value: 37 },
+  { delta: 2946, value: 36 }, { delta: 3046, value: 40 },
+  { delta: 3163, value: 47 }, { delta: 3280, value: 41 },
+  { delta: 3380, value: 35 }, { delta: 3480, value: 27 },
+  { delta: 3580, value: 39 }, { delta: 3680, value: 42 },
+  { delta: 3780, value: 49 }, { delta: 3880, value: 55 },
+  { delta: 3980, value: 60 }, { delta: 4080, value: 60 },
+  { delta: 4180, value: 60 }
+];
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
 
   yield testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }
 

--- a/devtools/client/shared/test/browser_graphs-15.js
+++ b/devtools/client/shared/test/browser_graphs-15.js
@@ -1,47 +1,49 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that graph widgets correctly emit mouse input events.
 
 const FAST_FPS = 60;
 const SLOW_FPS = 10;
 
 // Each element represents a second
 const FRAMES = [FAST_FPS, FAST_FPS, FAST_FPS, SLOW_FPS, FAST_FPS];
 const TEST_DATA = [];
 const INTERVAL = 100;
-const DURATION = 5000; // 5s
+const DURATION = 5000;
 var t = 0;
 for (let frameRate of FRAMES) {
   for (let i = 0; i < frameRate; i++) {
-    let delta = Math.floor(1000 / frameRate); // Duration between frames at this rate
+    // Duration between frames at this rate
+    let delta = Math.floor(1000 / frameRate);
     t += delta;
     TEST_DATA.push(t);
   }
 }
 
-var LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
+const LineGraphWidget = require("devtools/client/shared/widgets/LineGraphWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new LineGraphWidget(doc.body, "fps");
 
   yield testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }
 
 function* testGraph(graph) {
-
   console.log("test data", TEST_DATA);
   yield graph.setDataFromTimestamps(TEST_DATA, INTERVAL, DURATION);
   is(graph._avgTooltip.querySelector("[text=value]").textContent, "50",
     "The average tooltip displays the correct value.");
 }

--- a/devtools/client/shared/test/browser_graphs-16.js
+++ b/devtools/client/shared/test/browser_graphs-16.js
@@ -1,14 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that mounta graphs work as expected.
 
-var MountainGraphWidget = require("devtools/client/shared/widgets/MountainGraphWidget");
+const MountainGraphWidget = require("devtools/client/shared/widgets/MountainGraphWidget");
 
 const TEST_DATA = [
   { delta: 0, values: [0.1, 0.5, 0.3] },
   { delta: 1, values: [0.25, 0, 0.5] },
   { delta: 2, values: [0.5, 0.25, 0.1] },
   { delta: 3, values: [0, 0.75, 0] },
   { delta: 4, values: [0.75, 0, 0.25] }
 ];
@@ -21,17 +23,17 @@ const SECTIONS = [
 
 add_task(function* () {
   yield addTab("about:blank");
   yield performTest();
   gBrowser.removeCurrentTab();
 });
 
 function* performTest() {
-  let [host, win, doc] = yield createHost();
+  let [host,, doc] = yield createHost();
   let graph = new MountainGraphWidget(doc.body);
   yield graph.once("ready");
 
   testGraph(graph);
 
   yield graph.destroy();
   host.destroy();
 }