Bug 1316723 - Fix more eslint errors in devtools/client/shared/. r=tromey
authorTim Nguyen <ntim.bugs@gmail.com>
Fri, 11 Nov 2016 09:09:50 +0000
changeset 367322 516fd53f0f8428dd05a803ec9eaf9922ce23fedc
parent 367321 162e1d1d9565e6d825c02b3e738bfaa1bf9766d6
child 367323 f5031fb2bc5e9f7d69f6e7c3d6381f66e7728b0d
push id1369
push userjlorenzo@mozilla.com
push dateMon, 27 Feb 2017 14:59:41 +0000
treeherdermozilla-release@d75a1dba431f [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewerstromey
bugs1316723
milestone52.0a1
first release with
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
last release without
nightly linux32
nightly linux64
nightly mac
nightly win32
nightly win64
Bug 1316723 - Fix more eslint errors in devtools/client/shared/. r=tromey MozReview-Commit-ID: IzXyqkQECKb
.eslintignore
devtools/client/shared/components/test/browser/browser_notification_box_basic.js
devtools/client/shared/components/test/mochitest/head.js
devtools/client/shared/components/test/mochitest/test_stack-trace.html
devtools/client/shared/redux/middleware/test/.eslintrc.js
devtools/client/shared/redux/middleware/test/head.js
devtools/client/shared/redux/middleware/test/test_middleware-task-01.js
devtools/client/shared/redux/middleware/test/test_middleware-task-02.js
devtools/client/shared/redux/middleware/test/test_middleware-task-03.js
devtools/client/shared/test/.eslintrc.js
devtools/client/shared/test/browser_css_angle.js
devtools/client/shared/test/browser_css_color.js
devtools/client/shared/test/browser_cubic-bezier-01.js
devtools/client/shared/test/browser_cubic-bezier-02.js
devtools/client/shared/test/browser_cubic-bezier-03.js
devtools/client/shared/test/browser_cubic-bezier-04.js
devtools/client/shared/test/browser_cubic-bezier-05.js
devtools/client/shared/test/browser_devices.js
devtools/client/shared/test/browser_filter-editor-01.js
devtools/client/shared/test/browser_filter-editor-02.js
devtools/client/shared/test/browser_filter-editor-03.js
devtools/client/shared/test/browser_filter-editor-04.js
devtools/client/shared/test/browser_filter-editor-05.js
devtools/client/shared/test/browser_filter-editor-06.js
devtools/client/shared/test/browser_filter-editor-07.js
devtools/client/shared/test/browser_filter-editor-08.js
devtools/client/shared/test/browser_filter-editor-09.js
devtools/client/shared/test/browser_filter-editor-10.js
devtools/client/shared/test/browser_filter-presets-01.js
devtools/client/shared/test/browser_filter-presets-02.js
devtools/client/shared/test/browser_filter-presets-03.js
devtools/client/shared/test/browser_flame-graph-01.js
devtools/client/shared/test/browser_flame-graph-02.js
devtools/client/shared/test/browser_flame-graph-03a.js
devtools/client/shared/test/browser_flame-graph-03b.js
devtools/client/shared/test/browser_flame-graph-03c.js
devtools/client/shared/test/browser_flame-graph-04.js
devtools/client/shared/test/browser_flame-graph-05.js
devtools/client/shared/test/browser_flame-graph-utils-01.js
devtools/client/shared/test/browser_flame-graph-utils-02.js
devtools/client/shared/test/browser_flame-graph-utils-03.js
devtools/client/shared/test/browser_flame-graph-utils-04.js
devtools/client/shared/test/browser_flame-graph-utils-05.js
devtools/client/shared/test/browser_flame-graph-utils-06.js
devtools/client/shared/test/browser_flame-graph-utils-hash.js
devtools/client/shared/test/browser_graphs-01.js
devtools/client/shared/test/browser_graphs-02.js
devtools/client/shared/test/browser_graphs-03.js
devtools/client/shared/test/browser_graphs-04.js
devtools/client/shared/test/browser_graphs-05.js
devtools/client/shared/test/browser_graphs-06.js
devtools/client/shared/test/browser_graphs-07a.js
devtools/client/shared/test/browser_graphs-07b.js
devtools/client/shared/test/browser_graphs-07c.js
devtools/client/shared/test/browser_graphs-07d.js
devtools/client/shared/test/browser_graphs-07e.js
devtools/client/shared/test/browser_graphs-08.js
devtools/client/shared/test/browser_graphs-09a.js
devtools/client/shared/test/browser_graphs-09b.js
devtools/client/shared/test/browser_graphs-09c.js
devtools/client/shared/test/browser_graphs-09d.js
devtools/client/shared/test/browser_graphs-09e.js
devtools/client/shared/test/browser_graphs-09f.js
devtools/client/shared/test/browser_graphs-10a.js
devtools/client/shared/test/browser_graphs-10b.js
devtools/client/shared/test/browser_graphs-10c.js
devtools/client/shared/test/browser_graphs-11a.js
devtools/client/shared/test/browser_graphs-11b.js
devtools/client/shared/test/browser_graphs-12.js
devtools/client/shared/test/browser_graphs-13.js
devtools/client/shared/test/browser_graphs-14.js
devtools/client/shared/test/browser_graphs-15.js
devtools/client/shared/test/browser_graphs-16.js
devtools/client/shared/test/browser_layoutHelpers-getBoxQuads.js
devtools/client/shared/test/browser_layoutHelpers.js
devtools/client/shared/test/browser_mdn-docs-01.js
devtools/client/shared/test/browser_num-l10n.js
devtools/client/shared/test/browser_options-view-01.js
devtools/client/shared/test/browser_outputparser.js
devtools/client/shared/test/browser_poller.js
devtools/client/shared/test/browser_prefs-01.js
devtools/client/shared/test/browser_prefs-02.js
devtools/client/shared/test/browser_spectrum.js
devtools/client/shared/test/browser_telemetry_button_eyedropper.js
devtools/client/shared/test/browser_telemetry_button_responsive.js
devtools/client/shared/test/browser_telemetry_button_scratchpad.js
devtools/client/shared/test/browser_telemetry_sidebar.js
devtools/client/shared/test/browser_telemetry_toolbox.js
devtools/client/shared/test/browser_telemetry_toolboxtabs_canvasdebugger.js
devtools/client/shared/test/browser_telemetry_toolboxtabs_inspector.js
devtools/client/shared/test/browser_telemetry_toolboxtabs_jsdebugger.js
devtools/client/shared/test/browser_telemetry_toolboxtabs_jsprofiler.js
devtools/client/shared/test/browser_telemetry_toolboxtabs_netmonitor.js
devtools/client/shared/test/browser_telemetry_toolboxtabs_options.js
devtools/client/shared/test/browser_telemetry_toolboxtabs_shadereditor.js
devtools/client/shared/test/browser_telemetry_toolboxtabs_storage.js
devtools/client/shared/test/browser_telemetry_toolboxtabs_styleeditor.js
devtools/client/shared/test/browser_telemetry_toolboxtabs_webaudioeditor.js
devtools/client/shared/test/browser_telemetry_toolboxtabs_webconsole.js
devtools/client/shared/test/browser_templater_basic.js
devtools/client/shared/test/browser_theme.js
devtools/client/shared/test/browser_theme_switching.js
devtools/client/shared/test/browser_toolbar_basic.html
devtools/client/shared/test/browser_toolbar_basic.js
devtools/client/shared/test/browser_toolbar_tooltip.js
devtools/client/shared/test/browser_toolbar_webconsole_errors_count.html
devtools/client/shared/test/browser_toolbar_webconsole_errors_count.js
devtools/client/shared/test/browser_treeWidget_keyboard_interaction.js
devtools/client/shared/test/browser_treeWidget_mouse_interaction.js
devtools/client/shared/test/helper_color_data.js
devtools/client/shared/test/leakhunt.js
devtools/client/shared/test/test-actor.js
devtools/client/shared/test/unit/test_VariablesView_filtering-without-controller.js
devtools/client/shared/test/unit/test_VariablesView_getString_promise.js
devtools/client/shared/test/unit/test_advanceValidate.js
devtools/client/shared/test/unit/test_attribute-parsing-01.js
devtools/client/shared/test/unit/test_attribute-parsing-02.js
devtools/client/shared/test/unit/test_bezierCanvas.js
devtools/client/shared/test/unit/test_cssColor-03.js
devtools/client/shared/test/unit/test_parseDeclarations.js
devtools/client/shared/test/unit/test_rewriteDeclarations.js
devtools/client/shared/test/unit/test_source-utils.js
devtools/client/shared/test/unit/test_undoStack.js
--- 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();
 }
--- a/devtools/client/shared/test/browser_layoutHelpers-getBoxQuads.js
+++ b/devtools/client/shared/test/browser_layoutHelpers-getBoxQuads.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
  * http://creativecommons.org/publicdomain/zero/1.0/ */
 
 // Tests getAdjustedQuads works properly in a variety of use cases including
 // iframes, scroll and zoom
 
 "use strict";
 
-var {getAdjustedQuads} = require("devtools/shared/layout/utils");
+const {getAdjustedQuads} = require("devtools/shared/layout/utils");
 
 const TEST_URI = TEST_URI_ROOT + "browser_layoutHelpers-getBoxQuads.html";
 
 add_task(function* () {
   let tab = yield addTab(TEST_URI);
   let doc = tab.linkedBrowser.contentDocument;
 
   ok(typeof getAdjustedQuads === "function", "getAdjustedQuads is defined");
@@ -54,18 +54,18 @@ function returnsTheRightDataStructure(do
     }
   }
 }
 
 function isEmptyForMissingNode(doc) {
   info("Checks that null is returned for invalid nodes");
 
   for (let input of [null, undefined, "", 0]) {
-    is(getAdjustedQuads(doc.defaultView, input).length, 0, "A 0-length array is returned" +
-      "for input " + input);
+    is(getAdjustedQuads(doc.defaultView, input).length, 0,
+      "A 0-length array is returned for input " + input);
   }
 }
 
 function isEmptyForHiddenNodes(doc) {
   info("Checks that null is returned for nodes that aren't rendered");
 
   let style = doc.querySelector("#styles");
   is(getAdjustedQuads(doc.defaultView, style).length, 0,
@@ -201,17 +201,18 @@ function* takesZoomIntoAccount(doc) {
     "The zoomed out quad is smaller than the default one");
   ok(zoomedOutQuad.bounds.height < defaultQuad.bounds.height,
     "The zoomed out quad is smaller than the default one");
 
   yield window.FullZoom.reset();
 }
 
 function returnsMultipleItemsForWrappingInlineElements(doc) {
-  info("Checks that several quads are returned for inline elements that span line-breaks");
+  info("Checks that several quads are returned " +
+       "for inline elements that span line-breaks");
 
   let node = doc.querySelector("#inline");
   let quads = getAdjustedQuads(doc.defaultView, node, "content");
   // At least 3 because of the 2 <br />, maybe more depending on the window size.
   ok(quads.length >= 3, "Multiple quads were returned");
 
   is(quads.length, node.getBoxQuads().length,
     "The same number of boxes as getBoxQuads was returned");
--- a/devtools/client/shared/test/browser_layoutHelpers.js
+++ b/devtools/client/shared/test/browser_layoutHelpers.js
@@ -1,83 +1,93 @@
 /* Any copyright is dedicated to the Public Domain.
  * http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that scrollIntoViewIfNeeded works properly.
-var {scrollIntoViewIfNeeded} = require("devtools/client/shared/scroll");
+const {scrollIntoViewIfNeeded} = require("devtools/client/shared/scroll");
 
 const TEST_URI = TEST_URI_ROOT + "browser_layoutHelpers.html";
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [host, win] = yield createHost("bottom", TEST_URI);
   runTest(win);
   host.destroy();
 });
 
 function runTest(win) {
   let some = win.document.getElementById("some");
 
   some.style.top = win.innerHeight + "px";
   some.style.left = win.innerWidth + "px";
   // The tests start with a black 2x2 pixels square below bottom right.
   // Do not resize the window during the tests.
 
   let xPos = Math.floor(win.innerWidth / 2);
-  win.scroll(xPos, win.innerHeight + 2);  // Above the viewport.
+  // Above the viewport.
+  win.scroll(xPos, win.innerHeight + 2);
   scrollIntoViewIfNeeded(some);
   is(win.scrollY, Math.floor(win.innerHeight / 2) + 1,
      "Element completely hidden above should appear centered.");
   is(win.scrollX, xPos,
      "scrollX position has not changed.");
 
-  win.scroll(win.innerWidth / 2, win.innerHeight + 1);  // On the top edge.
+  // On the top edge.
+  win.scroll(win.innerWidth / 2, win.innerHeight + 1);
   scrollIntoViewIfNeeded(some);
   is(win.scrollY, win.innerHeight,
      "Element partially visible above should appear above.");
   is(win.scrollX, xPos,
      "scrollX position has not changed.");
 
-  win.scroll(win.innerWidth / 2, 0);  // Just below the viewport.
+  // Just below the viewport.
+  win.scroll(win.innerWidth / 2, 0);
   scrollIntoViewIfNeeded(some);
   is(win.scrollY, Math.floor(win.innerHeight / 2) + 1,
      "Element completely hidden below should appear centered.");
   is(win.scrollX, xPos,
      "scrollX position has not changed.");
 
-  win.scroll(win.innerWidth / 2, 1);  // On the bottom edge.
+  // On the bottom edge.
+  win.scroll(win.innerWidth / 2, 1);
   scrollIntoViewIfNeeded(some);
   is(win.scrollY, 2,
      "Element partially visible below should appear below.");
   is(win.scrollX, xPos,
      "scrollX position has not changed.");
 
-  win.scroll(win.innerWidth / 2, win.innerHeight + 2);  // Above the viewport.
+  // Above the viewport.
+  win.scroll(win.innerWidth / 2, win.innerHeight + 2);
   scrollIntoViewIfNeeded(some, false);
   is(win.scrollY, win.innerHeight,
      "Element completely hidden above should appear above " +
      "if parameter is false.");
   is(win.scrollX, xPos,
      "scrollX position has not changed.");
 
-  win.scroll(win.innerWidth / 2, win.innerHeight + 1);  // On the top edge.
+  // On the top edge.
+  win.scroll(win.innerWidth / 2, win.innerHeight + 1);
   scrollIntoViewIfNeeded(some, false);
   is(win.scrollY, win.innerHeight,
      "Element partially visible above should appear above " +
      "if parameter is false.");
   is(win.scrollX, xPos,
      "scrollX position has not changed.");
 
-  win.scroll(win.innerWidth / 2, 0);  // Below the viewport.
+  // Below the viewport.
+  win.scroll(win.innerWidth / 2, 0);
   scrollIntoViewIfNeeded(some, false);
   is(win.scrollY, 2,
      "Element completely hidden below should appear below " +
      "if parameter is false.");
   is(win.scrollX, xPos,
      "scrollX position has not changed.");
 
-  win.scroll(win.innerWidth / 2, 1);  // On the bottom edge.
+  // On the bottom edge.
+  win.scroll(win.innerWidth / 2, 1);
   scrollIntoViewIfNeeded(some, false);
   is(win.scrollY, 2,
      "Element partially visible below should appear below " +
      "if parameter is false.");
   is(win.scrollX, xPos,
      "scrollX position has not changed.");
 }
--- a/devtools/client/shared/test/browser_mdn-docs-01.js
+++ b/devtools/client/shared/test/browser_mdn-docs-01.js
@@ -122,48 +122,45 @@ function* testTheBasics(widget) {
   * in the orginal link.
   *
   * One complexity is that when you open a new tab,
   * "about:blank" is first loaded into the tab before the
   * actual page. So we ignore that first load event, and keep
   * listening until "load" is triggered for a different URI.
   */
 function checkLinkClick(link) {
-
   function loadListener(tab) {
-    var browser = getBrowser().getBrowserForTab(tab);
-    var uri = browser.currentURI.spec;
+    let browser = getBrowser().getBrowserForTab(tab);
+    let uri = browser.currentURI.spec;
 
     info("New browser tab has loaded");
     gBrowser.removeTab(tab);
     info("Resolve promise with new tab URI");
     deferred.resolve(uri);
   }
 
   function newTabListener(e) {
     gBrowser.tabContainer.removeEventListener("TabOpen", newTabListener);
-    var tab = e.target;
-    BrowserTestUtils.browserLoaded(tab.linkedBrowser, false,
-                                   url => { return url != "about:blank"; })
+    let tab = e.target;
+    BrowserTestUtils.browserLoaded(tab.linkedBrowser, false, url => url != "about:blank")
       .then(url => loadListener(tab));
   }
 
   let deferred = defer();
   info("Check that clicking the link opens a new tab with the correct URI");
   gBrowser.tabContainer.addEventListener("TabOpen", newTabListener, false);
   info("Click the link to MDN");
   link.click();
   return deferred.promise;
 }
 
 /**
  * Utility function to check content of the tooltip.
  */
 function checkTooltipContents(doc, expected) {
-
   is(doc.heading.textContent,
      expected.propertyName,
      "Property name is correct");
 
   is(doc.summary.textContent,
      expected.summary,
      "Summary is correct");
 
--- a/devtools/client/shared/test/browser_num-l10n.js
+++ b/devtools/client/shared/test/browser_num-l10n.js
@@ -1,11 +1,13 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that the localization utils work properly.
 
 const { LocalizationHelper } = require("devtools/shared/l10n");
 
 function test() {
   let l10n = new LocalizationHelper();
 
   is(l10n.numberWithDecimals(1234.56789, 2), "1,234.57",
--- a/devtools/client/shared/test/browser_options-view-01.js
+++ b/devtools/client/shared/test/browser_options-view-01.js
@@ -1,30 +1,32 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that options-view OptionsView responds to events correctly.
 
 const {OptionsView} = require("devtools/client/shared/options-view");
 
 const BRANCH = "devtools.debugger.";
 const BLACK_BOX_PREF = "auto-black-box";
 const PRETTY_PRINT_PREF = "auto-pretty-print";
 
-var originalBlackBox = Services.prefs.getBoolPref(BRANCH + BLACK_BOX_PREF);
-var originalPrettyPrint = Services.prefs.getBoolPref(BRANCH + PRETTY_PRINT_PREF);
+const originalBlackBox = Services.prefs.getBoolPref(BRANCH + BLACK_BOX_PREF);
+const originalPrettyPrint = Services.prefs.getBoolPref(BRANCH + PRETTY_PRINT_PREF);
 
 add_task(function* () {
   info("Setting a couple of preferences");
   Services.prefs.setBoolPref(BRANCH + BLACK_BOX_PREF, false);
   Services.prefs.setBoolPref(BRANCH + PRETTY_PRINT_PREF, true);
 
   info("Opening a test tab and a toolbox host to create the options view in");
   yield addTab("about:blank");
-  let [host, win, doc] = yield createHost("bottom", OPTIONS_VIEW_URL);
+  let [host, win] = yield createHost("bottom", OPTIONS_VIEW_URL);
 
   yield testOptionsView(win);
 
   info("Closing the host and current tab");
   host.destroy();
   gBrowser.removeCurrentTab();
 
   info("Resetting the preferences");
@@ -55,32 +57,38 @@ function* testOptionsView(win) {
   is(options.getPref(PRETTY_PRINT_PREF), false, "getPref returns correct value");
   is(options.getPref(BLACK_BOX_PREF), true, "getPref returns correct value");
 
   is(ppEl.getAttribute("checked"), "", "menuitems update when preferences change");
   is(bbEl.getAttribute("checked"), "true", "menuitems update when preferences change");
 
   // Tests events are fired when preferences update outside of the menu
   is(events.length, 2, "two 'pref-changed' events fired");
-  is(events[0], "auto-pretty-print", "correct pref passed in 'pref-changed' event (auto-pretty-print)");
-  is(events[1], "auto-black-box", "correct pref passed in 'pref-changed' event (auto-black-box)");
+  is(events[0], "auto-pretty-print",
+     "correct pref passed in 'pref-changed' event (auto-pretty-print)");
+  is(events[1], "auto-black-box",
+     "correct pref passed in 'pref-changed' event (auto-black-box)");
 
   // Test buttons update when clicked and preferences are updated
   yield click(options, win, ppEl);
   is(ppEl.getAttribute("checked"), "true", "menuitems update when clicked");
-  is(Services.prefs.getBoolPref(BRANCH + PRETTY_PRINT_PREF), true, "preference updated via click");
+  is(Services.prefs.getBoolPref(BRANCH + PRETTY_PRINT_PREF),
+     true, "preference updated via click");
 
   yield click(options, win, bbEl);
   is(bbEl.getAttribute("checked"), "", "menuitems update when clicked");
-  is(Services.prefs.getBoolPref(BRANCH + BLACK_BOX_PREF), false, "preference updated via click");
+  is(Services.prefs.getBoolPref(BRANCH + BLACK_BOX_PREF),
+     false, "preference updated via click");
 
   // Tests events are fired when preferences updated via click
   is(events.length, 4, "two 'pref-changed' events fired");
-  is(events[2], "auto-pretty-print", "correct pref passed in 'pref-changed' event (auto-pretty-print)");
-  is(events[3], "auto-black-box", "correct pref passed in 'pref-changed' event (auto-black-box)");
+  is(events[2], "auto-pretty-print",
+     "correct pref passed in 'pref-changed' event (auto-pretty-print)");
+  is(events[3], "auto-black-box",
+     "correct pref passed in 'pref-changed' event (auto-black-box)");
 
   yield options.destroy();
 }
 
 function createOptionsView(win) {
   return new OptionsView({
     branchName: BRANCH,
     menupopup: win.document.querySelector("#options-menupopup")
--- a/devtools/client/shared/test/browser_outputparser.js
+++ b/devtools/client/shared/test/browser_outputparser.js
@@ -101,17 +101,19 @@ function testParseCssProperty(doc, parse
                    "blur(1px) drop-shadow(0 0 0 ",
                    {name: "blue"},
                    ") url(red.svg#blue)</span></span>"]),
 
     makeColorTest("color", "currentColor", ["currentColor"]),
 
     // Test a very long property.
     makeColorTest("background-image",
+                  /* eslint-disable max-len */
                   "linear-gradient(to left, transparent 0, transparent 5%,#F00 0, #F00 10%,#FF0 0, #FF0 15%,#0F0 0, #0F0 20%,#0FF 0, #0FF 25%,#00F 0, #00F 30%,#800 0, #800 35%,#880 0, #880 40%,#080 0, #080 45%,#088 0, #088 50%,#008 0, #008 55%,#FFF 0, #FFF 60%,#EEE 0, #EEE 65%,#CCC 0, #CCC 70%,#999 0, #999 75%,#666 0, #666 80%,#333 0, #333 85%,#111 0, #111 90%,#000 0, #000 95%,transparent 0, transparent 100%)",
+                  /* eslint-enable max-len */
                   ["linear-gradient(to left, ", {name: "transparent"},
                    " 0, ", {name: "transparent"},
                    " 5%,", {name: "#F00"},
                    " 0, ", {name: "#F00"},
                    " 10%,", {name: "#FF0"},
                    " 0, ", {name: "#FF0"},
                    " 15%,", {name: "#0F0"},
                    " 0, ", {name: "#0F0"},
--- a/devtools/client/shared/test/browser_poller.js
+++ b/devtools/client/shared/test/browser_poller.js
@@ -1,11 +1,13 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests the Poller class.
 
 const { Poller } = require("devtools/client/shared/poller");
 
 add_task(function* () {
   let count1 = 0, count2 = 0, count3 = 0;
 
   let poller1 = new Poller(function () {
@@ -26,18 +28,19 @@ add_task(function* () {
   yield waitUntil(() => count2 > 10);
 
   ok(count2 > 10, "poller that was turned on polled several times");
   ok(count1 === 0, "poller that was never turned on never polled");
 
   yield poller2.off();
   let currentCount2 = count2;
 
-  poller1.on(); // Really high poll time!
-  poller3.on(); // Really high poll time!
+  // Really high poll time!
+  poller1.on();
+  poller3.on();
 
   yield waitUntil(() => count1 === 1);
   ok(true, "Poller calls fn immediately when `immediate` is true");
   ok(count3 === 0, "Poller does not call fn immediately when `immediate` is not set");
 
   ok(count2 === currentCount2, "a turned off poller does not continue to poll");
   yield poller2.off();
   yield poller2.off();
@@ -91,17 +94,18 @@ add_task(function* () {
         inflightFinished = true;
         resolve();
       }, 1000);
     });
   }, 1, true);
   asyncPoller.on();
 
   yield asyncPoller.off();
-  ok(inflightFinished, "off() method does not resolve until remaining inflight poll calls finish");
+  ok(inflightFinished,
+     "off() method does not resolve until remaining inflight poll calls finish");
   is(pollCalls, 1, "should only be one poll call to occur before turning off polling");
 });
 
 add_task(function* () {
   // Create a poller that returns a promise. This poll call
   // is called immediately, and then subsequently turned off.
   // The call to `off` should not resolve until the inflight call
   // finishes.
@@ -114,17 +118,18 @@ add_task(function* () {
         inflightFinished = true;
         resolve();
       }, 1000);
     });
   }, 1, true);
   asyncPoller.on();
 
   yield asyncPoller.destroy();
-  ok(inflightFinished, "destroy() method does not resolve until remaining inflight poll calls finish");
+  ok(inflightFinished,
+     "destroy() method does not resolve until remaining inflight poll calls finish");
   is(pollCalls, 1, "should only be one poll call to occur before destroying polling");
 
   try {
     asyncPoller.on();
     ok(false, "Calling on() after destruction should throw");
   } catch (e) {
     ok(true, "Calling on() after destruction should throw");
   }
--- a/devtools/client/shared/test/browser_prefs-01.js
+++ b/devtools/client/shared/test/browser_prefs-01.js
@@ -1,14 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that the preference helpers work properly.
 
-var { PrefsHelper } = require("devtools/client/shared/prefs");
+const { PrefsHelper } = require("devtools/client/shared/prefs");
 
 function test() {
   let Prefs = new PrefsHelper("devtools.debugger", {
     "foo": ["Bool", "enabled"]
   });
 
   let originalPrefValue = Services.prefs.getBoolPref("devtools.debugger.enabled");
   is(Prefs.foo, originalPrefValue, "The pref value was correctly fetched.");
--- a/devtools/client/shared/test/browser_prefs-02.js
+++ b/devtools/client/shared/test/browser_prefs-02.js
@@ -1,18 +1,22 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that preference helpers work properly with custom types of Float and Json.
 
-var { PrefsHelper } = require("devtools/client/shared/prefs");
+const { PrefsHelper } = require("devtools/client/shared/prefs");
 
 function test() {
-  let originalJson = Services.prefs.getCharPref("devtools.performance.timeline.hidden-markers");
-  let originalFloat = Services.prefs.getCharPref("devtools.performance.memory.sample-probability");
+  let originalJson = Services.prefs.getCharPref(
+    "devtools.performance.timeline.hidden-markers");
+  let originalFloat = Services.prefs.getCharPref(
+    "devtools.performance.memory.sample-probability");
 
   let Prefs = new PrefsHelper("devtools.performance", {
     "float": ["Float", "memory.sample-probability"],
     "json": ["Json", "timeline.hidden-markers"]
   });
 
   Prefs.registerObserver();
 
@@ -28,12 +32,14 @@ function test() {
   Services.prefs.setCharPref("devtools.performance.memory.sample-probability", "3.14");
   is(Prefs.float, 3.14, "The float pref value is correctly casted on get.");
 
   Prefs.float = 6.28;
   is(Prefs.float, 6.28, "The float pref value is correctly casted on set.");
 
   Prefs.unregisterObserver();
 
-  Services.prefs.setCharPref("devtools.performance.timeline.hidden-markers", originalJson);
-  Services.prefs.setCharPref("devtools.performance.memory.sample-probability", originalFloat);
+  Services.prefs.setCharPref("devtools.performance.timeline.hidden-markers",
+                             originalJson);
+  Services.prefs.setCharPref("devtools.performance.memory.sample-probability",
+                             originalFloat);
   finish();
 }
--- a/devtools/client/shared/test/browser_spectrum.js
+++ b/devtools/client/shared/test/browser_spectrum.js
@@ -1,22 +1,24 @@
 /* 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";
+
 // Tests that the spectrum color picker works correctly
 
 const {Spectrum} = require("devtools/client/shared/widgets/Spectrum");
 
 const TEST_URI = `data:text/html,
   <link rel="stylesheet" href="chrome://devtools/content/shared/widgets/spectrum.css" type="text/css"/>
   <div id="spectrum-container" />`;
 
 add_task(function* () {
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [host,, doc] = yield createHost("bottom", TEST_URI);
 
   let container = doc.getElementById("spectrum-container");
 
   yield testCreateAndDestroyShouldAppendAndRemoveElements(container);
   yield testPassingAColorAtInitShouldSetThatColor(container);
   yield testSettingAndGettingANewColor(container);
   yield testChangingColorShouldEmitEvents(container);
   yield testSettingColorShoudUpdateTheUI(container);
@@ -74,17 +76,17 @@ function testChangingColorShouldEmitEven
     s.show();
 
     s.once("changed", (event, rgba, color) => {
       ok(true, "Changed event was emitted on color change");
       is(rgba[0], 128, "New color is correct");
       is(rgba[1], 64, "New color is correct");
       is(rgba[2], 64, "New color is correct");
       is(rgba[3], 1, "New color is correct");
-      is("rgba(" + rgba[0] + ", " + rgba[1] + ", " + rgba[2] + ", " + rgba[3] + ")", color, "RGBA and css color correspond");
+      is(`rgba(${rgba.join(", ")})`, color, "RGBA and css color correspond");
 
       s.destroy();
       resolve();
     });
 
     // Simulate a drag move event by calling the handler directly.
     s.onDraggerMove(s.dragger.offsetWidth / 2, s.dragger.offsetHeight / 2);
   });
--- a/devtools/client/shared/test/browser_telemetry_button_eyedropper.js
+++ b/devtools/client/shared/test/browser_telemetry_button_eyedropper.js
@@ -1,52 +1,52 @@
-/* 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," +
-  "<p>browser_telemetry_button_eyedropper.js</p><div>test</div>";
-
-add_task(function* () {
-  yield addTab(TEST_URI);
-  let Telemetry = loadTelemetryAndRecordLogs();
-
-  let target = TargetFactory.forTab(gBrowser.selectedTab);
-  let toolbox = yield gDevTools.showToolbox(target, "inspector");
-  info("inspector opened");
-
-  info("testing the eyedropper button");
-  yield testButton(toolbox, Telemetry);
-
-  stopRecordingTelemetryLogs(Telemetry);
-  yield gDevTools.closeToolbox(target);
-  gBrowser.removeCurrentTab();
-});
-
-function* testButton(toolbox, Telemetry) {
-  info("Calling the eyedropper button's callback");
-  // We call the button callback directly because we don't need to test the UI here, we're
-  // only concerned about testing the telemetry probe.
-  yield toolbox.getPanel("inspector").showEyeDropper();
-
-  checkResults("_EYEDROPPER_", Telemetry);
-}
-
-function checkResults(histIdFocus, Telemetry) {
-  let result = Telemetry.prototype.telemetryInfo;
-
-  for (let [histId, value] of Object.entries(result)) {
-    if (histId.startsWith("DEVTOOLS_INSPECTOR_") ||
-        !histId.includes(histIdFocus)) {
-      // Inspector stats are tested in
-      // browser_telemetry_toolboxtabs_{toolname}.js so we skip them here
-      // because we only open the inspector once for this test.
-      continue;
-    }
-
-    if (histId.endsWith("OPENED_COUNT")) {
-      is(value.length, 1, histId + " has one entry");
-
-      let okay = value.every(element => element === true);
-      ok(okay, "All " + histId + " entries are === true");
-    }
-  }
-}
+/* 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," +
+  "<p>browser_telemetry_button_eyedropper.js</p><div>test</div>";
+
+add_task(function* () {
+  yield addTab(TEST_URI);
+  let Telemetry = loadTelemetryAndRecordLogs();
+
+  let target = TargetFactory.forTab(gBrowser.selectedTab);
+  let toolbox = yield gDevTools.showToolbox(target, "inspector");
+  info("inspector opened");
+
+  info("testing the eyedropper button");
+  yield testButton(toolbox, Telemetry);
+
+  stopRecordingTelemetryLogs(Telemetry);
+  yield gDevTools.closeToolbox(target);
+  gBrowser.removeCurrentTab();
+});
+
+function* testButton(toolbox, Telemetry) {
+  info("Calling the eyedropper button's callback");
+  // We call the button callback directly because we don't need to test the UI here, we're
+  // only concerned about testing the telemetry probe.
+  yield toolbox.getPanel("inspector").showEyeDropper();
+
+  checkResults("_EYEDROPPER_", Telemetry);
+}
+
+function checkResults(histIdFocus, Telemetry) {
+  let result = Telemetry.prototype.telemetryInfo;
+
+  for (let [histId, value] of Object.entries(result)) {
+    if (histId.startsWith("DEVTOOLS_INSPECTOR_") ||
+        !histId.includes(histIdFocus)) {
+      // Inspector stats are tested in
+      // browser_telemetry_toolboxtabs_{toolname}.js so we skip them here
+      // because we only open the inspector once for this test.
+      continue;
+    }
+
+    if (histId.endsWith("OPENED_COUNT")) {
+      is(value.length, 1, histId + " has one entry");
+
+      let okay = value.every(element => element === true);
+      ok(okay, "All " + histId + " entries are === true");
+    }
+  }
+}
--- a/devtools/client/shared/test/browser_telemetry_button_responsive.js
+++ b/devtools/client/shared/test/browser_telemetry_button_responsive.js
@@ -1,11 +1,13 @@
 /* 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," +
   "<p>browser_telemetry_button_responsive.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 const { ResponsiveUIManager } = Cu.import("resource://devtools/client/responsivedesign/responsivedesign.jsm", {});
--- a/devtools/client/shared/test/browser_telemetry_button_scratchpad.js
+++ b/devtools/client/shared/test/browser_telemetry_button_scratchpad.js
@@ -1,11 +1,13 @@
 /* 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," +
   "<p>browser_telemetry_button_scratchpad.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
@@ -43,17 +45,18 @@ function trackScratchpadWindows() {
 
           if (win.Scratchpad) {
             win.Scratchpad.addObserver({
               onReady: function () {
                 win.Scratchpad.removeObserver(this);
                 numScratchpads++;
                 win.close();
 
-                info("another scratchpad was opened and closed, count is now " + numScratchpads);
+                info("another scratchpad was opened and closed, " +
+                     `count is now ${numScratchpads}`);
 
                 if (numScratchpads === 4) {
                   Services.ww.unregisterNotification(observer);
                   info("4 scratchpads have been opened and closed, checking results");
                   resolve();
                 }
               },
             });
--- a/devtools/client/shared/test/browser_telemetry_sidebar.js
+++ b/devtools/client/shared/test/browser_telemetry_sidebar.js
@@ -1,11 +1,13 @@
 /* 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,<p>browser_telemetry_sidebar.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
   yield addTab(TEST_URI);
--- a/devtools/client/shared/test/browser_telemetry_toolbox.js
+++ b/devtools/client/shared/test/browser_telemetry_toolbox.js
@@ -1,11 +1,13 @@
 /* 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," +
   "<p>browser_telemetry_toolbox.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
--- a/devtools/client/shared/test/browser_telemetry_toolboxtabs_canvasdebugger.js
+++ b/devtools/client/shared/test/browser_telemetry_toolboxtabs_canvasdebugger.js
@@ -1,11 +1,13 @@
 /* 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," +
   "<p>browser_telemetry_toolboxtabs_canvasdebugger.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
--- a/devtools/client/shared/test/browser_telemetry_toolboxtabs_inspector.js
+++ b/devtools/client/shared/test/browser_telemetry_toolboxtabs_inspector.js
@@ -1,11 +1,13 @@
 /* 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," +
   "<p>browser_telemetry_toolboxtabs_inspector.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
--- a/devtools/client/shared/test/browser_telemetry_toolboxtabs_jsdebugger.js
+++ b/devtools/client/shared/test/browser_telemetry_toolboxtabs_jsdebugger.js
@@ -1,11 +1,13 @@
 /* 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," +
   "<p>browser_telemetry_toolboxtabs_jsdebugger.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
--- a/devtools/client/shared/test/browser_telemetry_toolboxtabs_jsprofiler.js
+++ b/devtools/client/shared/test/browser_telemetry_toolboxtabs_jsprofiler.js
@@ -1,12 +1,15 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-const TEST_URI = "data:text/html;charset=utf-8,<p>browser_telemetry_toolboxtabs_jsprofiler.js</p>";
+"use strict";
+
+const TEST_URI = "data:text/html;charset=utf-8," +
+  "<p>browser_telemetry_toolboxtabs_jsprofiler.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
   yield addTab(TEST_URI);
   let Telemetry = loadTelemetryAndRecordLogs();
--- a/devtools/client/shared/test/browser_telemetry_toolboxtabs_netmonitor.js
+++ b/devtools/client/shared/test/browser_telemetry_toolboxtabs_netmonitor.js
@@ -1,12 +1,15 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-const TEST_URI = "data:text/html;charset=utf-8,<p>browser_telemetry_toolboxtabs_netmonitor.js</p>";
+"use strict";
+
+const TEST_URI = "data:text/html;charset=utf-8," +
+  "<p>browser_telemetry_toolboxtabs_netmonitor.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
   yield addTab(TEST_URI);
   let Telemetry = loadTelemetryAndRecordLogs();
--- a/devtools/client/shared/test/browser_telemetry_toolboxtabs_options.js
+++ b/devtools/client/shared/test/browser_telemetry_toolboxtabs_options.js
@@ -1,12 +1,15 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-const TEST_URI = "data:text/html;charset=utf-8,<p>browser_telemetry_toolboxtabs_options.js</p>";
+"use strict";
+
+const TEST_URI = "data:text/html;charset=utf-8," +
+  "<p>browser_telemetry_toolboxtabs_options.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
   yield addTab(TEST_URI);
   let Telemetry = loadTelemetryAndRecordLogs();
--- a/devtools/client/shared/test/browser_telemetry_toolboxtabs_shadereditor.js
+++ b/devtools/client/shared/test/browser_telemetry_toolboxtabs_shadereditor.js
@@ -1,32 +1,37 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 //
 // Whitelisting this test.
 // As part of bug 1077403, the leaking uncaught rejection should be fixed.
 //
-thisTestLeaksUncaughtRejectionsAndShouldBeFixed("Error: Shader Editor is still waiting for a WebGL context to be created.");
+thisTestLeaksUncaughtRejectionsAndShouldBeFixed(
+  "Error: Shader Editor is still waiting for a WebGL context to be created.");
 
-const TEST_URI = "data:text/html;charset=utf-8,<p>browser_telemetry_toolboxtabs_shadereditor.js</p>";
+const TEST_URI = "data:text/html;charset=utf-8," +
+  "<p>browser_telemetry_toolboxtabs_shadereditor.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
+const TOOL_PREF = "devtools.shadereditor.enabled";
 
 add_task(function* () {
   info("Active the sharer editor");
-  let originalPref = Services.prefs.getBoolPref("devtools.shadereditor.enabled");
-  Services.prefs.setBoolPref("devtools.shadereditor.enabled", true);
+  let originalPref = Services.prefs.getBoolPref(TOOL_PREF);
+  Services.prefs.setBoolPref(TOOL_PREF, true);
 
   yield addTab(TEST_URI);
   let Telemetry = loadTelemetryAndRecordLogs();
 
   yield openAndCloseToolbox(2, TOOL_DELAY, "shadereditor");
   checkTelemetryResults(Telemetry);
 
   stopRecordingTelemetryLogs(Telemetry);
   gBrowser.removeCurrentTab();
 
   info("De-activate the sharer editor");
-  Services.prefs.setBoolPref("devtools.shadereditor.enabled", originalPref);
+  Services.prefs.setBoolPref(TOOL_PREF, originalPref);
 });
--- a/devtools/client/shared/test/browser_telemetry_toolboxtabs_storage.js
+++ b/devtools/client/shared/test/browser_telemetry_toolboxtabs_storage.js
@@ -1,12 +1,15 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-const TEST_URI = "data:text/html;charset=utf-8,<p>browser_telemetry_toolboxtabs_storage.js</p>";
+"use strict";
+
+const TEST_URI = "data:text/html;charset=utf-8," +
+  "<p>browser_telemetry_toolboxtabs_storage.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 1000;
 
 add_task(function* () {
   info("Activating the storage inspector");
   Services.prefs.setBoolPref("devtools.storage.enabled", true);
--- a/devtools/client/shared/test/browser_telemetry_toolboxtabs_styleeditor.js
+++ b/devtools/client/shared/test/browser_telemetry_toolboxtabs_styleeditor.js
@@ -1,12 +1,15 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-const TEST_URI = "data:text/html;charset=utf-8,<p>browser_telemetry_toolboxtabs_styleeditor.js</p>";
+"use strict";
+
+const TEST_URI = "data:text/html;charset=utf-8," +
+  "<p>browser_telemetry_toolboxtabs_styleeditor.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
   yield addTab(TEST_URI);
   let Telemetry = loadTelemetryAndRecordLogs();
--- a/devtools/client/shared/test/browser_telemetry_toolboxtabs_webaudioeditor.js
+++ b/devtools/client/shared/test/browser_telemetry_toolboxtabs_webaudioeditor.js
@@ -1,12 +1,15 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-const TEST_URI = "data:text/html;charset=utf-8,<p>browser_telemetry_toolboxtabs_webaudioeditor.js</p>";
+"use strict";
+
+const TEST_URI = "data:text/html;charset=utf-8," +
+  "<p>browser_telemetry_toolboxtabs_webaudioeditor.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
   info("Activating the webaudioeditor");
   let originalPref = Services.prefs.getBoolPref("devtools.webaudioeditor.enabled");
--- a/devtools/client/shared/test/browser_telemetry_toolboxtabs_webconsole.js
+++ b/devtools/client/shared/test/browser_telemetry_toolboxtabs_webconsole.js
@@ -1,12 +1,15 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-const TEST_URI = "data:text/html;charset=utf-8,<p>browser_telemetry_toolboxtabs_styleeditor_webconsole.js</p>";
+"use strict";
+
+const TEST_URI = "data:text/html;charset=utf-8," +
+  "<p>browser_telemetry_toolboxtabs_styleeditor_webconsole.js</p>";
 
 // Because we need to gather stats for the period of time that a tool has been
 // opened we make use of setTimeout() to create tool active times.
 const TOOL_DELAY = 200;
 
 add_task(function* () {
   yield addTab(TEST_URI);
   let Telemetry = loadTelemetryAndRecordLogs();
--- a/devtools/client/shared/test/browser_templater_basic.js
+++ b/devtools/client/shared/test/browser_templater_basic.js
@@ -1,77 +1,76 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that the DOM Template engine works properly
 
 /*
  * These tests run both in Mozilla/Mochitest and plain browsers (as does
  * domtemplate)
  * We should endevour to keep the source in sync.
  */
 
 const {template} = require("devtools/shared/gcli/templater");
 
 const TEST_URI = TEST_URI_ROOT + "browser_templater_basic.html";
 
 var test = Task.async(function* () {
   yield addTab("about:blank");
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [host,, doc] = yield createHost("bottom", TEST_URI);
 
   info("Starting DOM Templater Tests");
   runTest(0, host, doc);
 });
 
 function runTest(index, host, doc) {
-  var options = tests[index] = tests[index]();
-  var holder = doc.createElement("div");
+  let options = tests[index] = tests[index]();
+  let holder = doc.createElement("div");
   holder.id = options.name;
-  var body = doc.body;
+  let body = doc.body;
   body.appendChild(holder);
   holder.innerHTML = options.template;
 
   info("Running " + options.name);
   template(holder, options.data, options.options);
 
   if (typeof options.result == "string") {
     is(holder.innerHTML, options.result, options.name);
-  }
-  else {
+  } else {
     ok(holder.innerHTML.match(options.result) != null,
        options.name + " result='" + holder.innerHTML + "'");
   }
 
   if (options.also) {
     options.also(options);
   }
 
   function runNextTest() {
     index++;
     if (index < tests.length) {
       runTest(index, host, doc);
-    }
-    else {
+    } else {
       finished(host);
     }
   }
 
   if (options.later) {
-    var ais = is.bind(this);
+    let ais = is.bind(this);
 
-    function createTester(holder, options) {
+    function createTester(testHolder, testOptions) {
       return () => {
-        ais(holder.innerHTML, options.later, options.name + " later");
+        ais(testHolder.innerHTML, testOptions.later, testOptions.name + " later");
         runNextTest();
       };
     }
 
     executeSoon(createTester(holder, options));
-  }
-  else {
+  } else {
     runNextTest();
   }
 }
 
 function finished(host) {
   host.destroy();
   gBrowser.removeCurrentTab();
   info("Finishing DOM Templater Tests");
@@ -83,203 +82,205 @@ function finished(host) {
  * Why have an array of functions that return data rather than just an array
  * of the data itself? Some of these tests contain calls to delayReply() which
  * sets up async processing using executeSoon(). Since the execution of these
  * tests is asynchronous, the delayed reply will probably arrive before the
  * test is executed, making the test be synchronous. So we wrap the data in a
  * function so we only set it up just before we use it.
  */
 var tests = [
-  function () { return {
+  () => ({
     name: "simpleNesting",
     template: '<div id="ex1">${nested.value}</div>',
-    data: { nested:{ value:"pass 1" } },
+    data: { nested: { value: "pass 1" } },
     result: '<div id="ex1">pass 1</div>'
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "returnDom",
     template: '<div id="ex2">${__element.ownerDocument.createTextNode(\'pass 2\')}</div>',
     options: { allowEval: true },
     data: {},
     result: '<div id="ex2">pass 2</div>'
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "srcChange",
     template: '<img _src="${fred}" id="ex3">',
-    data: { fred:"green.png" },
+    data: { fred: "green.png" },
     result: /<img( id="ex3")? src="green.png"( id="ex3")?>/
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "ifTrue",
     template: '<p if="${name !== \'jim\'}">hello ${name}</p>',
     options: { allowEval: true },
     data: { name: "fred" },
     result: "<p>hello fred</p>"
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "ifFalse",
     template: '<p if="${name !== \'jim\'}">hello ${name}</p>',
     options: { allowEval: true },
     data: { name: "jim" },
     result: ""
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "simpleLoop",
     template: '<p foreach="index in ${[ 1, 2, 3 ]}">${index}</p>',
     options: { allowEval: true },
     data: {},
     result: "<p>1</p><p>2</p><p>3</p>"
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "loopElement",
     template: '<loop foreach="i in ${array}">${i}</loop>',
     data: { array: [ 1, 2, 3 ] },
     result: "123"
-  };},
+  }),
 
   // Bug 692028: DOMTemplate memory leak with asynchronous arrays
   // Bug 692031: DOMTemplate async loops do not drop the loop element
-  function () { return {
+  () => ({
     name: "asyncLoopElement",
     template: '<loop foreach="i in ${array}">${i}</loop>',
     data: { array: delayReply([1, 2, 3]) },
     result: "<span></span>",
     later: "123"
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "saveElement",
     template: '<p save="${element}">${name}</p>',
     data: { name: "pass 8" },
     result: "<p>pass 8</p>",
     also: function (options) {
       ok(options.data.element.innerHTML, "pass 9", "saveElement saved");
       delete options.data.element;
     }
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "useElement",
     template: '<p id="pass9">${adjust(__element)}</p>',
     options: { allowEval: true },
     data: {
       adjust: function (element) {
         is("pass9", element.id, "useElement adjust");
         return "pass 9b";
       }
     },
     result: '<p id="pass9">pass 9b</p>'
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "asyncInline",
     template: "${delayed}",
     data: { delayed: delayReply("inline") },
     result: "<span></span>",
     later: "inline"
-  };},
+  }),
 
   // Bug 692028: DOMTemplate memory leak with asynchronous arrays
-  function () { return {
+  () => ({
     name: "asyncArray",
     template: '<p foreach="i in ${delayed}">${i}</p>',
     data: { delayed: delayReply([1, 2, 3]) },
     result: "<span></span>",
     later: "<p>1</p><p>2</p><p>3</p>"
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "asyncMember",
     template: '<p foreach="i in ${delayed}">${i}</p>',
     data: { delayed: [delayReply(4), delayReply(5), delayReply(6)] },
     result: "<span></span><span></span><span></span>",
     later: "<p>4</p><p>5</p><p>6</p>"
-  };},
+  }),
 
   // Bug 692028: DOMTemplate memory leak with asynchronous arrays
-  function () { return {
+  () => ({
     name: "asyncBoth",
     template: '<p foreach="i in ${delayed}">${i}</p>',
     data: {
       delayed: delayReply([
         delayReply(4),
         delayReply(5),
         delayReply(6)
       ])
     },
     result: "<span></span>",
     later: "<p>4</p><p>5</p><p>6</p>"
-  };},
+  }),
 
   // Bug 701762: DOMTemplate fails when ${foo()} returns undefined
-  function () { return {
+  () => ({
     name: "functionReturningUndefiend",
     template: "<p>${foo()}</p>",
     options: { allowEval: true },
     data: {
       foo: function () {}
     },
     result: "<p>undefined</p>"
-  };},
+  }),
 
   // Bug 702642: DOMTemplate is relatively slow when evaluating JS ${}
-  function () { return {
+  () => ({
     name: "propertySimple",
     template: "<p>${a.b.c}</p>",
     data: { a: { b: { c: "hello" } } },
     result: "<p>hello</p>"
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "propertyPass",
     template: "<p>${Math.max(1, 2)}</p>",
     options: { allowEval: true },
     result: "<p>2</p>"
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "propertyFail",
     template: "<p>${Math.max(1, 2)}</p>",
     result: "<p>${Math.max(1, 2)}</p>"
-  };},
+  }),
 
   // Bug 723431: DOMTemplate should allow customisation of display of
   // null/undefined values
-  function () { return {
+  () => ({
     name: "propertyUndefAttrFull",
     template: "<p>${nullvar}|${undefinedvar1}|${undefinedvar2}</p>",
     data: { nullvar: null, undefinedvar1: undefined },
     result: "<p>null|undefined|undefined</p>"
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "propertyUndefAttrBlank",
     template: "<p>${nullvar}|${undefinedvar1}|${undefinedvar2}</p>",
     data: { nullvar: null, undefinedvar1: undefined },
     options: { blankNullUndefined: true },
     result: "<p>||</p>"
-  };},
+  }),
 
-  function () { return {
+  /* eslint-disable max-len */
+  () => ({
     name: "propertyUndefAttrFull",
     template: '<div><p value="${nullvar}"></p><p value="${undefinedvar1}"></p><p value="${undefinedvar2}"></p></div>',
     data: { nullvar: null, undefinedvar1: undefined },
     result: '<div><p value="null"></p><p value="undefined"></p><p value="undefined"></p></div>'
-  };},
+  }),
 
-  function () { return {
+  () => ({
     name: "propertyUndefAttrBlank",
     template: '<div><p value="${nullvar}"></p><p value="${undefinedvar1}"></p><p value="${undefinedvar2}"></p></div>',
     data: { nullvar: null, undefinedvar1: undefined },
     options: { blankNullUndefined: true },
     result: '<div><p value=""></p><p value=""></p><p value=""></p></div>'
-  };}
+  })
+  /* eslint-enable max-len */
 ];
 
 function delayReply(data) {
   return new Promise(resolve => resolve(data));
 }
--- a/devtools/client/shared/test/browser_theme.js
+++ b/devtools/client/shared/test/browser_theme.js
@@ -1,15 +1,17 @@
 /* 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";
+
 // Tests that theme utilities work
 
-var {getColor, getTheme, setTheme} = require("devtools/client/shared/theme");
+const {getColor, getTheme, setTheme} = require("devtools/client/shared/theme");
 
 add_task(function* () {
   testGetTheme();
   testSetTheme();
   testGetColor();
   testColorExistence();
 });
 
@@ -33,66 +35,64 @@ function testSetTheme() {
     is(pref, "devtools.theme",
       "The 'pref-changed' event triggered by setTheme has correct pref.");
     is(oldValue, originalTheme,
       "The 'pref-changed' event triggered by setTheme has correct oldValue.");
     is(newValue, "dark",
       "The 'pref-changed' event triggered by setTheme has correct newValue.");
   });
   setTheme("dark");
-  is(Services.prefs.getCharPref("devtools.theme"), "dark", "setTheme() correctly sets dark theme.");
+  is(Services.prefs.getCharPref("devtools.theme"), "dark",
+     "setTheme() correctly sets dark theme.");
   setTheme("light");
-  is(Services.prefs.getCharPref("devtools.theme"), "light", "setTheme() correctly sets light theme.");
+  is(Services.prefs.getCharPref("devtools.theme"), "light",
+     "setTheme() correctly sets light theme.");
   setTheme("firebug");
-  is(Services.prefs.getCharPref("devtools.theme"), "firebug", "setTheme() correctly sets firebug theme.");
+  is(Services.prefs.getCharPref("devtools.theme"), "firebug",
+     "setTheme() correctly sets firebug theme.");
   setTheme("unknown");
-  is(Services.prefs.getCharPref("devtools.theme"), "unknown", "setTheme() correctly sets an unknown theme.");
+  is(Services.prefs.getCharPref("devtools.theme"), "unknown",
+     "setTheme() correctly sets an unknown theme.");
   Services.prefs.setCharPref("devtools.theme", originalTheme);
 }
 
 function testGetColor() {
   let BLUE_DARK = "#46afe3";
   let BLUE_LIGHT = "#0088cc";
   let BLUE_FIREBUG = "#3455db";
   let originalTheme = getTheme();
 
   setTheme("dark");
   is(getColor("highlight-blue"), BLUE_DARK, "correctly gets color for enabled theme.");
   setTheme("light");
   is(getColor("highlight-blue"), BLUE_LIGHT, "correctly gets color for enabled theme.");
   setTheme("firebug");
   is(getColor("highlight-blue"), BLUE_FIREBUG, "correctly gets color for enabled theme.");
   setTheme("metal");
-  is(getColor("highlight-blue"), BLUE_LIGHT, "correctly uses light for default theme if enabled theme not found");
+  is(getColor("highlight-blue"), BLUE_LIGHT,
+     "correctly uses light for default theme if enabled theme not found");
 
-  is(getColor("highlight-blue", "dark"), BLUE_DARK, "if provided and found, uses the provided theme.");
-  is(getColor("highlight-blue", "firebug"), BLUE_FIREBUG, "if provided and found, uses the provided theme.");
-  is(getColor("highlight-blue", "metal"), BLUE_LIGHT, "if provided and not found, defaults to light theme.");
+  is(getColor("highlight-blue", "dark"), BLUE_DARK,
+     "if provided and found, uses the provided theme.");
+  is(getColor("highlight-blue", "firebug"), BLUE_FIREBUG,
+     "if provided and found, uses the provided theme.");
+  is(getColor("highlight-blue", "metal"), BLUE_LIGHT,
+     "if provided and not found, defaults to light theme.");
   is(getColor("somecomponents"), null, "if a type cannot be found, should return null.");
 
   setTheme(originalTheme);
 }
 
 function testColorExistence() {
-  var vars = ["body-background", "sidebar-background", "contrast-background", "tab-toolbar-background",
-   "toolbar-background", "selection-background", "selection-color",
-   "selection-background-semitransparent", "splitter-color", "comment", "body-color",
-   "body-color-alt", "content-color1", "content-color2", "content-color3",
+  const vars = ["body-background", "sidebar-background", "contrast-background",
+   "tab-toolbar-background", "toolbar-background", "selection-background",
+   "selection-color", "selection-background-semitransparent", "splitter-color", "comment",
+   "body-color", "body-color-alt", "content-color1", "content-color2", "content-color3",
    "highlight-green", "highlight-blue", "highlight-bluegrey", "highlight-purple",
    "highlight-lightorange", "highlight-orange", "highlight-red", "highlight-pink"
   ];
 
   for (let type of vars) {
     ok(getColor(type, "light"), `${type} is a valid color in light theme`);
     ok(getColor(type, "dark"), `${type} is a valid color in light theme`);
     ok(getColor(type, "firebug"), `${type} is a valid color in light theme`);
   }
 }
-
-function isColor(s) {
-  // Regexes from Heather Arthur's `color-string`
-  // https://github.com/harthur/color-string
-  // MIT License
-  return /^#([a-fA-F0-9]{3})$/.test(s) ||
-         /^#([a-fA-F0-9]{6})$/.test(s) ||
-         /^rgba?\(\s*(\d+)\s*,\s*(\d+)\s*,\s*(\d+)\s*(?:,\s*([\d\.]+)\s*)?\)$/.test(s) ||
-         /^rgba?\(\s*([\d\.]+)\%\s*,\s*([\d\.]+)\%\s*,\s*([\d\.]+)\%\s*(?:,\s*([\d\.]+)\s*)?\)$/.test(s);
-}
--- a/devtools/client/shared/test/browser_theme_switching.js
+++ b/devtools/client/shared/test/browser_theme_switching.js
@@ -1,13 +1,13 @@
 /* vim: set ts=2 et sw=2 tw=80: */
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
-var toolbox;
+"use strict";
 
 add_task(function* () {
   let target = TargetFactory.forTab(gBrowser.selectedTab);
   let toolbox = yield gDevTools.showToolbox(target);
   let doc = toolbox.doc;
   let root = doc.documentElement;
 
   let platform = root.getAttribute("platform");
@@ -19,32 +19,35 @@ add_task(function* () {
   ok(root.classList.contains(className),
      ":root has " + className + " class (current theme)");
 
   // Convert the xpath result into an array of strings
   // like `href="{URL}" type="text/css"`
   let sheetsIterator = doc.evaluate("processing-instruction('xml-stylesheet')",
                        doc, null, XPathResult.ANY_TYPE, null);
   let sheetsInDOM = [];
+
+  /* eslint-disable no-cond-assign */
   let sheet;
   while (sheet = sheetsIterator.iterateNext()) {
     sheetsInDOM.push(sheet.data);
   }
+  /* eslint-enable no-cond-assign */
 
   let sheetsFromTheme = gDevTools.getThemeDefinition(theme).stylesheets;
   info("Checking for existence of " + sheetsInDOM.length + " sheets");
-  for (let sheet of sheetsFromTheme) {
-    ok(sheetsInDOM.some(s=>s.includes(sheet)), "There is a stylesheet for " + sheet);
+  for (let themeSheet of sheetsFromTheme) {
+    ok(sheetsInDOM.some(s => s.includes(themeSheet)),
+       "There is a stylesheet for " + themeSheet);
   }
 
   yield toolbox.destroy();
 });
 
 function getPlatform() {
   let {OS} = Services.appinfo;
   if (OS == "WINNT") {
     return "win";
   } else if (OS == "Darwin") {
     return "mac";
-  } else {
-    return "linux";
   }
+  return "linux";
 }
--- a/devtools/client/shared/test/browser_toolbar_basic.html
+++ b/devtools/client/shared/test/browser_toolbar_basic.html
@@ -4,17 +4,20 @@
 
 <html>
 <head>
   <meta charset="UTF-8">
   <title>Developer Toolbar Tests</title>
   <style type="text/css">
   #single { color: red; }
   </style>
-  <script type="text/javascript">var a=1;</script>
+  <script type="text/javascript">
+  /* eslint-disable */
+  var a = 1;
+  </script>
 </head>
 <body>
 
 <p id=single>
 1
 </p>
 
 <p class=twin>
@@ -23,13 +26,15 @@ 2a
 
 <p class=twin>
 2b
 </p>
 
 <style>
 .twin { color: blue; }
 </style>
-<script>var b=2;</script>
+<script>
+/* eslint-disable */
+var b = 2;
+</script>
 
 </body>
 </html>
-
--- a/devtools/client/shared/test/browser_toolbar_basic.js
+++ b/devtools/client/shared/test/browser_toolbar_basic.js
@@ -1,11 +1,13 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that the developer toolbar works properly
 
 const TEST_URI = TEST_URI_ROOT + "browser_toolbar_basic.html";
 
 add_task(function* () {
   info("Starting browser_toolbar_basic.js");
   yield addTab(TEST_URI);
 
@@ -19,17 +21,17 @@ add_task(function* () {
   let close = document.getElementById("developer-toolbar-closebutton");
   ok(close, "Close button exists");
 
   let toggleToolbox =
     document.getElementById("menu_devToolbox");
   ok(!isChecked(toggleToolbox), "toggle toolbox button is not checked");
 
   let target = TargetFactory.forTab(gBrowser.selectedTab);
-  let toolbox = yield gDevTools.showToolbox(target, "inspector");
+  yield gDevTools.showToolbox(target, "inspector");
   ok(isChecked(toggleToolbox), "toggle toolbox button is checked");
 
   yield addTab("about:blank");
   info("Opened a new tab");
 
   ok(!isChecked(toggleToolbox), "toggle toolbox button is not checked");
 
   gBrowser.removeCurrentTab();
--- a/devtools/client/shared/test/browser_toolbar_tooltip.js
+++ b/devtools/client/shared/test/browser_toolbar_tooltip.js
@@ -1,18 +1,22 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Tests that the developer toolbar works properly
 
 //
 // Whitelisting this test.
 // As part of bug 1077403, the leaking uncaught rejection should be fixed.
 //
-thisTestLeaksUncaughtRejectionsAndShouldBeFixed("Protocol error (unknownError): Error: Got an invalid root window in DocumentWalker");
+thisTestLeaksUncaughtRejectionsAndShouldBeFixed(
+  "Protocol error (unknownError): Error: Got an invalid root window in DocumentWalker"
+);
 
 const TEST_URI = "data:text/html;charset=utf-8,<p>Tooltip Tests</p>";
 const PREF_DEVTOOLS_THEME = "devtools.theme";
 
 registerCleanupFunction(() => {
   // Set preferences back to their original values
   Services.prefs.clearUserPref(PREF_DEVTOOLS_THEME);
 });
@@ -70,17 +74,16 @@ add_task(function* testThemes() {
   Services.prefs.setCharPref(PREF_DEVTOOLS_THEME, "light");
 
   yield DeveloperToolbar.inputter.setInput("");
   yield DeveloperToolbar.inputter.setInput("help help");
   is(tooltipPanel.document.documentElement.getAttribute("devtoolstheme"),
      "light", "Tooltip panel has correct theme");
 });
 
-
 add_task(function* hideToolbar() {
   info("Ending browser_toolbar_tooltip.js");
   yield DeveloperToolbar.inputter.setInput("");
 
   ok(DeveloperToolbar.visible, "DeveloperToolbar is visible in hideToolbar");
 
   info("Hide toolbar");
   let hidePromise = observeOnce(DeveloperToolbar.NOTIFICATIONS.HIDE);
@@ -99,10 +102,10 @@ function getLeftMargin() {
 
 function observeOnce(topic, ownsWeak = false) {
   return new Promise(function (resolve, reject) {
     let resolver = function (subject) {
       Services.obs.removeObserver(resolver, topic);
       resolve(subject);
     };
     Services.obs.addObserver(resolver, topic, ownsWeak);
-  }.bind(this));
+  });
 }
--- a/devtools/client/shared/test/browser_toolbar_webconsole_errors_count.html
+++ b/devtools/client/shared/test/browser_toolbar_webconsole_errors_count.html
@@ -1,18 +1,19 @@
 <!DOCTYPE HTML>
 <!-- Any copyright is dedicated to the Public Domain.
      http://creativecommons.org/publicdomain/zero/1.0/ -->
 <html>
 <head>
   <meta charset="UTF-8">
   <title>Developer Toolbar Tests - errors count in the Web Console button</title>
   <script type="text/javascript">
+    "use strict";
     console.log("foobarBug762996consoleLog");
-    window.onload = function() {
+    window.onload = function () {
       window.foobarBug762996load();
     };
     window.foobarBug762996a();
   </script>
   <script type="text/javascript">
     window.foobarBug762996b();
   </script>
 </head>
--- a/devtools/client/shared/test/browser_toolbar_webconsole_errors_count.js
+++ b/devtools/client/shared/test/browser_toolbar_webconsole_errors_count.js
@@ -1,25 +1,28 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+/* eslint-disable mozilla/no-cpows-in-tests */
+
+"use strict";
+
 // Tests that the developer toolbar errors count works properly.
 
 // Use the old webconsole since this is directly accessing old DOM, and
 // the error count isn't reset when pressing the clear button in new one
 // See Bug 1304794.
 Services.prefs.setBoolPref("devtools.webconsole.new-frontend-enabled", false);
 registerCleanupFunction(function* () {
   Services.prefs.clearUserPref("devtools.webconsole.new-frontend-enabled");
 });
 
 function test() {
   const TEST_URI = TEST_URI_ROOT + "browser_toolbar_webconsole_errors_count.html";
 
-
   let tab1, tab2, webconsole;
 
   Services.prefs.setBoolPref("javascript.options.strict", true);
 
   registerCleanupFunction(() => {
     Services.prefs.clearUserPref("javascript.options.strict");
   });
 
@@ -29,18 +32,17 @@ function test() {
   function openToolbar(tab) {
     tab1 = tab;
     ignoreAllUncaughtExceptions(false);
 
     expectUncaughtException();
 
     if (!DeveloperToolbar.visible) {
       DeveloperToolbar.show(true).then(onOpenToolbar);
-    }
-    else {
+    } else {
       onOpenToolbar();
     }
   }
 
   function onOpenToolbar() {
     ok(DeveloperToolbar.visible, "DeveloperToolbar is visible");
     webconsole = document.getElementById("developer-toolbar-toolbox-button");
 
@@ -97,17 +99,18 @@ function test() {
     });
   }
 
   function onWebConsoleOpen(hud) {
     dump("lolz!!\n");
     waitForValue({
       name: "web console shows the page errors",
       validator: function () {
-        return hud.outputNode.querySelectorAll(".message[category=exception][severity=error]").length;
+        let selector = ".message[category=exception][severity=error]";
+        return hud.outputNode.querySelectorAll(selector).length;
       },
       value: 4,
       success: checkConsoleOutput.bind(null, hud),
       failure: () => {
         finish();
       },
     });
   }
@@ -128,17 +131,18 @@ function test() {
 
     expectUncaughtException();
     let button = content.document.querySelector("button");
     EventUtils.synthesizeMouse(button, 2, 2, {}, content);
 
     waitForButtonUpdate({
       name: "button shows one more error after another click in page",
       errors: 5,
-      warnings: 1, // warnings are not repeated by the js engine
+      // warnings are not repeated by the js engine
+      warnings: 1,
       callback: () => waitForValue(waitForNewError),
     });
 
     let waitForNewError = {
       name: "the Web Console displays the new error",
       validator: function () {
         return hud.outputNode.textContent.indexOf("foobarBug762996click") > -1;
       },
@@ -178,17 +182,18 @@ function test() {
         warnings: 0,
         callback: waitForValue.bind(null, waitForConsoleOutputAfterReload),
       });
     }
 
     let waitForConsoleOutputAfterReload = {
       name: "the Web Console displays the correct number of errors after reload",
       validator: function () {
-        return hud.outputNode.querySelectorAll(".message[category=exception][severity=error]").length;
+        let selector = ".message[category=exception][severity=error]";
+        return hud.outputNode.querySelectorAll(selector).length;
       },
       value: 3,
       success: function () {
         isnot(hud.outputNode.textContent.indexOf("foobarBug762996load"), -1,
               "foobarBug762996load found in console output after page reload");
         testEnd();
       },
       failure: testEnd,
@@ -238,15 +243,14 @@ function test() {
       DeveloperToolbar.on("errors-counter-updated", function onUpdate(event) {
         if (check()) {
           DeveloperToolbar.off(event, onUpdate);
         }
       });
     }
   }
 
-  function openWebConsole(tab, callback)
-  {
+  function openWebConsole(tab, callback) {
     let target = TargetFactory.forTab(tab);
     gDevTools.showToolbox(target, "webconsole").then((toolbox) =>
       callback(toolbox.getCurrentPanel().hud));
   }
 }
--- a/devtools/client/shared/test/browser_treeWidget_keyboard_interaction.js
+++ b/devtools/client/shared/test/browser_treeWidget_keyboard_interaction.js
@@ -1,12 +1,14 @@
 /* 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";
+
 // Tests that keyboard interaction works fine with the tree widget
 
 const TEST_URI = "data:text/html;charset=utf-8,<head>" +
   "<link rel='stylesheet' type='text/css' href='chrome://devtools/skin/widg" +
   "ets.css'></head><body><div></div><span></span></body>";
 const {TreeWidget} = require("devtools/client/shared/widgets/TreeWidget");
 
 add_task(function* () {
--- a/devtools/client/shared/test/browser_treeWidget_mouse_interaction.js
+++ b/devtools/client/shared/test/browser_treeWidget_mouse_interaction.js
@@ -1,22 +1,24 @@
 /* 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";
+
 // Tests that mouse interaction works fine with tree widget
 
 const TEST_URI = "data:text/html;charset=utf-8,<head>" +
   "<link rel='stylesheet' type='text/css' href='chrome://devtools/skin/widg" +
   "ets.css'></head><body><div></div><span></span></body>";
 const {TreeWidget} = require("devtools/client/shared/widgets/TreeWidget");
 
 add_task(function* () {
   yield addTab("about:blank");
-  let [host, win, doc] = yield createHost("bottom", TEST_URI);
+  let [host,, doc] = yield createHost("bottom", TEST_URI);
 
   let tree = new TreeWidget(doc.querySelector("div"), {
     defaultType: "store"
   });
 
   populateTree(tree, doc);
   yield testMouseInteraction(tree);
 
@@ -90,46 +92,44 @@ function* testMouseInteraction(tree) {
 
   tree.once("select", pass);
   let node = tree.root.children.firstChild.firstChild;
   info("clicking on first top level item");
   event = defer();
   ok(!node.classList.contains("theme-selected"),
      "Node should not have selected class before clicking");
   click(node);
-  let [name, data, attachment] = yield event.promise;
+  let [, data, attachment] = yield event.promise;
   ok(node.classList.contains("theme-selected"),
      "Node has selected class after click");
   is(data[0], "level1.2", "Correct tree path is emitted");
   ok(attachment && attachment.foo, "Correct attachment is emitted");
   is(attachment.foo, "bar", "Correct attachment value is emitted");
 
   info("clicking second top level item with children to check if it expands");
   let node2 = tree.root.children.firstChild.nextSibling.firstChild;
   event = defer();
   // node should not have selected class
   ok(!node2.classList.contains("theme-selected"),
      "New node should not have selected class before clicking");
   ok(!node2.hasAttribute("expanded"), "New node is not expanded before clicking");
   tree.once("select", pass);
   click(node2);
-  [name, data, attachment] = yield event.promise;
+  [, data, attachment] = yield event.promise;
   ok(node2.classList.contains("theme-selected"),
      "New node has selected class after clicking");
   is(data[0], "level1", "Correct tree path is emitted for new node");
   ok(!attachment, "null attachment should be emitted for new node");
   ok(node2.hasAttribute("expanded"), "New node expanded after click");
 
   ok(!node.classList.contains("theme-selected"),
      "Old node should not have selected class after the click on new node");
 
-
   // clicking again should just collapse
   // this will not emit "select" event
   event = defer();
-  node2.addEventListener("click", function onClick() {
-    node2.removeEventListener("click", onClick);
+  node2.addEventListener("click", () => {
     executeSoon(() => event.resolve(null));
-  });
+  }, { once: true });
   click(node2);
   yield event.promise;
   ok(!node2.hasAttribute("expanded"), "New node collapsed after click again");
 }
--- a/devtools/client/shared/test/helper_color_data.js
+++ b/devtools/client/shared/test/helper_color_data.js
@@ -1,8 +1,11 @@
+"use strict";
+
+/* eslint-disable max-len */
 function getFixtureColorData() {
   return [
     {authored: "aliceblue", name: "aliceblue", hex: "#f0f8ff", hsl: "hsl(208, 100%, 97.1%)", rgb: "rgb(240, 248, 255)", cycle: 4},
     {authored: "antiquewhite", name: "antiquewhite", hex: "#faebd7", hsl: "hsl(34.3, 77.8%, 91.2%)", rgb: "rgb(250, 235, 215)", cycle: 4},
     {authored: "aqua", name: "aqua", hex: "#0ff", hsl: "hsl(180, 100%, 50%)", rgb: "rgb(0, 255, 255)", cycle: 4},
     {authored: "aquamarine", name: "aquamarine", hex: "#7fffd4", hsl: "hsl(159.8, 100%, 74.9%)", rgb: "rgb(127, 255, 212)", cycle: 4},
     {authored: "azure", name: "azure", hex: "#f0ffff", hsl: "hsl(180, 100%, 97.1%)", rgb: "rgb(240, 255, 255)", cycle: 4},
     {authored: "beige", name: "beige", hex: "#f5f5dc", hsl: "hsl(60, 55.6%, 91.2%)", rgb: "rgb(245, 245, 220)", cycle: 4},
@@ -159,13 +162,14 @@ function getFixtureColorData() {
     {authored: "currentcolor", name: "currentcolor", hex: "currentcolor", hsl: "currentcolor", rgb: "currentcolor", cycle: false},
     {authored: "inherit", name: "inherit", hex: "inherit", hsl: "inherit", rgb: "inherit", cycle: false},
     {authored: "initial", name: "initial", hex: "initial", hsl: "initial", rgb: "initial", cycle: false},
     {authored: "invalidColor", name: "", hex: "", hsl: "", rgb: "", cycle: false},
     {authored: "transparent", name: "transparent", hex: "transparent", hsl: "transparent", rgb: "transparent", cycle: false},
     {authored: "unset", name: "unset", hex: "unset", hsl: "unset", rgb: "unset", cycle: false},
   ];
 }
+/* eslint-enable max-len */
 
 // Allow this function to be shared on mochitests and xpcshell tests.
 if (typeof module === "object") {
   module.exports = getFixtureColorData;
 }
--- a/devtools/client/shared/test/leakhunt.js
+++ b/devtools/client/shared/test/leakhunt.js
@@ -1,68 +1,68 @@
 /* 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";
+
 /**
  * Memory leak hunter. Walks a tree of objects looking for DOM nodes.
  * Usage:
  * leakHunt({
  *   thing: thing,
  *   otherthing: otherthing
  * });
  */
 function leakHunt(root) {
-  var path = [];
-  var seen = [];
+  let path = [];
+  let seen = [];
 
   try {
-    var output = leakHunt.inner(root, path, seen);
+    let output = leakHunt.inner(root, path, seen);
     output.forEach(function (line) {
       dump(line + "\n");
     });
-  }
-  catch (ex) {
+  } catch (ex) {
     dump(ex + "\n");
   }
 }
 
-leakHunt.inner = function LH_inner(root, path, seen) {
-  var prefix = new Array(path.length).join("  ");
+leakHunt.inner = function (root, path, seen) {
+  let prefix = new Array(path.length).join("  ");
 
-  var reply = [];
+  let reply = [];
   function log(msg) {
     reply.push(msg);
   }
 
-  var direct;
+  let direct;
   try {
     direct = Object.keys(root);
-  }
-  catch (ex) {
+  } catch (ex) {
     log(prefix + "  Error enumerating: " + ex);
     return reply;
   }
 
   try {
-    var index = 0;
-    for (var data of root) {
-      var prop = "" + index;
+    let index = 0;
+    for (let data of root) {
+      let prop = "" + index;
       leakHunt.digProperty(prop, data, path, seen, direct, log);
       index++;
     }
+  } catch (ex) {
+    /* Ignore things that are not enumerable */
   }
-  catch (ex) { /* Ignore things that are not enumerable */ }
 
-  for (var prop in root) {
-    var data;
+  for (let prop in root) {
+    let data;
     try {
       data = root[prop];
-    }
-    catch (ex) {
+    } catch (ex) {
       log(prefix + "  " + prop + " = Error: " + ex.toString().substring(0, 30));
       continue;
     }
 
     leakHunt.digProperty(prop, data, path, seen, direct, log);
   }
 
   return reply;
@@ -72,99 +72,94 @@ leakHunt.hide = [ /^string$/, /^number$/
 
 leakHunt.noRecurse = [
   /^string$/, /^number$/, /^boolean$/, /^null/, /^undefined/,
   /^Window$/, /^Document$/,
   /^XULDocument$/, /^XULElement$/,
   /^DOMWindow$/, /^HTMLDocument$/, /^HTML.*Element$/, /^ChromeWindow$/
 ];
 
-leakHunt.digProperty = function LH_digProperty(prop, data, path, seen, direct, log) {
-  var newPath = path.slice();
+leakHunt.digProperty = function (prop, data, path, seen, direct, log) {
+  let newPath = path.slice();
   newPath.push(prop);
-  var prefix = new Array(newPath.length).join("  ");
+  let prefix = new Array(newPath.length).join("  ");
 
-  var recurse = true;
-  var message = leakHunt.getType(data);
+  let recurse = true;
+  let message = leakHunt.getType(data);
 
   if (leakHunt.matchesAnyPattern(message, leakHunt.hide)) {
     return;
   }
 
   if (message === "function" && direct.indexOf(prop) == -1) {
     return;
   }
 
   if (message === "string") {
-    var extra = data.length > 10 ? data.substring(0, 9) + "_" : data;
+    let extra = data.length > 10 ? data.substring(0, 9) + "_" : data;
     message += ' "' + extra.replace(/\n/g, "|") + '"';
     recurse = false;
-  }
-  else if (leakHunt.matchesAnyPattern(message, leakHunt.noRecurse)) {
+  } else if (leakHunt.matchesAnyPattern(message, leakHunt.noRecurse)) {
     message += " (no recurse)";
     recurse = false;
-  }
-  else if (seen.indexOf(data) !== -1) {
+  } else if (seen.indexOf(data) !== -1) {
     message += " (already seen)";
     recurse = false;
   }
 
   if (recurse) {
     seen.push(data);
-    var lines = leakHunt.inner(data, newPath, seen);
+    let lines = leakHunt.inner(data, newPath, seen);
     if (lines.length == 0) {
       if (message !== "function") {
         log(prefix + prop + " = " + message + " { }");
       }
-    }
-    else {
+    } else {
       log(prefix + prop + " = " + message + " {");
       lines.forEach(function (line) {
         log(line);
       });
       log(prefix + "}");
     }
-  }
-  else {
+  } else {
     log(prefix + prop + " = " + message);
   }
 };
 
-leakHunt.matchesAnyPattern = function LH_matchesAnyPattern(str, patterns) {
-  var match = false;
+leakHunt.matchesAnyPattern = function (str, patterns) {
+  let match = false;
   patterns.forEach(function (pattern) {
     if (str.match(pattern)) {
       match = true;
     }
   });
   return match;
 };
 
-leakHunt.getType = function LH_getType(data) {
+leakHunt.getType = function (data) {
   if (data === null) {
     return "null";
   }
   if (data === undefined) {
     return "undefined";
   }
 
-  var type = typeof data;
+  let type = typeof data;
   if (type === "object" || type === "Object") {
     type = leakHunt.getCtorName(data);
   }
 
   return type;
 };
 
-leakHunt.getCtorName = function LH_getCtorName(aObj) {
+leakHunt.getCtorName = function (obj) {
   try {
-    if (aObj.constructor && aObj.constructor.name) {
-      return aObj.constructor.name;
+    if (obj.constructor && obj.constructor.name) {
+      return obj.constructor.name;
     }
-  }
-  catch (ex) {
+  } catch (ex) {
     return "UnknownObject";
   }
 
   // If that fails, use Objects toString which sometimes gives something
   // better than 'Object', and at least defaults to Object if nothing better
-  return Object.prototype.toString.call(aObj).slice(8, -1);
+  return Object.prototype.toString.call(obj).slice(8, -1);
 };
--- a/devtools/client/shared/test/test-actor.js
+++ b/devtools/client/shared/test/test-actor.js
@@ -1,55 +1,60 @@
 /* vim: set ft=javascript ts=2 et sw=2 tw=80: */
 /* Any copyright is dedicated to the Public Domain.
  http://creativecommons.org/publicdomain/zero/1.0/ */
 
+/* exported TestActor, TestActorFront */
+
 "use strict";
 
 // A helper actor for inspector and markupview tests.
 
-var { Cc, Ci, Cu, Cr } = require("chrome");
+const { Cc, Ci, Cu } = require("chrome");
 const {getRect, getElementFromPoint, getAdjustedQuads} = require("devtools/shared/layout/utils");
 const defer = require("devtools/shared/defer");
 const {Task} = require("devtools/shared/task");
 const {isContentStylesheet} = require("devtools/shared/inspector/css-logic");
-var DOMUtils = Cc["@mozilla.org/inspector/dom-utils;1"].getService(Ci.inIDOMUtils);
-var loader = Cc["@mozilla.org/moz/jssubscript-loader;1"]
-            .getService(Ci.mozIJSSubScriptLoader);
+const DOMUtils = Cc["@mozilla.org/inspector/dom-utils;1"].getService(Ci.inIDOMUtils);
+const loader = Cc["@mozilla.org/moz/jssubscript-loader;1"]
+                 .getService(Ci.mozIJSSubScriptLoader);
 
 // Set up a dummy environment so that EventUtils works. We need to be careful to
 // pass a window object into each EventUtils method we call rather than having
 // it rely on the |window| global.
 let EventUtils = {};
 EventUtils.window = {};
 EventUtils.parent = {};
+/* eslint-disable camelcase */
 EventUtils._EU_Ci = Components.interfaces;
 EventUtils._EU_Cc = Components.classes;
+/* eslint-disable camelcase */
 loader.loadSubScript("chrome://mochikit/content/tests/SimpleTest/EventUtils.js", EventUtils);
 
 const protocol = require("devtools/shared/protocol");
-const {Arg, Option, method, RetVal, types} = protocol;
+const {Arg, RetVal} = protocol;
 
-var dumpn = msg => {
+const dumpn = msg => {
   dump(msg + "\n");
 };
 
 /**
  * Get the instance of CanvasFrameAnonymousContentHelper used by a given
  * highlighter actor.
  * The instance provides methods to get/set attributes/text/style on nodes of
  * the highlighter, inserted into the nsCanvasFrame.
  * @see /devtools/server/actors/highlighters.js
  * @param {String} actorID
  */
 function getHighlighterCanvasFrameHelper(conn, actorID) {
   let actor = conn.getActor(actorID);
   if (actor && actor._highlighter) {
     return actor._highlighter.markup;
   }
+  return null;
 }
 
 var testSpec = protocol.generateActorSpec({
   typeName: "testActor",
 
   methods: {
     getNumberOfElementMatches: {
       request: {
@@ -347,16 +352,17 @@ var TestActor = exports.TestActor = prot
    * - {String} actorID The highlighter actor ID
    * @return {String} The value, if found, null otherwise
    */
   getHighlighterAttribute: function (nodeID, name, actorID) {
     let helper = getHighlighterCanvasFrameHelper(this.conn, actorID);
     if (helper) {
       return helper.getAttributeForElement(nodeID, name);
     }
+    return null;
   },
 
   /**
    * Get the textcontent of one of the elements of the box model highlighter,
    * given its ID.
    * @param {String} nodeID The full ID of the element to get the attribute for
    * @param {String} actorID The highlighter actor ID
    * @return {String} The textcontent value
@@ -376,42 +382,37 @@ var TestActor = exports.TestActor = prot
    * @return {Number} The number of box-model highlighters created, or null if the
    * SelectorHighlighter was not found.
    */
   getSelectorHighlighterBoxNb: function (actorID) {
     let highlighter = this.conn.getActor(actorID);
     let {_highlighter: h} = highlighter;
     if (!h || !h._highlighters) {
       return null;
-    } else {
-      return h._highlighters.length;
     }
+    return h._highlighters.length;
   },
 
   /**
    * Subscribe to the box-model highlighter's update event, modify an attribute of
    * the currently highlighted node and send a message when the highlighter has
    * updated.
    * @param {String} the name of the attribute to be changed
    * @param {String} the new value for the attribute
    * @param {String} actorID The highlighter actor ID
    */
   changeHighlightedNodeWaitForUpdate: function (name, value, actorID) {
-    let deferred = defer();
-
-    let highlighter = this.conn.getActor(actorID);
-    let {_highlighter: h} = highlighter;
+    return new Promise(resolve => {
+      let highlighter = this.conn.getActor(actorID);
+      let {_highlighter: h} = highlighter;
 
-    h.once("updated", () => {
-      deferred.resolve();
-    });
+      h.once("updated", resolve);
 
-    h.currentNode.setAttribute(name, value);
-
-    return deferred.promise;
+      h.currentNode.setAttribute(name, value);
+    });
   },
 
   /**
    * Subscribe to a given highlighter event and respond when the event is received.
    * @param {String} event The name of the highlighter event to listen to
    * @param {String} actorID The highlighter actor ID
    */
   waitForHighlighterEvent: function (event, actorID) {
@@ -441,34 +442,30 @@ var TestActor = exports.TestActor = prot
    * Change the zoom level of the page.
    * Optionally subscribe to the box-model highlighter's update event and waiting
    * for it to refresh before responding.
    * @param {Number} level The new zoom level
    * @param {String} actorID Optional. The highlighter actor ID
    */
   changeZoomLevel: function (level, actorID) {
     dumpn("Zooming page to " + level);
-    let deferred = defer();
+    return new Promise(resolve => {
+      if (actorID) {
+        let actor = this.conn.getActor(actorID);
+        let {_highlighter: h} = actor;
+        h.once("updated", resolve);
+      } else {
+        resolve();
+      }
 
-    if (actorID) {
-      let actor = this.conn.getActor(actorID);
-      let {_highlighter: h} = actor;
-      h.once("updated", () => {
-        deferred.resolve();
-      });
-    } else {
-      deferred.resolve();
-    }
-
-    let docShell = this.content.QueryInterface(Ci.nsIInterfaceRequestor)
-                               .getInterface(Ci.nsIWebNavigation)
-                               .QueryInterface(Ci.nsIDocShell);
-    docShell.contentViewer.fullZoom = level;
-
-    return deferred.promise;
+      let docShell = this.content.QueryInterface(Ci.nsIInterfaceRequestor)
+                                 .getInterface(Ci.nsIWebNavigation)
+                                 .QueryInterface(Ci.nsIDocShell);
+      docShell.contentViewer.fullZoom = level;
+    });
   },
 
   assertElementAtPoint: function (x, y, selector) {
     let elementAtPoint = getElementFromPoint(this.content.document, x, y);
     if (!elementAtPoint) {
       throw new Error("Unable to find element at (" + x + ", " + y + ")");
     }
     let node = this._querySelector(selector);
@@ -538,30 +535,27 @@ var TestActor = exports.TestActor = prot
    * @return {Boolean}
    */
   hasPseudoClassLock: function (selector, pseudo) {
     let node = this._querySelector(selector);
     return DOMUtils.hasPseudoClassLock(node, pseudo);
   },
 
   loadAndWaitForCustomEvent: function (url) {
-    let deferred = defer();
-    let self = this;
-    // Wait for DOMWindowCreated first, as listening on the current outerwindow
-    // doesn't allow receiving test-page-processing-done.
-    this.tabActor.chromeEventHandler.addEventListener("DOMWindowCreated", function onWindowCreated() {
-      self.tabActor.chromeEventHandler.removeEventListener("DOMWindowCreated", onWindowCreated);
-      self.content.addEventListener("test-page-processing-done", function onEvent() {
-        self.content.removeEventListener("test-page-processing-done", onEvent);
-        deferred.resolve();
-      });
+    return new Promise(resolve => {
+      // Wait for DOMWindowCreated first, as listening on the current outerwindow
+      // doesn't allow receiving test-page-processing-done.
+      this.tabActor.chromeEventHandler.addEventListener("DOMWindowCreated", () => {
+        this.content.addEventListener(
+          "test-page-processing-done", resolve, { once: true }
+        );
+      }, { once: true });
+
+      this.content.location = url;
     });
-
-    this.content.location = url;
-    return deferred.promise;
   },
 
   hasNode: function (selector) {
     try {
       // _querySelector throws if the node doesn't exists
       this._querySelector(selector);
       return true;
     } catch (e) {
@@ -806,35 +800,43 @@ var TestActorFront = exports.TestActorFr
    * @param {Number} level The new zoom level.
    * @return {Promise} The returned promise will only resolve when the
    * highlighter has updated to the new zoom level.
    */
   zoomPageTo: function (level) {
     return this.changeZoomLevel(level, this.toolbox.highlighter.actorID);
   },
 
+  /* eslint-disable max-len */
   changeHighlightedNodeWaitForUpdate: protocol.custom(function (name, value, highlighter) {
-    return this._changeHighlightedNodeWaitForUpdate(name, value, (highlighter || this.toolbox.highlighter).actorID);
+    /* eslint-enable max-len */
+    return this._changeHighlightedNodeWaitForUpdate(
+      name, value, (highlighter || this.toolbox.highlighter).actorID
+    );
   }, {
     impl: "_changeHighlightedNodeWaitForUpdate"
   }),
 
   /**
    * Get the value of an attribute on one of the highlighter's node.
    * @param {String} nodeID The Id of the node in the highlighter.
    * @param {String} name The name of the attribute.
    * @param {Object} highlighter Optional custom highlither to target
    * @return {String} value
    */
   getHighlighterNodeAttribute: function (nodeID, name, highlighter) {
-    return this.getHighlighterAttribute(nodeID, name, (highlighter || this.toolbox.highlighter).actorID);
+    return this.getHighlighterAttribute(
+      nodeID, name, (highlighter || this.toolbox.highlighter).actorID
+    );
   },
 
   getHighlighterNodeTextContent: protocol.custom(function (nodeID, highlighter) {
-    return this._getHighlighterNodeTextContent(nodeID, (highlighter || this.toolbox.highlighter).actorID);
+    return this._getHighlighterNodeTextContent(
+      nodeID, (highlighter || this.toolbox.highlighter).actorID
+    );
   }, {
     impl: "_getHighlighterNodeTextContent"
   }),
 
   /**
    * Is the highlighter currently visible on the page?
    */
   isHighlighting: function () {
@@ -867,17 +869,17 @@ var TestActorFront = exports.TestActorFr
     }
   }),
 
   /**
    * Get the current rect of the border region of the box-model highlighter
    */
   getSimpleBorderRect: Task.async(function* (toolbox) {
     let {border} = yield this._getBoxModelStatus(toolbox);
-    let {p1, p2, p3, p4} = border.points;
+    let {p1, p2, p4} = border.points;
 
     return {
       top: p1.y,
       left: p1.x,
       width: p2.x - p1.x,
       height: p4.y - p1.y
     };
   }),
@@ -1061,17 +1063,19 @@ var TestActorFront = exports.TestActorFr
    * @param {String} region The box model region name.
    * @param {Front} highlighter The front of the highlighter.
    * @return {Object} The object returned has the following form:
    * - d {String} the d attribute value
    * - points {Array} an array of all the polygons defined by the path. Each box
    *   is itself an Array of points, themselves being [x,y] coordinates arrays.
    */
   getHighlighterRegionPath: Task.async(function* (region, highlighter) {
-    let d = yield this.getHighlighterNodeAttribute("box-model-" + region, "d", highlighter);
+    let d = yield this.getHighlighterNodeAttribute(
+      `box-model-${region}`, "d", highlighter
+    );
     if (!d) {
       return {d: null};
     }
 
     let polygons = d.match(/M[^M]+/g);
     if (!polygons) {
       return {d};
     }
--- a/devtools/client/shared/test/unit/test_VariablesView_filtering-without-controller.js
+++ b/devtools/client/shared/test/unit/test_VariablesView_filtering-without-controller.js
@@ -1,13 +1,15 @@
 /* -*- 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";
+
 // Test that VariablesView._doSearch() works even without an attached
 // VariablesViewController (bug 1196341).
 
 var Cu = Components.utils;
 var Cc = Components.classes;
 var Ci = Components.interfaces;
 const DOMParser = Cc["@mozilla.org/xmlextras/domparser;1"]
                     .createInstance(Ci.nsIDOMParser);
--- a/devtools/client/shared/test/unit/test_VariablesView_getString_promise.js
+++ b/devtools/client/shared/test/unit/test_VariablesView_getString_promise.js
@@ -1,15 +1,16 @@
 /* -*- 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/ */
 
-var Cu = Components.utils;
-const { VariablesView } = Cu.import("resource://devtools/client/shared/widgets/VariablesView.jsm", {});
+"use strict";
+
+const { VariablesView } = Components.utils.import("resource://devtools/client/shared/widgets/VariablesView.jsm", {});
 
 const PENDING = {
   "type": "object",
   "class": "Promise",
   "actor": "conn0.pausedobj35",
   "extensible": true,
   "frozen": false,
   "sealed": false,
@@ -62,13 +63,14 @@ const REJECTED = {
   }
 };
 
 function run_test() {
   equal(VariablesView.getString(PENDING, { concise: true }), "Promise");
   equal(VariablesView.getString(PENDING), 'Promise {<state>: "pending"}');
 
   equal(VariablesView.getString(FULFILLED, { concise: true }), "Promise");
-  equal(VariablesView.getString(FULFILLED), 'Promise {<state>: "fulfilled", <value>: 10}');
+  equal(VariablesView.getString(FULFILLED),
+        'Promise {<state>: "fulfilled", <value>: 10}');
 
   equal(VariablesView.getString(REJECTED, { concise: true }), "Promise");
   equal(VariablesView.getString(REJECTED), 'Promise {<state>: "rejected", <reason>: 10}');
 }
--- a/devtools/client/shared/test/unit/test_advanceValidate.js
+++ b/devtools/client/shared/test/unit/test_advanceValidate.js
@@ -2,24 +2,23 @@
 /* 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";
 
 // Tests the advanceValidate function from rule-view.js.
 
-var Cu = Components.utils;
-var Ci = Components.interfaces;
-var {require} = Cu.import("resource://devtools/shared/Loader.jsm", {});
-var {advanceValidate} = require("devtools/client/inspector/shared/utils");
+const {utils: Cu, interfaces: Ci} = Components;
+const {require} = Cu.import("resource://devtools/shared/Loader.jsm", {});
+const {advanceValidate} = require("devtools/client/inspector/shared/utils");
 
 //                            1         2         3
 //                  0123456789012345678901234567890
-var sampleInput = '\\symbol "string" url(somewhere)';
+const sampleInput = '\\symbol "string" url(somewhere)';
 
 function testInsertion(where, result, testName) {
   do_print(testName);
   equal(advanceValidate(Ci.nsIDOMKeyEvent.DOM_VK_SEMICOLON, sampleInput, where),
         result, "testing advanceValidate at " + where);
 }
 
 function run_test() {
--- a/devtools/client/shared/test/unit/test_attribute-parsing-01.js
+++ b/devtools/client/shared/test/unit/test_attribute-parsing-01.js
@@ -1,15 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Test splitBy from node-attribute-parser.js
 
-var Cu = Components.utils;
-var {require} = Cu.import("resource://devtools/shared/Loader.jsm", {});
+const {require} = Components.utils.import("resource://devtools/shared/Loader.jsm", {});
 const {splitBy} = require("devtools/client/shared/node-attribute-parser");
 
 const TEST_DATA = [{
   value: "this is a test",
   splitChar: " ",
   expected: [
     {value: "this"},
     {value: " ", type: "string"},
--- a/devtools/client/shared/test/unit/test_attribute-parsing-02.js
+++ b/devtools/client/shared/test/unit/test_attribute-parsing-02.js
@@ -1,15 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 // Test parseAttribute from node-attribute-parser.js
 
-var Cu = Components.utils;
-var {require} = Cu.import("resource://devtools/shared/Loader.jsm", {});
+const {require} = Components.utils.import("resource://devtools/shared/Loader.jsm", {});
 const {parseAttribute} = require("devtools/client/shared/node-attribute-parser");
 
 const TEST_DATA = [{
   tagName: "body",
   namespaceURI: "http://www.w3.org/1999/xhtml",
   attributeName: "class",
   attributeValue: "some css class names",
   expected: [
@@ -106,17 +107,20 @@ const TEST_DATA = [{
   ]
 }];
 
 function run_test() {
   for (let {tagName, namespaceURI, attributeName,
             otherAttributes, attributeValue, expected} of TEST_DATA) {
     do_print("Testing <" + tagName + " " + attributeName + "='" + attributeValue + "'>");
 
-    let attributes = [...otherAttributes || [], {name: attributeName, value: attributeValue}];
+    let attributes = [
+      ...otherAttributes || [],
+      { name: attributeName, value: attributeValue }
+    ];
     let tokens = parseAttribute(namespaceURI, tagName, attributes, attributeName);
     if (!expected) {
       do_check_true(!tokens);
       continue;
     }
 
     do_print("Checking that the number of parsed tokens is correct");
     do_check_eq(tokens.length, expected.length);
--- a/devtools/client/shared/test/unit/test_bezierCanvas.js
+++ b/devtools/client/shared/test/unit/test_bezierCanvas.js
@@ -74,17 +74,19 @@ function convertsOffsetsToCoordinates() 
   do_check_eq(coordinates[1], 1);
 }
 
 function plotsCanvas() {
   do_print("Plots the curve to the canvas");
 
   let hasDrawnCurve = false;
   let b = new BezierCanvas(getCanvasMock(), getCubicBezier(), [.25, 0]);
-  b.ctx.bezierCurveTo = () => hasDrawnCurve = true;
+  b.ctx.bezierCurveTo = () => {
+    hasDrawnCurve = true;
+  };
   b.plot();
 
   do_check_true(hasDrawnCurve);
 }
 
 function getCubicBezier() {
   return new CubicBezier([0, 0, 1, 1]);
 }
--- a/devtools/client/shared/test/unit/test_cssColor-03.js
+++ b/devtools/client/shared/test/unit/test_cssColor-03.js
@@ -50,12 +50,12 @@ function run_test() {
 
   for (let test of CSS_COLOR_4_TESTS) {
     let oursOld = colorUtils.colorToRGBA(test, true);
     let oursNew = colorUtils.colorToRGBA(test, false);
     let platform = DOMUtils.colorToRGBA(test);
     notEqual(oursOld, platform, "old style parser for color " + test +
              " should not match DOMUtils");
     ok(oursOld === null, "'" + test + "' is not a color with old parser");
-    deepEqual(oursNew, platform, "css-color-4 parser for color " + test + " matches DOMUtils");
+    deepEqual(oursNew, platform, `css-color-4 parser for color ${test} matches DOMUtils`);
     ok(oursNew !== null, "'" + test + "' is a color with css-color-4 parser");
   }
 }
--- a/devtools/client/shared/test/unit/test_parseDeclarations.js
+++ b/devtools/client/shared/test/unit/test_parseDeclarations.js
@@ -1,17 +1,16 @@
 /* -*- 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";
 
-var Cu = Components.utils;
-const {require} = Cu.import("resource://devtools/shared/Loader.jsm", {});
+const {require} = Components.utils.import("resource://devtools/shared/Loader.jsm", {});
 const {parseDeclarations, _parseCommentDeclarations} = require("devtools/shared/css/parsing-utils");
 const {isCssPropertyKnown} = require("devtools/server/actors/css-properties");
 
 const TEST_DATA = [
   // Simple test
   {
     input: "p:v;",
     expected: [{name: "p", value: "v", priority: "", offsets: [0, 4]}]
@@ -234,22 +233,23 @@ const TEST_DATA = [
     expected: [{
       name: "content",
       value: "'this \\' is a \" really strange string'",
       priority: "",
       offsets: [0, 47]
     }]
   },
   {
-    input: "content: \"a not s\\\
-          o very long title\"",
-    expected: [
-      {name: "content", value: '"a not s\\\
-          o very long title"', priority: "", offsets: [0, 46]}
-    ]
+    input: "content: \"a not s\\          o very long title\"",
+    expected: [{
+      name: "content",
+      value: '"a not s\\          o very long title"',
+      priority: "",
+      offsets: [0, 46]
+    }]
   },
   // Test calc with nested parentheses
   {
     input: "width: calc((100% - 3em) / 2)",
     expected: [{name: "width", value: "calc((100% - 3em) / 2)", priority: "",
                 offsets: [0, 29]}]
   },
 
--- a/devtools/client/shared/test/unit/test_rewriteDeclarations.js
+++ b/devtools/client/shared/test/unit/test_rewriteDeclarations.js
@@ -508,19 +508,17 @@ function rewriteDeclarations(inputString
     default:
       throw new Error("unrecognized instruction");
   }
 
   return rewriter.getResult();
 }
 
 function run_test() {
-  let i = 0;
   for (let test of TEST_DATA) {
-    ++i;
     let {changed, text} = rewriteDeclarations(test.input, test.instruction,
                                               "\t");
     equal(text, test.expected, "output for " + test.desc);
 
     let expectChanged;
     if ("changed" in test) {
       expectChanged = test.changed;
     } else {
--- a/devtools/client/shared/test/unit/test_source-utils.js
+++ b/devtools/client/shared/test/unit/test_source-utils.js
@@ -1,17 +1,18 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
+"use strict";
+
 /**
  * Tests utility functions contained in `source-utils.js`
  */
 
-const Cu = Components.utils;
-const { require } = Cu.import("resource://devtools/shared/Loader.jsm", {});
+const { require } = Components.utils.import("resource://devtools/shared/Loader.jsm", {});
 const sourceUtils = require("devtools/client/shared/source-utils");
 
 function run_test() {
   run_next_test();
 }
 
 const CHROME_URLS = [
   "chrome://foo", "resource://baz", "jar:file:///Users/root"
@@ -29,36 +30,39 @@ add_task(function* () {
   equal(parsed.hostname, "foo.com", "parseURL parsed valid hostname");
   equal(parsed.port, "8888", "parseURL parsed valid port");
   equal(parsed.href, "https://foo.com:8888/boo/bar.js?q=query", "parseURL parsed valid href");
 
   parsed = sourceUtils.parseURL("https://foo.com");
   equal(parsed.host, "foo.com", "parseURL parsed valid host when no port given");
   equal(parsed.hostname, "foo.com", "parseURL parsed valid hostname when no port given");
 
-  equal(sourceUtils.parseURL("self-hosted"), null, "parseURL returns `null` for invalid URLs");
+  equal(sourceUtils.parseURL("self-hosted"), null,
+        "parseURL returns `null` for invalid URLs");
 });
 
 // Test `sourceUtils.isContentScheme`.
 add_task(function* () {
   for (let url of CHROME_URLS) {
-    ok(!sourceUtils.isContentScheme(url), `${url} correctly identified as not content scheme`);
+    ok(!sourceUtils.isContentScheme(url),
+       `${url} correctly identified as not content scheme`);
   }
   for (let url of CONTENT_URLS) {
     ok(sourceUtils.isContentScheme(url), `${url} correctly identified as content scheme`);
   }
 });
 
 // Test `sourceUtils.isChromeScheme`.
 add_task(function* () {
   for (let url of CHROME_URLS) {
     ok(sourceUtils.isChromeScheme(url), `${url} correctly identified as chrome scheme`);
   }
   for (let url of CONTENT_URLS) {
-    ok(!sourceUtils.isChromeScheme(url), `${url} correctly identified as not chrome scheme`);
+    ok(!sourceUtils.isChromeScheme(url),
+       `${url} correctly identified as not chrome scheme`);
   }
 });
 
 // Test `sourceUtils.isDataScheme`.
 add_task(function* () {
   let dataURI = "data:text/html;charset=utf-8,<!DOCTYPE html></html>";
   ok(sourceUtils.isDataScheme(dataURI), `${dataURI} correctly identified as data scheme`);
 
@@ -75,24 +79,25 @@ add_task(function* () {
   testAbbreviation("http://example.com/foo/bar/baz/boo.js",
                    "boo.js",
                    "http://example.com/foo/bar/baz/boo.js",
                    "example.com");
 });
 
 // Test `sourceUtils.isScratchpadTheme`
 add_task(function* () {
-  ok(sourceUtils.isScratchpadScheme("Scratchpad/1"), "Scratchpad/1 identified as scratchpad");
-  ok(sourceUtils.isScratchpadScheme("Scratchpad/20"), "Scratchpad/20 identified as scratchpad");
+  ok(sourceUtils.isScratchpadScheme("Scratchpad/1"),
+     "Scratchpad/1 identified as scratchpad");
+  ok(sourceUtils.isScratchpadScheme("Scratchpad/20"),
+     "Scratchpad/20 identified as scratchpad");
   ok(!sourceUtils.isScratchpadScheme("http://www.mozilla.org"), "http://www.mozilla.org not identified as scratchpad");
 });
 
 // Test `sourceUtils.getSourceNames`.
 add_task(function* () {
-
   // Check length
   let longMalformedURL = `example.com${new Array(100).fill("/a").join("")}/file.js`;
   ok(sourceUtils.getSourceNames(longMalformedURL).short.length <= 100,
     "`short` names are capped at 100 characters");
 
   testAbbreviation("self-hosted", "self-hosted", "self-hosted");
   testAbbreviation("", "(unknown)", "(unknown)");
 
--- a/devtools/client/shared/test/unit/test_undoStack.js
+++ b/devtools/client/shared/test/unit/test_undoStack.js
@@ -1,31 +1,31 @@
 /* -*- 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/ */
 
-var Cu = Components.utils;
-var {Loader} = Cu.import("resource://gre/modules/commonjs/toolkit/loader.js", {});
+"use strict";
 
-var loader = new Loader.Loader({
+const {Loader} = Components.utils.import("resource://gre/modules/commonjs/toolkit/loader.js", {});
+
+const loader = new Loader.Loader({
   paths: {
     "": "resource://gre/modules/commonjs/",
     "devtools": "resource://devtools",
   },
   globals: {},
 });
-var require = Loader.Require(loader, { id: "undo-test" });
+const require = Loader.Require(loader, { id: "undo-test" });
 
-var {UndoStack} = require("devtools/client/shared/undo");
+const {UndoStack} = require("devtools/client/shared/undo");
 
 const MAX_SIZE = 5;
 
-function run_test()
-{
+function run_test() {
   let str = "";
   let stack = new UndoStack(MAX_SIZE);
 
   function add(ch) {
     stack.do(function () {
       str += ch;
     }, function () {
       str = str.slice(0, -1);