Merge mozilla-central to inbound. a=merge CLOSED TREE
authorCsoregi Natalia <ncsoregi@mozilla.com>
Sat, 02 Jun 2018 01:05:17 +0300
changeset 420953 a153c2238eafc271da2ddc937f466ea37d1b4837
parent 420952 a3e3dc8bab688759280f10462527257fe15f5812 (current diff)
parent 420868 cbf9ea7c5531a1ab80ab716eae4c8eb71f6ebaae (diff)
child 420954 34278b2ad4b9ac1fdd074a573baab1c6db013ca3
push id34083
push userapavel@mozilla.com
push dateSat, 02 Jun 2018 23:03:25 +0000
treeherdermozilla-central@1f62ecdf59b6 [default view] [failures only]
perfherder[talos] [build metrics] [platform microbench] (compared to previous push)
reviewersmerge
milestone62.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
Merge mozilla-central to inbound. a=merge CLOSED TREE
devtools/client/sourceeditor/editor.js
python/l10n/fluent_migrations/bug_1411012_preferences_do_not_track.py
python/l10n/fluent_migrations/bug_1424682_preferences_chrome.py
python/l10n/fluent_migrations/bug_1424683_brand_short_name.py
python/l10n/fluent_migrations/bug_1432338_sync_brand.py
python/l10n/fluent_migrations/bug_1435912_preferences_general_xul.py
python/l10n/fluent_migrations/bug_1442542_preferences_clearSiteData_js.py
toolkit/components/places/tests/unit/test_adaptive.js
toolkit/components/places/tests/unit/test_adaptive_bug527311.js
--- a/.eslintrc.js
+++ b/.eslintrc.js
@@ -49,18 +49,16 @@ module.exports = {
       "mozilla/no-define-cc-etc": "off",
     }
   }, {
     // XXX Bug 1452706. These directories are still being fixed, so turn off
     //  mozilla/require-expected-throws-or-rejects for now.
     "files": [
       "devtools/client/inspector/extensions/test/head_devtools_inspector_sidebar.js",
       "storage/test/unit/**",
-      "toolkit/components/extensions/**",
-      "toolkit/mozapps/extensions/test/xpcshell/**"
     ],
     "rules": {
       "mozilla/require-expected-throws-or-rejects": "off",
     }
   }, {
     // XXX Bug 1452706. These directories are still being fixed, so turn off
     //  mozilla/require-expected-throws-or-rejects for now.
     "files": [
--- a/browser/app/profile/firefox.js
+++ b/browser/app/profile/firefox.js
@@ -1483,28 +1483,28 @@ pref("browser.ping-centre.production.end
 
 // Enable GMP support in the addon manager.
 pref("media.gmp-provider.enabled", true);
 
 pref("privacy.trackingprotection.ui.enabled", true);
 pref("privacy.trackingprotection.introCount", 0);
 pref("privacy.trackingprotection.introURL", "https://www.mozilla.org/%LOCALE%/firefox/%VERSION%/tracking-protection/start/");
 
+// Always enable newtab segregation using containers
+pref("privacy.usercontext.about_newtab_segregation.enabled", true);
 // Enable Contextual Identity Containers
 #ifdef NIGHTLY_BUILD
 pref("privacy.userContext.enabled", true);
 pref("privacy.userContext.ui.enabled", true);
-pref("privacy.usercontext.about_newtab_segregation.enabled", true);
 
 // 0 disables long press, 1 when clicked, the menu is shown, 2 the menu is shown after X milliseconds.
 pref("privacy.userContext.longPressBehavior", 2);
 #else
 pref("privacy.userContext.enabled", false);
 pref("privacy.userContext.ui.enabled", false);
-pref("privacy.usercontext.about_newtab_segregation.enabled", false);
 
 // 0 disables long press, 1 when clicked, the menu is shown, 2 the menu is shown after X milliseconds.
 pref("privacy.userContext.longPressBehavior", 0);
 #endif
 pref("privacy.userContext.extension", "");
 
 // Start the browser in e10s mode
 pref("browser.tabs.remote.autostart", true);
--- a/browser/base/content/tabbrowser.js
+++ b/browser/base/content/tabbrowser.js
@@ -1279,44 +1279,44 @@ window._gBrowser = {
       isContentTitle = true;
     } else if (aTab.hasAttribute("customizemode")) {
       let brandBundle = document.getElementById("bundle_brand");
       let brandShortName = brandBundle.getString("brandShortName");
       title = gNavigatorBundle.getFormattedString("customizeMode.tabTitle",
                                                   [brandShortName]);
       isContentTitle = true;
     } else {
+      // See if we can use the URI as the title.
       if (browser.currentURI.displaySpec) {
         try {
           title = this.mURIFixup.createExposableURI(browser.currentURI).displaySpec;
         } catch (ex) {
           title = browser.currentURI.displaySpec;
         }
       }
 
       if (title && !isBlankPageURL(title)) {
-        // At this point, we now have a URI.
-        // Let's try to unescape it using a character set
-        // in case the URI is not ASCII.
-        try {
-          // If it's a long data: URI that uses base64 encoding, truncate to
-          // a reasonable length rather than trying to display the entire thing.
-          // We can't shorten arbitrary URIs like this, as bidi etc might mean
-          // we need the trailing characters for display. But a base64-encoded
-          // data-URI is plain ASCII, so this is OK for tab-title display.
-          // (See bug 1408854.)
-          if (title.length > 500 && title.match(/^data:[^,]+;base64,/)) {
-            title = title.substring(0, 500) + "\u2026";
-          } else {
-            var characterSet = browser.characterSet;
+        // If it's a long data: URI that uses base64 encoding, truncate to a
+        // reasonable length rather than trying to display the entire thing,
+        // which can be slow.
+        // We can't shorten arbitrary URIs like this, as bidi etc might mean
+        // we need the trailing characters for display. But a base64-encoded
+        // data-URI is plain ASCII, so this is OK for tab-title display.
+        // (See bug 1408854.)
+        if (title.length > 500 && title.match(/^data:[^,]+;base64,/)) {
+          title = title.substring(0, 500) + "\u2026";
+        } else {
+          // Try to unescape not-ASCII URIs using the current character set.
+          try {
+            let characterSet = browser.characterSet;
             title = Services.textToSubURI.unEscapeNonAsciiURI(characterSet, title);
-          }
-        } catch (ex) { /* Do nothing. */ }
+          } catch (ex) { /* Do nothing. */ }
+        }
       } else {
-        // Still no title? Fall back to our untitled string.
+        // No suitable URI? Fall back to our untitled string.
         title = this.tabContainer.emptyTabTitle;
       }
     }
 
     return this._setTabLabel(aTab, title, { isContentTitle });
   },
 
   _setTabLabel(aTab, aLabel, aOptions) {
--- a/browser/base/content/test/webrtc/browser_devices_get_user_media_paused.js
+++ b/browser/base/content/test/webrtc/browser_devices_get_user_media_paused.js
@@ -8,16 +8,52 @@ function setTrackEnabled(audio, video) {
       stream.getAudioTracks()[0].enabled = args.audio;
     }
     if (args.video != null) {
       stream.getVideoTracks()[0].enabled = args.video;
     }
   });
 }
 
+function cloneTracks(audio, video) {
+  return ContentTask.spawn(gBrowser.selectedBrowser, {audio, video}, function(args) {
+    if (!content.wrappedJSObject.gClones) {
+      content.wrappedJSObject.gClones = [];
+    }
+    let clones = content.wrappedJSObject.gClones;
+    let stream = content.wrappedJSObject.gStreams[0];
+    if (args.audio != null) {
+      clones.push(stream.getAudioTracks()[0].clone());
+    }
+    if (args.video != null) {
+      clones.push(stream.getVideoTracks()[0].clone());
+    }
+  });
+}
+
+function stopClonedTracks(audio, video) {
+  return ContentTask.spawn(gBrowser.selectedBrowser, {audio, video}, function(args) {
+    let clones = content.wrappedJSObject.gClones || [];
+    if (args.audio != null) {
+      clones.filter(t => t.kind == "audio")
+            .forEach(t => t.stop());
+    }
+    if (args.video != null) {
+      clones.filter(t => t.kind == "video")
+            .forEach(t => t.stop());
+    }
+    let liveClones = clones.filter(t => t.readyState == "live");
+    if (liveClones.length == 0) {
+      delete content.wrappedJSObject.gClones;
+    } else {
+      content.wrappedJSObject.gClones = liveClones;
+    }
+  });
+}
+
 var gTests = [
 {
   desc: "getUserMedia audio+video: disabling the stream shows the paused indicator",
   run: async function checkPaused() {
     let promise = promisePopupNotificationShown("webRTC-shareDevices");
     await promiseRequestDevice(true, true);
     await promise;
     await expectObserverCalled("getUserMedia:request");
@@ -86,16 +122,101 @@ var gTests = [
       video: STATE_CAPTURE_ENABLED,
       audio: STATE_CAPTURE_ENABLED,
     });
     await closeStream();
   }
 },
 
 {
+  desc: "getUserMedia audio+video: disabling the original tracks and stopping enabled clones shows the paused indicator",
+  run: async function checkPausedAfterCloneStop() {
+    let promise = promisePopupNotificationShown("webRTC-shareDevices");
+    await promiseRequestDevice(true, true);
+    await promise;
+    await expectObserverCalled("getUserMedia:request");
+    checkDeviceSelectors(true, true);
+
+    let indicator = promiseIndicatorWindow();
+    await promiseMessage("ok", () => {
+      PopupNotifications.panel.firstChild.button.click();
+    });
+    await expectObserverCalled("getUserMedia:response:allow");
+    await expectObserverCalled("recording-device-events");
+    Assert.deepEqual((await getMediaCaptureState()), {audio: true, video: true},
+                     "expected camera and microphone to be shared");
+    await indicator;
+    await checkSharingUI({
+      video: STATE_CAPTURE_ENABLED,
+      audio: STATE_CAPTURE_ENABLED,
+    });
+
+    // Clone audio and video, their state will be enabled
+    await cloneTracks(true, true);
+
+    // Disable both audio and video.
+    await setTrackEnabled(false, false);
+
+    await expectNoObserverCalled();
+
+    // Stop the clones. This should disable the sharing indicators.
+    await stopClonedTracks(true, true);
+
+    // It sometimes takes a bit longer before the change propagates to the UI,
+    // wait for it to avoid intermittents.
+    await BrowserTestUtils.waitForCondition(
+      () => window.gIdentityHandler._sharingState.camera == STATE_CAPTURE_DISABLED &&
+            window.gIdentityHandler._sharingState.microphone == STATE_CAPTURE_DISABLED,
+      "video and audio should be disabled"
+    );
+
+    await expectObserverCalled("recording-device-events", 2);
+
+    // The identity UI should show both as disabled.
+    await checkSharingUI({
+      video: STATE_CAPTURE_DISABLED,
+      audio: STATE_CAPTURE_DISABLED,
+    });
+
+    // Enable only audio again.
+    await setTrackEnabled(true);
+
+    await BrowserTestUtils.waitForCondition(
+      () => window.gIdentityHandler._sharingState.microphone == STATE_CAPTURE_ENABLED,
+      "audio should be enabled"
+    );
+
+    await expectObserverCalled("recording-device-events");
+
+    // The identity UI should show only video as disabled.
+    await checkSharingUI({
+      video: STATE_CAPTURE_DISABLED,
+      audio: STATE_CAPTURE_ENABLED,
+    });
+
+    // Enable video again.
+    await setTrackEnabled(null, true);
+
+    await BrowserTestUtils.waitForCondition(
+      () => window.gIdentityHandler._sharingState.camera == STATE_CAPTURE_ENABLED,
+      "video should be enabled"
+    );
+
+    await expectObserverCalled("recording-device-events");
+
+    // Both streams should show as running.
+    await checkSharingUI({
+      video: STATE_CAPTURE_ENABLED,
+      audio: STATE_CAPTURE_ENABLED,
+    });
+    await closeStream();
+  }
+},
+
+{
   desc: "getUserMedia screen: disabling the stream shows the paused indicator",
   run: async function checkScreenPaused() {
     let promise = promisePopupNotificationShown("webRTC-shareDevices");
     await promiseRequestDevice(false, true, null, "screen");
     await promise;
     await expectObserverCalled("getUserMedia:request");
 
     is(PopupNotifications.getNotification("webRTC-shareDevices").anchorID,
--- a/browser/locales/shipped-locales
+++ b/browser/locales/shipped-locales
@@ -14,16 +14,17 @@ bs
 ca
 cak
 cs
 cy
 da
 de
 dsb
 el
+en-CA
 en-GB
 en-US
 en-ZA
 eo
 es-AR
 es-CL
 es-ES
 es-MX
--- a/devtools/.eslintrc.js
+++ b/devtools/.eslintrc.js
@@ -363,16 +363,18 @@ module.exports = {
     // Don't require method and property shorthand syntax for object literals.
     // We use this in the code a lot, but not consistently, and this seems more
     // like something to check at code review time.
     "object-shorthand": "off",
     // Allow more than one variable declaration per function.
     "one-var": "off",
     // Disallow padding within blocks.
     "padded-blocks": ["error", "never"],
+    // Enforce using `let` only when variables are reassigned.
+    "prefer-const": ["error", { "destructuring": "all" }],
     // Don't require quotes around object literal property names.
     "quote-props": "off",
     // Require use of the second argument for parseInt().
     "radix": "error",
     // Enforce spacing after semicolons.
     "semi-spacing": ["error", {"before": false, "after": true}],
     // Don't require to sort variables within the same declaration block.
     // Anyway, one-var is disabled.
--- a/devtools/client/aboutdebugging/components/Aboutdebugging.js
+++ b/devtools/client/aboutdebugging/components/Aboutdebugging.js
@@ -84,20 +84,20 @@ class AboutDebuggingApp extends Componen
     });
   }
 
   selectPanel(panelId) {
     window.location.hash = "#" + panelId;
   }
 
   render() {
-    let { client, connect } = this.props;
-    let { selectedPanelId } = this.state;
-    let selectPanel = this.selectPanel;
-    let selectedPanel = panels.find(p => p.id == selectedPanelId);
+    const { client, connect } = this.props;
+    const { selectedPanelId } = this.state;
+    const selectPanel = this.selectPanel;
+    const selectedPanel = panels.find(p => p.id == selectedPanelId);
     let panel;
 
     if (selectedPanel) {
       panel = selectedPanel.component({ client, connect, id: selectedPanel.id });
     } else {
       panel = (
         dom.div({ className: "error-page" },
           dom.h1({ className: "header-name" },
--- a/devtools/client/aboutdebugging/components/PanelHeader.js
+++ b/devtools/client/aboutdebugging/components/PanelHeader.js
@@ -12,16 +12,16 @@ class PanelHeader extends Component {
   static get propTypes() {
     return {
       id: PropTypes.string.isRequired,
       name: PropTypes.string.isRequired
     };
   }
 
   render() {
-    let { name, id } = this.props;
+    const { name, id } = this.props;
 
     return dom.div({ className: "header" },
       dom.h1({ id, className: "header-name" }, name));
   }
 }
 
 module.exports = PanelHeader;
--- a/devtools/client/aboutdebugging/components/PanelMenu.js
+++ b/devtools/client/aboutdebugging/components/PanelMenu.js
@@ -19,19 +19,19 @@ class PanelMenu extends Component {
         component: PropTypes.func.isRequired
       })).isRequired,
       selectPanel: PropTypes.func.isRequired,
       selectedPanelId: PropTypes.string
     };
   }
 
   render() {
-    let { panels, selectedPanelId, selectPanel } = this.props;
-    let panelLinks = panels.map(({ id, name, icon }) => {
-      let selected = id == selectedPanelId;
+    const { panels, selectedPanelId, selectPanel } = this.props;
+    const panelLinks = panels.map(({ id, name, icon }) => {
+      const selected = id == selectedPanelId;
       return PanelMenuEntry({
         id,
         name,
         icon,
         selected,
         selectPanel
       });
     });
--- a/devtools/client/aboutdebugging/components/PanelMenuEntry.js
+++ b/devtools/client/aboutdebugging/components/PanelMenuEntry.js
@@ -24,21 +24,21 @@ class PanelMenuEntry extends Component {
     this.onClick = this.onClick.bind(this);
   }
 
   onClick() {
     this.props.selectPanel(this.props.id);
   }
 
   render() {
-    let { id, name, icon, selected } = this.props;
+    const { id, name, icon, selected } = this.props;
 
     // Here .category, .category-icon, .category-name classnames are used to
     // apply common styles defined.
-    let className = "category" + (selected ? " selected" : "");
+    const className = "category" + (selected ? " selected" : "");
     return dom.button({
       "aria-selected": selected,
       "aria-controls": id + "-panel",
       className,
       onClick: this.onClick,
       tabIndex: "0",
       role: "tab" },
     dom.img({ className: "category-icon", src: icon, role: "presentation" }),
--- a/devtools/client/aboutdebugging/components/addons/Controls.js
+++ b/devtools/client/aboutdebugging/components/addons/Controls.js
@@ -39,24 +39,24 @@ class AddonsControls extends Component {
 
     this.onEnableAddonDebuggingChange = this.onEnableAddonDebuggingChange.bind(this);
     this.loadAddonFromFile = this.loadAddonFromFile.bind(this);
     this.retryInstall = this.retryInstall.bind(this);
     this.installAddon = this.installAddon.bind(this);
   }
 
   onEnableAddonDebuggingChange(event) {
-    let enabled = event.target.checked;
+    const enabled = event.target.checked;
     Services.prefs.setBoolPref("devtools.chrome.enabled", enabled);
     Services.prefs.setBoolPref("devtools.debugger.remote-enabled", enabled);
   }
 
   loadAddonFromFile() {
     this.setState({ installError: null });
-    let fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
+    const fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
     fp.init(window,
       Strings.GetStringFromName("selectAddonFromFile2"),
       Ci.nsIFilePicker.modeOpen);
     fp.open(res => {
       if (res == Ci.nsIFilePicker.returnCancel || !fp.file) {
         return;
       }
       let file = fp.file;
@@ -83,17 +83,17 @@ class AddonsControls extends Component {
       })
       .catch(e => {
         console.error(e);
         this.setState({ installError: e.message, lastInstallErrorFile: file });
       });
   }
 
   render() {
-    let { debugDisabled } = this.props;
+    const { debugDisabled } = this.props;
 
     return dom.div({ className: "addons-top" },
       dom.div({ className: "addons-controls" },
         dom.div({ className: "addons-options toggle-container-with-text" },
           dom.input({
             id: "enable-addon-debugging",
             type: "checkbox",
             checked: !debugDisabled,
--- a/devtools/client/aboutdebugging/components/addons/InstallError.js
+++ b/devtools/client/aboutdebugging/components/addons/InstallError.js
@@ -21,17 +21,17 @@ class AddonsInstallError extends Compone
       retryInstall: PropTypes.func,
     };
   }
 
   render() {
     if (!this.props.error) {
       return null;
     }
-    let text = Strings.formatStringFromName("addonInstallError", [this.props.error], 1);
+    const text = Strings.formatStringFromName("addonInstallError", [this.props.error], 1);
     return dom.div(
       { className: "addons-install-error" },
       dom.span(
         {},
         dom.div({ className: "warning" }),
         dom.span({}, text),
       ),
       dom.button(
--- a/devtools/client/aboutdebugging/components/addons/Panel.js
+++ b/devtools/client/aboutdebugging/components/addons/Panel.js
@@ -74,27 +74,27 @@ class AddonsPanel extends Component {
 
     Services.prefs.removeObserver(CHROME_ENABLED_PREF,
       this.updateDebugStatus);
     Services.prefs.removeObserver(REMOTE_ENABLED_PREF,
       this.updateDebugStatus);
   }
 
   updateDebugStatus() {
-    let debugDisabled =
+    const debugDisabled =
       !Services.prefs.getBoolPref(CHROME_ENABLED_PREF) ||
       !Services.prefs.getBoolPref(REMOTE_ENABLED_PREF);
 
     this.setState({ debugDisabled });
   }
 
   updateAddonsList() {
     this.props.client.listAddons()
       .then(({addons}) => {
-        let extensions = addons.filter(addon => addon.debuggable).map(addon => {
+        const extensions = addons.filter(addon => addon.debuggable).map(addon => {
           return {
             addonActor: addon.actor,
             addonID: addon.id,
             // Forward the whole addon actor form for potential remote debugging.
             form: addon,
             icon: addon.iconURL || ExtensionIcon,
             manifestURL: addon.manifestURL,
             name: addon.name,
@@ -134,21 +134,21 @@ class AddonsPanel extends Component {
   /**
    * Mandatory callback as AddonManager listener.
    */
   onDisabled() {
     this.updateAddonsList();
   }
 
   render() {
-    let { client, connect, id } = this.props;
-    let { debugDisabled, extensions: targets } = this.state;
-    let installedName = Strings.GetStringFromName("extensions");
-    let temporaryName = Strings.GetStringFromName("temporaryExtensions");
-    let targetClass = AddonTarget;
+    const { client, connect, id } = this.props;
+    const { debugDisabled, extensions: targets } = this.state;
+    const installedName = Strings.GetStringFromName("extensions");
+    const temporaryName = Strings.GetStringFromName("temporaryExtensions");
+    const targetClass = AddonTarget;
 
     const installedTargets = targets.filter((target) => !target.temporarilyInstalled);
     const temporaryTargets = targets.filter((target) => target.temporarilyInstalled);
 
     return dom.div({
       id: id + "-panel",
       className: "panel",
       role: "tabpanel",
--- a/devtools/client/aboutdebugging/components/addons/Target.js
+++ b/devtools/client/aboutdebugging/components/addons/Target.js
@@ -29,17 +29,17 @@ const TEMP_ID_URL = "https://developer.m
                     "/WebExtensions/WebExtensions_and_the_Add-on_ID";
 const LEGACY_WARNING_URL = "https://wiki.mozilla.org/Add-ons/Future_of_Bootstrap";
 
 function filePathForTarget(target) {
   // Only show file system paths, and only for temporarily installed add-ons.
   if (!target.temporarilyInstalled || !target.url || !target.url.startsWith("file://")) {
     return [];
   }
-  let path = parseFileUri(target.url);
+  const path = parseFileUri(target.url);
   return [
     dom.dt(
       { className: "addon-target-info-label" },
       Strings.GetStringFromName("location")),
     // Wrap the file path in a span so we can do some RTL/LTR swapping to get
     // the ellipsis on the left.
     dom.dd(
       { className: "addon-target-info-content file-path" },
@@ -64,17 +64,17 @@ function addonIDforTarget(target) {
   ];
 }
 
 function internalIDForTarget(target) {
   if (!target.manifestURL) {
     return [];
   }
   // Strip off the protocol and rest, leaving us with just the UUID.
-  let uuid = /moz-extension:\/\/([^/]*)/.exec(target.manifestURL)[1];
+  const uuid = /moz-extension:\/\/([^/]*)/.exec(target.manifestURL)[1];
   return [
     dom.dt(
       { className: "addon-target-info-label" },
       Strings.GetStringFromName("internalUUID"),
     ),
     dom.dd(
       { className: "addon-target-info-content internal-uuid" },
       dom.span(
@@ -134,17 +134,17 @@ function warningMessages(target) {
         {
           href: LEGACY_WARNING_URL,
           target: "_blank"
         },
         Strings.GetStringFromName("legacyExtensionWarning.learnMore"))
     ));
   }
 
-  let warnings = target.warnings || [];
+  const warnings = target.warnings || [];
   messages = messages.concat(warnings.map((warning) => {
     return dom.li(
       { className: "addon-target-warning-message addon-target-message" },
       warning);
   }));
 
   return messages;
 }
@@ -171,46 +171,46 @@ class AddonTarget extends Component {
   constructor(props) {
     super(props);
     this.debug = this.debug.bind(this);
     this.uninstall = this.uninstall.bind(this);
     this.reload = this.reload.bind(this);
   }
 
   debug() {
-    let { client, connect, target } = this.props;
+    const { client, connect, target } = this.props;
 
     if (connect.type === "REMOTE") {
       debugRemoteAddon(target.form, client);
     } else if (connect.type === "LOCAL") {
       debugLocalAddon(target.addonID);
     }
   }
 
   uninstall() {
-    let { target } = this.props;
+    const { target } = this.props;
     uninstallAddon(target.addonID);
   }
 
   async reload() {
-    let { client, target } = this.props;
-    let { AboutDebugging } = window;
+    const { client, target } = this.props;
+    const { AboutDebugging } = window;
     try {
       await client.request({
         to: target.addonActor,
         type: "reload"
       });
       AboutDebugging.emit("addon-reload");
     } catch (e) {
       throw new Error("Error reloading addon " + target.addonID + ": " + e.message);
     }
   }
 
   render() {
-    let { target, debugDisabled } = this.props;
+    const { target, debugDisabled } = this.props;
 
     return dom.li(
       { className: "addon-target-container", "data-addon-id": target.addonID },
       dom.div({ className: "target" },
         dom.img({
           className: "target-icon",
           role: "presentation",
           src: target.icon
--- a/devtools/client/aboutdebugging/components/tabs/Panel.js
+++ b/devtools/client/aboutdebugging/components/tabs/Panel.js
@@ -36,47 +36,47 @@ class TabsPanel extends Component {
     this.state = {
       tabs: []
     };
 
     this.update = this.update.bind(this);
   }
 
   componentDidMount() {
-    let { client } = this.props;
+    const { client } = this.props;
     client.addListener("tabListChanged", this.update);
     this.update();
   }
 
   componentWillUnmount() {
-    let { client } = this.props;
+    const { client } = this.props;
     client.removeListener("tabListChanged", this.update);
   }
 
   async update() {
     let { tabs } = await this.props.client.mainRoot.listTabs({ favicons: true });
 
     // Filter out closed tabs (represented as `null`).
     tabs = tabs.filter(tab => !!tab);
 
-    for (let tab of tabs) {
+    for (const tab of tabs) {
       if (tab.favicon) {
-        let base64Favicon = btoa(String.fromCharCode.apply(String, tab.favicon));
+        const base64Favicon = btoa(String.fromCharCode.apply(String, tab.favicon));
         tab.icon = "data:image/png;base64," + base64Favicon;
       } else {
         tab.icon = "chrome://devtools/skin/images/globe.svg";
       }
     }
 
     this.setState({ tabs });
   }
 
   render() {
-    let { client, connect, id } = this.props;
-    let { tabs } = this.state;
+    const { client, connect, id } = this.props;
+    const { tabs } = this.state;
 
     return dom.div({
       id: id + "-panel",
       className: "panel",
       role: "tabpanel",
       "aria-labelledby": id + "-header"
     },
     PanelHeader({
--- a/devtools/client/aboutdebugging/components/tabs/Target.js
+++ b/devtools/client/aboutdebugging/components/tabs/Target.js
@@ -29,27 +29,27 @@ class TabTarget extends Component {
   }
 
   constructor(props) {
     super(props);
     this.debug = this.debug.bind(this);
   }
 
   debug() {
-    let { target, connect } = this.props;
+    const { target, connect } = this.props;
     let url = "about:devtools-toolbox?type=tab&id=" + target.outerWindowID;
     if (connect.type == "REMOTE") {
-      let {host, port} = connect.params;
+      const {host, port} = connect.params;
       url += `&host=${encodeURIComponent(host)}&port=${encodeURIComponent(port)}`;
     }
     window.open(url);
   }
 
   render() {
-    let { target } = this.props;
+    const { target } = this.props;
 
     return dom.div({ className: "target-container" },
       dom.img({
         className: "target-icon",
         role: "presentation",
         src: target.icon
       }),
       dom.div({ className: "target" },
--- a/devtools/client/aboutdebugging/components/workers/MultiE10sWarning.js
+++ b/devtools/client/aboutdebugging/components/workers/MultiE10sWarning.js
@@ -16,17 +16,17 @@ const MULTI_OPT_OUT_PREF = "dom.ipc.mult
 
 class multiE10SWarning extends Component {
   constructor(props) {
     super(props);
     this.onUpdatePreferenceClick = this.onUpdatePreferenceClick.bind(this);
   }
 
   onUpdatePreferenceClick() {
-    let message = Strings.GetStringFromName("multiProcessWarningConfirmUpdate2");
+    const message = Strings.GetStringFromName("multiProcessWarningConfirmUpdate2");
     if (window.confirm(message)) {
       // Disable multi until at least the next experiment.
       Services.prefs.setIntPref(MULTI_OPT_OUT_PREF,
                                 Services.appinfo.E10S_MULTI_EXPERIMENT);
       // Restart the browser.
       Services.startup.quit(Ci.nsIAppStartup.eAttemptQuit | Ci.nsIAppStartup.eRestart);
     }
   }
--- a/devtools/client/aboutdebugging/components/workers/Panel.js
+++ b/devtools/client/aboutdebugging/components/workers/Panel.js
@@ -48,17 +48,17 @@ class WorkersPanel extends Component {
     this.updateWorkers = this.updateWorkers.bind(this);
     this.isE10S = this.isE10S.bind(this);
     this.renderServiceWorkersError = this.renderServiceWorkersError.bind(this);
 
     this.state = this.initialState;
   }
 
   componentDidMount() {
-    let client = this.props.client;
+    const client = this.props.client;
     client.addListener("workerListChanged", this.updateWorkers);
     client.addListener("serviceWorkerRegistrationListChanged", this.updateWorkers);
     client.addListener("processListChanged", this.updateWorkers);
     client.addListener("registration-changed", this.updateWorkers);
 
     // Some notes about these observers:
     // - nsIPrefBranch.addObserver observes prefixes. In reality, watching
     //   PROCESS_COUNT_PREF watches two separate prefs:
@@ -74,17 +74,17 @@ class WorkersPanel extends Component {
     Services.prefs.addObserver(PROCESS_COUNT_PREF, this.updateMultiE10S);
     Services.prefs.addObserver(MULTI_OPTOUT_PREF, this.updateMultiE10S);
 
     this.updateMultiE10S();
     this.updateWorkers();
   }
 
   componentWillUnmount() {
-    let client = this.props.client;
+    const client = this.props.client;
     client.removeListener("processListChanged", this.updateWorkers);
     client.removeListener("serviceWorkerRegistrationListChanged", this.updateWorkers);
     client.removeListener("workerListChanged", this.updateWorkers);
     client.removeListener("registration-changed", this.updateWorkers);
 
     Services.prefs.removeObserver(PROCESS_COUNT_PREF, this.updateMultiE10S);
     Services.prefs.removeObserver(MULTI_OPTOUT_PREF, this.updateMultiE10S);
   }
@@ -98,22 +98,22 @@ class WorkersPanel extends Component {
       },
       processCount: 1,
     };
   }
 
   updateMultiE10S() {
     // We watch the pref but set the state based on
     // nsIXULRuntime.maxWebProcessCount.
-    let processCount = Services.appinfo.maxWebProcessCount;
+    const processCount = Services.appinfo.maxWebProcessCount;
     this.setState({ processCount });
   }
 
   updateWorkers() {
-    let workers = this.initialState.workers;
+    const workers = this.initialState.workers;
 
     this.props.client.mainRoot.listAllWorkers().then(({service, other, shared}) => {
       workers.service = service.map(f => Object.assign({ icon: WorkerIcon }, f));
       workers.other = other.map(f => Object.assign({ icon: WorkerIcon }, f));
       workers.shared = shared.map(f => Object.assign({ icon: WorkerIcon }, f));
 
       // XXX: Filter out the service worker registrations for which we couldn't
       // find the scriptSpec.
@@ -123,22 +123,23 @@ class WorkersPanel extends Component {
     });
   }
 
   isE10S() {
     return Services.appinfo.browserTabsRemoteAutostart;
   }
 
   renderServiceWorkersError() {
-    let isWindowPrivate = PrivateBrowsingUtils.isContentWindowPrivate(window);
-    let isPrivateBrowsingMode = PrivateBrowsingUtils.permanentPrivateBrowsing;
-    let isServiceWorkerDisabled = !Services.prefs
+    const isWindowPrivate = PrivateBrowsingUtils.isContentWindowPrivate(window);
+    const isPrivateBrowsingMode = PrivateBrowsingUtils.permanentPrivateBrowsing;
+    const isServiceWorkerDisabled = !Services.prefs
                                     .getBoolPref("dom.serviceWorkers.enabled");
 
-    let isDisabled = isWindowPrivate || isPrivateBrowsingMode || isServiceWorkerDisabled;
+    const isDisabled =
+      isWindowPrivate || isPrivateBrowsingMode || isServiceWorkerDisabled;
     if (!isDisabled) {
       return "";
     }
     return dom.p(
       {
         className: "service-worker-disabled"
       },
       dom.div({ className: "warning" }),
@@ -154,21 +155,21 @@ class WorkersPanel extends Component {
           target: "_blank"
         },
         Strings.GetStringFromName("configurationIsNotCompatible.learnMore")
       ),
     );
   }
 
   render() {
-    let { client, id } = this.props;
-    let { workers, processCount } = this.state;
+    const { client, id } = this.props;
+    const { workers, processCount } = this.state;
 
-    let isE10S = Services.appinfo.browserTabsRemoteAutostart;
-    let isMultiE10S = isE10S && processCount > 1;
+    const isE10S = Services.appinfo.browserTabsRemoteAutostart;
+    const isMultiE10S = isE10S && processCount > 1;
 
     return dom.div(
       {
         id: id + "-panel",
         className: "panel",
         role: "tabpanel",
         "aria-labelledby": id + "-header"
       },
--- a/devtools/client/aboutdebugging/components/workers/ServiceWorkerTarget.js
+++ b/devtools/client/aboutdebugging/components/workers/ServiceWorkerTarget.js
@@ -54,96 +54,96 @@ class ServiceWorkerTarget extends Compon
     this.isRunning = this.isRunning.bind(this);
     this.isActive = this.isActive.bind(this);
     this.getServiceWorkerStatus = this.getServiceWorkerStatus.bind(this);
     this.renderButtons = this.renderButtons.bind(this);
     this.renderUnregisterLink = this.renderUnregisterLink.bind(this);
   }
 
   componentDidMount() {
-    let { client } = this.props;
+    const { client } = this.props;
     client.addListener("push-subscription-modified", this.onPushSubscriptionModified);
     this.updatePushSubscription();
   }
 
   componentDidUpdate(oldProps, oldState) {
-    let wasActive = oldProps.target.active;
+    const wasActive = oldProps.target.active;
     if (!wasActive && this.isActive()) {
       // While the service worker isn't active, any calls to `updatePushSubscription`
       // won't succeed. If we just became active, make sure we didn't miss a push
       // subscription change by updating it now.
       this.updatePushSubscription();
     }
   }
 
   componentWillUnmount() {
-    let { client } = this.props;
+    const { client } = this.props;
     client.removeListener("push-subscription-modified", this.onPushSubscriptionModified);
   }
 
   debug() {
     if (!this.isRunning()) {
       // If the worker is not running, we can't debug it.
       return;
     }
 
-    let { client, target } = this.props;
+    const { client, target } = this.props;
     gDevToolsBrowser.openWorkerToolbox(client, target.workerActor);
   }
 
   push() {
     if (!this.isActive() || !this.isRunning()) {
       // If the worker is not running, we can't push to it.
       // If the worker is not active, the registration might be unavailable and the
       // push will not succeed.
       return;
     }
 
-    let { client, target } = this.props;
+    const { client, target } = this.props;
     client.request({
       to: target.workerActor,
       type: "push"
     });
   }
 
   start() {
     if (!this.isActive() || this.isRunning()) {
       // If the worker is not active or if it is already running, we can't start it.
       return;
     }
 
-    let { client, target } = this.props;
+    const { client, target } = this.props;
     client.request({
       to: target.registrationActor,
       type: "start"
     });
   }
 
   unregister() {
-    let { client, target } = this.props;
+    const { client, target } = this.props;
     client.request({
       to: target.registrationActor,
       type: "unregister"
     });
   }
 
   onPushSubscriptionModified(type, data) {
-    let { target } = this.props;
+    const { target } = this.props;
     if (data.from === target.registrationActor) {
       this.updatePushSubscription();
     }
   }
 
   updatePushSubscription() {
     if (!this.props.target.registrationActor) {
       // A valid registrationActor is needed to retrieve the push subscription.
       return;
     }
 
-    let { client, target } = this.props;
+    const { client, target } = this.props;
     client.request({
       to: target.registrationActor,
       type: "getPushSubscription"
     }, ({ subscription }) => {
       this.setState({ pushSubscription: subscription });
     });
   }
 
@@ -164,29 +164,29 @@ class ServiceWorkerTarget extends Compon
     }
     // We cannot get service worker registrations unless the registration is in
     // ACTIVE state. Unable to know the actual state ("installing", "waiting"), we
     // display a custom state "registering" for now. See Bug 1153292.
     return "registering";
   }
 
   renderButtons() {
-    let pushButton = dom.button({
+    const pushButton = dom.button({
       className: "push-button",
       onClick: this.push,
       disabled: this.props.debugDisabled
     }, Strings.GetStringFromName("push"));
 
-    let debugButton = dom.button({
+    const debugButton = dom.button({
       className: "debug-button",
       onClick: this.debug,
       disabled: this.props.debugDisabled
     }, Strings.GetStringFromName("debug"));
 
-    let startButton = dom.button({
+    const startButton = dom.button({
       className: "start-button",
       onClick: this.start,
       disabled: this.props.debugDisabled
     }, Strings.GetStringFromName("start"));
 
     if (this.isRunning()) {
       if (this.isActive()) {
         return [pushButton, debugButton];
@@ -205,21 +205,21 @@ class ServiceWorkerTarget extends Compon
 
     return dom.a({
       onClick: this.unregister,
       className: "unregister-link",
     }, Strings.GetStringFromName("unregister"));
   }
 
   render() {
-    let { target } = this.props;
-    let { pushSubscription } = this.state;
-    let status = this.getServiceWorkerStatus();
+    const { target } = this.props;
+    const { pushSubscription } = this.state;
+    const status = this.getServiceWorkerStatus();
 
-    let fetch = target.fetch ? Strings.GetStringFromName("listeningForFetchEvents") :
+    const fetch = target.fetch ? Strings.GetStringFromName("listeningForFetchEvents") :
       Strings.GetStringFromName("notListeningForFetchEvents");
 
     return dom.div({ className: "target-container" },
       dom.img({
         className: "target-icon",
         role: "presentation",
         src: target.icon
       }),
--- a/devtools/client/aboutdebugging/components/workers/Target.js
+++ b/devtools/client/aboutdebugging/components/workers/Target.js
@@ -33,22 +33,22 @@ class WorkerTarget extends Component {
   }
 
   constructor(props) {
     super(props);
     this.debug = this.debug.bind(this);
   }
 
   debug() {
-    let { client, target } = this.props;
+    const { client, target } = this.props;
     gDevToolsBrowser.openWorkerToolbox(client, target.workerActor);
   }
 
   render() {
-    let { target, debugDisabled } = this.props;
+    const { target, debugDisabled } = this.props;
 
     return dom.li({ className: "target-container" },
       dom.img({
         className: "target-icon",
         role: "presentation",
         src: target.icon
       }),
       dom.div({ className: "target" },
--- a/devtools/client/aboutdebugging/initializer.js
+++ b/devtools/client/aboutdebugging/initializer.js
@@ -32,22 +32,22 @@ const { createClient } = require("./modu
 var AboutDebugging = {
   async init() {
     if (!Services.prefs.getBoolPref("devtools.enabled", true)) {
       // If DevTools are disabled, navigate to about:devtools.
       window.location = "about:devtools?reason=AboutDebugging";
       return;
     }
 
-    let {connect, client} = await createClient();
+    const {connect, client} = await createClient();
 
     this.client = client;
     await this.client.connect();
 
-    let telemetry = new Telemetry();
+    const telemetry = new Telemetry();
 
     render(AboutDebuggingApp({ client, connect, telemetry }),
       document.querySelector("#body"));
   },
 
   destroy() {
     unmountComponentAtNode(document.querySelector("#body"));
 
--- a/devtools/client/aboutdebugging/modules/addon.js
+++ b/devtools/client/aboutdebugging/modules/addon.js
@@ -51,34 +51,34 @@ exports.debugLocalAddon = async function
  *        Necessary to create an addon debugging target.
  * @param {DebuggerClient} client
  *        Required for remote debugging.
  */
 exports.debugRemoteAddon = async function(addonForm, client) {
   // Close previous addon debugging toolbox.
   closeToolbox();
 
-  let options = {
+  const options = {
     form: addonForm,
     chrome: true,
     client,
     isTabActor: addonForm.isWebExtension
   };
 
-  let target = await TargetFactory.forRemoteTab(options);
+  const target = await TargetFactory.forRemoteTab(options);
 
-  let hostType = Toolbox.HostType.WINDOW;
+  const hostType = Toolbox.HostType.WINDOW;
   remoteAddonToolbox = await gDevTools.showToolbox(target, null, hostType);
   remoteAddonToolbox.once("destroy", () => {
     remoteAddonToolbox = null;
   });
 };
 
 exports.uninstallAddon = async function(addonID) {
-  let addon = await AddonManager.getAddonByID(addonID);
+  const addon = await AddonManager.getAddonByID(addonID);
   return addon && addon.uninstall();
 };
 
 exports.isTemporaryID = function(addonID) {
   return AddonManagerPrivate.isTemporaryInstallID(addonID);
 };
 
 exports.isLegacyTemporaryExtension = function(addonForm) {
--- a/devtools/client/aboutdebugging/modules/connect.js
+++ b/devtools/client/aboutdebugging/modules/connect.js
@@ -28,20 +28,20 @@ const TYPE = {
  *
  * @returns {Object}
  *          - type: {String} from TYPE ("LOCAL", "REMOTE")
  *          - params: {Object} additional metadata depending on the type.
  *            - if type === "LOCAL", empty object
  *            - if type === "REMOTE", {host: {String}, port: {String}}
  */
 function createDescriptorFromURL(url) {
-  let params = url.searchParams;
+  const params = url.searchParams;
 
-  let host = params.get("host");
-  let port = params.get("port");
+  const host = params.get("host");
+  const port = params.get("port");
 
   let descriptor;
   if (host && port) {
     descriptor = {
       type: TYPE.REMOTE,
       params: {host, port}
     };
   } else {
@@ -58,18 +58,18 @@ function createDescriptorFromURL(url) {
  * Returns a promise that resolves after creating a debugger client corresponding to the
  * provided options.
  *
  * @returns Promise that resolves an object with the following properties:
  *          - client: a DebuggerClient instance
  *          - connect: a connection descriptor, see doc for createDescriptorFromURL(url).
  */
 exports.createClient = async function() {
-  let href = window.location.href;
-  let url = new window.URL(href.replace("about:", "http://"));
+  const href = window.location.href;
+  const url = new window.URL(href.replace("about:", "http://"));
 
-  let connect = createDescriptorFromURL(url);
-  let client = await clientFromURL(url);
+  const connect = createDescriptorFromURL(url);
+  const client = await clientFromURL(url);
 
   DebuggerServer.allowChromeProcess = true;
 
   return {client, connect};
 };
--- a/devtools/client/aboutdebugging/test/browser_addons_debug_bootstrapped.js
+++ b/devtools/client/aboutdebugging/test/browser_addons_debug_bootstrapped.js
@@ -12,73 +12,73 @@ requestLongerTimeout(2);
 
 const ADDON_ID = "test-devtools@mozilla.org";
 const ADDON_NAME = "test-devtools";
 
 const { BrowserToolboxProcess } = ChromeUtils.import("resource://devtools/client/framework/ToolboxProcess.jsm", {});
 
 add_task(async function() {
   await new Promise(resolve => {
-    let options = {"set": [
+    const options = {"set": [
       // Force enabling of addons debugging
       ["devtools.chrome.enabled", true],
       ["devtools.debugger.remote-enabled", true],
       // Disable security prompt
       ["devtools.debugger.prompt-connection", false],
       // Enable Browser toolbox test script execution via env variable
       ["devtools.browser-toolbox.allow-unsafe-script", true],
     ]};
     SpecialPowers.pushPrefEnv(options, resolve);
   });
 
-  let { tab, document } = await openAboutDebugging("addons");
+  const { tab, document } = await openAboutDebugging("addons");
   await waitForInitialAddonList(document);
   await installAddon({
     document,
     path: "addons/unpacked/install.rdf",
     name: ADDON_NAME,
   });
 
   // Retrieve the DEBUG button for the addon
-  let names = getInstalledAddonNames(document);
-  let name = names.filter(element => element.textContent === ADDON_NAME)[0];
+  const names = getInstalledAddonNames(document);
+  const name = names.filter(element => element.textContent === ADDON_NAME)[0];
   ok(name, "Found the addon in the list");
-  let targetElement = name.parentNode.parentNode;
-  let debugBtn = targetElement.querySelector(".debug-button");
+  const targetElement = name.parentNode.parentNode;
+  const debugBtn = targetElement.querySelector(".debug-button");
   ok(debugBtn, "Found its debug button");
 
   // Wait for a notification sent by a script evaluated the test addon via
   // the web console.
-  let onCustomMessage = new Promise(done => {
+  const onCustomMessage = new Promise(done => {
     Services.obs.addObserver(function listener() {
       Services.obs.removeObserver(listener, "addon-console-works");
       done();
     }, "addon-console-works");
   });
 
   // Be careful, this JS function is going to be executed in the addon toolbox,
   // which lives in another process. So do not try to use any scope variable!
-  let env = Cc["@mozilla.org/process/environment;1"]
+  const env = Cc["@mozilla.org/process/environment;1"]
               .getService(Ci.nsIEnvironment);
-  let testScript = function() {
+  const testScript = function() {
     /* eslint-disable no-undef */
     toolbox.selectTool("webconsole")
       .then(console => {
-        let { jsterm } = console.hud;
+        const { jsterm } = console.hud;
         return jsterm.execute("myBootstrapAddonFunction()");
       })
       .then(() => toolbox.destroy());
     /* eslint-enable no-undef */
   };
   env.set("MOZ_TOOLBOX_TEST_SCRIPT", "new " + testScript);
   registerCleanupFunction(() => {
     env.set("MOZ_TOOLBOX_TEST_SCRIPT", "");
   });
 
-  let onToolboxClose = BrowserToolboxProcess.once("close");
+  const onToolboxClose = BrowserToolboxProcess.once("close");
 
   debugBtn.click();
 
   await onCustomMessage;
   ok(true, "Received the notification message from the bootstrap.js function");
 
   await onToolboxClose;
   ok(true, "Addon toolbox closed");
--- a/devtools/client/aboutdebugging/test/browser_addons_debug_info.js
+++ b/devtools/client/aboutdebugging/test/browser_addons_debug_info.js
@@ -1,118 +1,119 @@
 "use strict";
 
 const UUID_REGEX = /^([0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12})$/;
 
 function testFilePath(container, expectedFilePath) {
   // Verify that the path to the install location is shown next to its label.
-  let filePath = container.querySelector(".file-path");
+  const filePath = container.querySelector(".file-path");
   ok(filePath, "file path is in DOM");
   ok(filePath.textContent.endsWith(expectedFilePath), "file path is set correctly");
   is(filePath.previousElementSibling.textContent, "Location", "file path has label");
 }
 
 add_task(async function testLegacyAddon() {
-  let addonId = "test-devtools@mozilla.org";
-  let addonName = "test-devtools";
-  let { tab, document } = await openAboutDebugging("addons");
+  const addonId = "test-devtools@mozilla.org";
+  const addonName = "test-devtools";
+  const { tab, document } = await openAboutDebugging("addons");
   await waitForInitialAddonList(document);
 
   await installAddon({
     document,
     path: "addons/unpacked/install.rdf",
     name: addonName,
   });
 
-  let container = document.querySelector(`[data-addon-id="${addonId}"]`);
+  const container = document.querySelector(`[data-addon-id="${addonId}"]`);
   testFilePath(container, "browser/devtools/client/aboutdebugging/test/addons/unpacked/");
 
   await uninstallAddon({document, id: addonId, name: addonName});
 
   await closeAboutDebugging(tab);
 });
 
 add_task(async function testWebExtension() {
-  let addonId = "test-devtools-webextension-nobg@mozilla.org";
-  let addonName = "test-devtools-webextension-nobg";
-  let { tab, document } = await openAboutDebugging("addons");
+  const addonId = "test-devtools-webextension-nobg@mozilla.org";
+  const addonName = "test-devtools-webextension-nobg";
+  const { tab, document } = await openAboutDebugging("addons");
 
   await waitForInitialAddonList(document);
   await installAddon({
     document,
     path: "addons/test-devtools-webextension-nobg/manifest.json",
     name: addonName,
     isWebExtension: true
   });
 
-  let container = document.querySelector(`[data-addon-id="${addonId}"]`);
+  const container = document.querySelector(`[data-addon-id="${addonId}"]`);
   testFilePath(container, "/test/addons/test-devtools-webextension-nobg/");
 
-  let extensionID = container.querySelector(".extension-id span");
+  const extensionID = container.querySelector(".extension-id span");
   ok(extensionID.textContent === "test-devtools-webextension-nobg@mozilla.org");
 
-  let internalUUID = container.querySelector(".internal-uuid span");
+  const internalUUID = container.querySelector(".internal-uuid span");
   ok(internalUUID.textContent.match(UUID_REGEX), "internalUUID is correct");
 
-  let manifestURL = container.querySelector(".manifest-url");
+  const manifestURL = container.querySelector(".manifest-url");
   ok(manifestURL.href.startsWith("moz-extension://"), "href for manifestURL exists");
 
   await uninstallAddon({document, id: addonId, name: addonName});
 
   await closeAboutDebugging(tab);
 });
 
 add_task(async function testTemporaryWebExtension() {
-  let addonName = "test-devtools-webextension-noid";
-  let { tab, document } = await openAboutDebugging("addons");
+  const addonName = "test-devtools-webextension-noid";
+  const { tab, document } = await openAboutDebugging("addons");
 
   await waitForInitialAddonList(document);
   await installAddon({
     document,
     path: "addons/test-devtools-webextension-noid/manifest.json",
     name: addonName,
     isWebExtension: true
   });
 
-  let addons = document.querySelectorAll("#temporary-extensions .addon-target-container");
+  const addons =
+    document.querySelectorAll("#temporary-extensions .addon-target-container");
   // Assuming that our temporary add-on is now at the top.
-  let container = addons[addons.length - 1];
-  let addonId = container.dataset.addonId;
+  const container = addons[addons.length - 1];
+  const addonId = container.dataset.addonId;
 
-  let extensionID = container.querySelector(".extension-id span");
+  const extensionID = container.querySelector(".extension-id span");
   ok(extensionID.textContent.endsWith("@temporary-addon"));
 
-  let temporaryID = container.querySelector(".temporary-id-url");
+  const temporaryID = container.querySelector(".temporary-id-url");
   ok(temporaryID, "Temporary ID message does appear");
 
   await uninstallAddon({document, id: addonId, name: addonName});
 
   await closeAboutDebugging(tab);
 });
 
 add_task(async function testUnknownManifestProperty() {
-  let addonId = "test-devtools-webextension-unknown-prop@mozilla.org";
-  let addonName = "test-devtools-webextension-unknown-prop";
-  let { tab, document } = await openAboutDebugging("addons");
+  const addonId = "test-devtools-webextension-unknown-prop@mozilla.org";
+  const addonName = "test-devtools-webextension-unknown-prop";
+  const { tab, document } = await openAboutDebugging("addons");
 
   await waitForInitialAddonList(document);
   await installAddon({
     document,
     path: "addons/test-devtools-webextension-unknown-prop/manifest.json",
     name: addonName,
     isWebExtension: true
   });
 
   info("Wait until the addon appears in about:debugging");
-  let container = await waitUntilAddonContainer(addonName, document);
+  const container = await waitUntilAddonContainer(addonName, document);
 
   info("Wait until the installation message appears for the new addon");
   await waitUntilElement(".addon-target-messages", container);
 
-  let messages = container.querySelectorAll(".addon-target-message");
+  const messages = container.querySelectorAll(".addon-target-message");
   ok(messages.length === 1, "there is one message");
   ok(messages[0].textContent.match(/Error processing browser_actions/),
      "the message is helpful");
   ok(messages[0].classList.contains("addon-target-warning-message"),
      "the message is a warning");
 
   await uninstallAddon({document, id: addonId, name: addonName});
 
--- a/devtools/client/aboutdebugging/test/browser_addons_debug_webextension.js
+++ b/devtools/client/aboutdebugging/test/browser_addons_debug_webextension.js
@@ -20,25 +20,25 @@ const {
 } = ChromeUtils.import("resource://devtools/client/framework/ToolboxProcess.jsm", {});
 
 /**
  * This test file ensures that the webextension addon developer toolbox:
  * - when the debug button is clicked on a webextension, the opened toolbox
  *   has a working webconsole with the background page as default target;
  */
 add_task(async function testWebExtensionsToolboxWebConsole() {
-  let {
+  const {
     tab, document, debugBtn,
   } = await setupTestAboutDebuggingWebExtension(ADDON_NAME, ADDON_MANIFEST_PATH);
 
   // Be careful, this JS function is going to be executed in the addon toolbox,
   // which lives in another process. So do not try to use any scope variable!
-  let env = Cc["@mozilla.org/process/environment;1"]
+  const env = Cc["@mozilla.org/process/environment;1"]
               .getService(Ci.nsIEnvironment);
-  let testScript = function() {
+  const testScript = function() {
     /* eslint-disable no-undef */
     function findMessages(hud, text, selector = ".message") {
       const messages = hud.ui.outputNode.querySelectorAll(selector);
       const elements = Array.prototype.filter.call(
         messages,
         (el) => el.textContent.includes(text)
       );
       return elements;
@@ -47,34 +47,34 @@ add_task(async function testWebExtension
     async function waitFor(condition) {
       while (!condition()) {
         await new Promise(done => window.setTimeout(done, 1000));
       }
     }
 
     toolbox.selectTool("webconsole")
       .then(async console => {
-        let { hud } = console;
-        let { jsterm } = hud;
-        let onMessage = waitFor(() => {
+        const { hud } = console;
+        const { jsterm } = hud;
+        const onMessage = waitFor(() => {
           return findMessages(hud, "Background page function called").length > 0;
         });
         await jsterm.execute("myWebExtensionAddonFunction()");
         await onMessage;
         await toolbox.destroy();
       })
       .catch(e => dump("Exception from browser toolbox process: " + e + "\n"));
     /* eslint-enable no-undef */
   };
   env.set("MOZ_TOOLBOX_TEST_SCRIPT", "new " + testScript);
   registerCleanupFunction(() => {
     env.set("MOZ_TOOLBOX_TEST_SCRIPT", "");
   });
 
-  let onToolboxClose = BrowserToolboxProcess.once("close");
+  const onToolboxClose = BrowserToolboxProcess.once("close");
 
   debugBtn.click();
 
   await onToolboxClose;
   ok(true, "Addon toolbox closed");
 
   await uninstallAddon({document, id: ADDON_ID, name: ADDON_NAME});
   await closeAboutDebugging(tab);
--- a/devtools/client/aboutdebugging/test/browser_addons_debug_webextension_inspector.js
+++ b/devtools/client/aboutdebugging/test/browser_addons_debug_webextension_inspector.js
@@ -19,25 +19,25 @@ const {
 } = ChromeUtils.import("resource://devtools/client/framework/ToolboxProcess.jsm", {});
 
 /**
  * This test file ensures that the webextension addon developer toolbox:
  * - the webextension developer toolbox has a working Inspector panel, with the
  *   background page as default target;
  */
 add_task(async function testWebExtensionsToolboxInspector() {
-  let {
+  const {
     tab, document, debugBtn,
   } = await setupTestAboutDebuggingWebExtension(ADDON_NAME, ADDON_PATH);
 
   // Be careful, this JS function is going to be executed in the addon toolbox,
   // which lives in another process. So do not try to use any scope variable!
-  let env = Cc["@mozilla.org/process/environment;1"]
+  const env = Cc["@mozilla.org/process/environment;1"]
         .getService(Ci.nsIEnvironment);
-  let testScript = function() {
+  const testScript = function() {
     /* eslint-disable no-undef */
     toolbox.selectTool("inspector")
       .then(inspector => {
         return inspector.walker.querySelector(inspector.walker.rootNode, "body");
       })
       .then((nodeActor) => {
         if (!nodeActor) {
           throw new Error("nodeActor not found");
@@ -46,18 +46,18 @@ add_task(async function testWebExtension
         dump("Got a nodeActor\n");
 
         if (!(nodeActor.inlineTextChild)) {
           throw new Error("inlineTextChild not found");
         }
 
         dump("Got a nodeActor with an inline text child\n");
 
-        let expectedValue = "Background Page Body Test Content";
-        let actualValue = nodeActor.inlineTextChild._form.nodeValue;
+        const expectedValue = "Background Page Body Test Content";
+        const actualValue = nodeActor.inlineTextChild._form.nodeValue;
 
         if (String(actualValue).trim() !== String(expectedValue).trim()) {
           throw new Error(
             `mismatched inlineTextchild value: "${actualValue}" !== "${expectedValue}"`
           );
         }
 
         dump("Got the expected inline text content in the selected node\n");
@@ -71,17 +71,17 @@ add_task(async function testWebExtension
       });
     /* eslint-enable no-undef */
   };
   env.set("MOZ_TOOLBOX_TEST_SCRIPT", "new " + testScript);
   registerCleanupFunction(() => {
     env.set("MOZ_TOOLBOX_TEST_SCRIPT", "");
   });
 
-  let onToolboxClose = BrowserToolboxProcess.once("close");
+  const onToolboxClose = BrowserToolboxProcess.once("close");
   debugBtn.click();
   await onToolboxClose;
 
   ok(true, "Addon toolbox closed");
 
   await uninstallAddon({document, id: ADDON_ID, name: ADDON_NAME});
   await closeAboutDebugging(tab);
 });
--- a/devtools/client/aboutdebugging/test/browser_addons_debug_webextension_nobg.js
+++ b/devtools/client/aboutdebugging/test/browser_addons_debug_webextension_nobg.js
@@ -21,25 +21,25 @@ const {
 /**
  * This test file ensures that the webextension addon developer toolbox:
  * - the webextension developer toolbox is connected to a fallback page when the
  *   background page is not available (and in the fallback page document body contains
  *   the expected message, which warns the user that the current page is not a real
  *   webextension context);
  */
 add_task(async function testWebExtensionsToolboxNoBackgroundPage() {
-  let {
+  const {
     tab, document, debugBtn,
   } = await setupTestAboutDebuggingWebExtension(ADDON_NOBG_NAME, ADDON_NOBG_PATH);
 
   // Be careful, this JS function is going to be executed in the addon toolbox,
   // which lives in another process. So do not try to use any scope variable!
-  let env = Cc["@mozilla.org/process/environment;1"]
+  const env = Cc["@mozilla.org/process/environment;1"]
         .getService(Ci.nsIEnvironment);
-  let testScript = function() {
+  const testScript = function() {
     /* eslint-disable no-undef */
     toolbox.selectTool("inspector")
       .then(inspector => {
         return inspector.walker.querySelector(inspector.walker.rootNode, "body");
       })
       .then((nodeActor) => {
         if (!nodeActor) {
           throw new Error("nodeActor not found");
@@ -48,18 +48,18 @@ add_task(async function testWebExtension
         dump("Got a nodeActor\n");
 
         if (!(nodeActor.inlineTextChild)) {
           throw new Error("inlineTextChild not found");
         }
 
         dump("Got a nodeActor with an inline text child\n");
 
-        let expectedValue = "Your addon does not have any document opened yet.";
-        let actualValue = nodeActor.inlineTextChild._form.nodeValue;
+        const expectedValue = "Your addon does not have any document opened yet.";
+        const actualValue = nodeActor.inlineTextChild._form.nodeValue;
 
         if (actualValue !== expectedValue) {
           throw new Error(
             `mismatched inlineTextchild value: "${actualValue}" !== "${expectedValue}"`
           );
         }
 
         dump("Got the expected inline text content in the selected node\n");
@@ -73,17 +73,17 @@ add_task(async function testWebExtension
       });
     /* eslint-enable no-undef */
   };
   env.set("MOZ_TOOLBOX_TEST_SCRIPT", "new " + testScript);
   registerCleanupFunction(() => {
     env.set("MOZ_TOOLBOX_TEST_SCRIPT", "");
   });
 
-  let onToolboxClose = BrowserToolboxProcess.once("close");
+  const onToolboxClose = BrowserToolboxProcess.once("close");
   debugBtn.click();
   await onToolboxClose;
 
   ok(true, "Addon toolbox closed");
 
   await uninstallAddon({document, id: ADDON_NOBG_ID, name: ADDON_NOBG_NAME});
   await closeAboutDebugging(tab);
 });
--- a/devtools/client/aboutdebugging/test/browser_addons_debug_webextension_popup.js
+++ b/devtools/client/aboutdebugging/test/browser_addons_debug_webextension_popup.js
@@ -71,25 +71,25 @@ add_task(async function testWebExtension
     // to be ready for selecting the popup page in the frame list selector.
     onReadyForOpenPopup = waitForExtensionTestMessage("readyForOpenPopup");
 
     // Wait for a notification sent by a script evaluated the test addon via
     // the web console.
     onPopupCustomMessage = waitForExtensionTestMessage("popupPageFunctionCalled");
   });
 
-  let {
+  const {
     tab, document, debugBtn,
   } = await setupTestAboutDebuggingWebExtension(ADDON_NAME, ADDON_MANIFEST_PATH);
 
   // Be careful, this JS function is going to be executed in the addon toolbox,
   // which lives in another process. So do not try to use any scope variable!
-  let env = Cc["@mozilla.org/process/environment;1"].getService(Ci.nsIEnvironment);
+  const env = Cc["@mozilla.org/process/environment;1"].getService(Ci.nsIEnvironment);
 
-  let testScript = function() {
+  const testScript = function() {
     /* eslint-disable no-undef */
 
     let jsterm;
     let popupFramePromise;
 
     toolbox.selectTool("webconsole")
       .then(async (console) => {
         const clickNoAutoHideMenu = () => {
@@ -104,59 +104,59 @@ add_task(async function testWebExtension
           });
         };
 
         dump(`Clicking the menu button\n`);
         await clickNoAutoHideMenu();
         dump(`Clicked the menu button\n`);
 
         popupFramePromise = new Promise(resolve => {
-          let listener = data => {
+          const listener = data => {
             if (data.frames.some(({url}) => url && url.endsWith("popup.html"))) {
               toolbox.target.off("frame-update", listener);
               resolve();
             }
           };
           toolbox.target.on("frame-update", listener);
         });
 
-        let waitForFrameListUpdate = toolbox.target.once("frame-update");
+        const waitForFrameListUpdate = toolbox.target.once("frame-update");
 
         jsterm = console.hud.jsterm;
         jsterm.execute("myWebExtensionShowPopup()");
 
         await Promise.all([
           // Wait the initial frame update (which list the background page).
           waitForFrameListUpdate,
           // Wait the new frame update (once the extension popup has been opened).
           popupFramePromise,
         ]);
 
         dump(`Clicking the frame list button\n`);
-        let btn = toolbox.doc.getElementById("command-button-frames");
-        let frameMenu = await toolbox.showFramesMenu({target: btn});
+        const btn = toolbox.doc.getElementById("command-button-frames");
+        const frameMenu = await toolbox.showFramesMenu({target: btn});
         dump(`Clicked the frame list button\n`);
 
         await frameMenu.once("open");
 
-        let frames = frameMenu.items;
+        const frames = frameMenu.items;
 
         if (frames.length != 2) {
           throw Error(`Number of frames found is wrong: ${frames.length} != 2`);
         }
 
-        let popupFrameBtn = frames.filter((frame) => {
+        const popupFrameBtn = frames.filter((frame) => {
           return frame.label.endsWith("popup.html");
         }).pop();
 
         if (!popupFrameBtn) {
           throw Error("Extension Popup frame not found in the listed frames");
         }
 
-        let waitForNavigated = toolbox.target.once("navigate");
+        const waitForNavigated = toolbox.target.once("navigate");
 
         popupFrameBtn.click();
 
         await waitForNavigated;
 
         await jsterm.execute("myWebExtensionPopupAddonFunction()");
 
         await toolbox.destroy();
@@ -168,30 +168,30 @@ add_task(async function testWebExtension
       });
     /* eslint-enable no-undef */
   };
   env.set("MOZ_TOOLBOX_TEST_SCRIPT", "new " + testScript);
   registerCleanupFunction(() => {
     env.set("MOZ_TOOLBOX_TEST_SCRIPT", "");
   });
 
-  let onToolboxClose = BrowserToolboxProcess.once("close");
+  const onToolboxClose = BrowserToolboxProcess.once("close");
 
   debugBtn.click();
 
   await onReadyForOpenPopup;
 
-  let browserActionId = makeWidgetId(ADDON_ID) + "-browser-action";
-  let browserActionEl = window.document.getElementById(browserActionId);
+  const browserActionId = makeWidgetId(ADDON_ID) + "-browser-action";
+  const browserActionEl = window.document.getElementById(browserActionId);
 
   ok(browserActionEl, "Got the browserAction button from the browser UI");
   browserActionEl.click();
   info("Clicked on the browserAction button");
 
-  let args = await onPopupCustomMessage;
+  const args = await onPopupCustomMessage;
   ok(true, "Received console message from the popup page function as expected");
   is(args[0], "popupPageFunctionCalled", "Got the expected console message");
   is(args[1] && args[1].name, ADDON_NAME,
      "Got the expected manifest from WebExtension API");
 
   await onToolboxClose;
 
   ok(true, "Addon toolbox closed");
--- a/devtools/client/aboutdebugging/test/browser_addons_debugging_initial_state.js
+++ b/devtools/client/aboutdebugging/test/browser_addons_debugging_initial_state.js
@@ -26,48 +26,48 @@ const TEST_DATA = [
   }, {
     chromeEnabled: true,
     debuggerRemoteEnable: true,
     expected: true,
   }
 ];
 
 add_task(async function() {
-  for (let testData of TEST_DATA) {
+  for (const testData of TEST_DATA) {
     await testCheckboxState(testData);
   }
 });
 
 async function testCheckboxState(testData) {
   info("Set preferences as defined by the current test data.");
   await new Promise(resolve => {
-    let options = {"set": [
+    const options = {"set": [
       ["devtools.chrome.enabled", testData.chromeEnabled],
       ["devtools.debugger.remote-enabled", testData.debuggerRemoteEnable],
     ]};
     SpecialPowers.pushPrefEnv(options, resolve);
   });
 
-  let { tab, document } = await openAboutDebugging("addons");
+  const { tab, document } = await openAboutDebugging("addons");
   await waitForInitialAddonList(document);
 
   info("Install a test addon.");
   await installAddon({
     document,
     path: "addons/unpacked/install.rdf",
     name: ADDON_NAME,
   });
 
   info("Test checkbox checked state.");
-  let addonDebugCheckbox = document.querySelector("#enable-addon-debugging");
+  const addonDebugCheckbox = document.querySelector("#enable-addon-debugging");
   is(addonDebugCheckbox.checked, testData.expected,
     "Addons debugging checkbox should be in expected state.");
 
   info("Test debug buttons disabled state.");
-  let debugButtons = [...document.querySelectorAll("#addons .debug-button")];
+  const debugButtons = [...document.querySelectorAll("#addons .debug-button")];
   ok(debugButtons.every(b => b.disabled != testData.expected),
     "Debug buttons should be in the expected state");
 
   info("Uninstall test addon installed earlier.");
   await uninstallAddon({document, id: ADDON_ID, name: ADDON_NAME});
 
   await closeAboutDebugging(tab);
 }
--- a/devtools/client/aboutdebugging/test/browser_addons_install.js
+++ b/devtools/client/aboutdebugging/test/browser_addons_install.js
@@ -7,115 +7,115 @@ loader.lazyImporter(this, "AddonTestUtil
 
 AddonTestUtils.initMochitest(this);
 
 const ADDON_ID = "test-devtools@mozilla.org";
 const ADDON_NAME = "test-devtools";
 
 function mockFilePicker(window, file) {
   // Mock the file picker to select a test addon
-  let MockFilePicker = SpecialPowers.MockFilePicker;
+  const MockFilePicker = SpecialPowers.MockFilePicker;
   MockFilePicker.init(window);
   MockFilePicker.setFiles([file]);
 }
 
 /**
  * Write out an extension with a manifest.json to dir.
  *
  * @param {object} manfiest
  *        The manifest file as an object.
  * @param {nsIFile} dir
  *        An nsIFile for representing the output folder.
  * @return {Promise} Promise that resolves to the output folder when done.
  */
 function promiseWriteWebManifestForExtension(manifest, dir) {
-  let files = {
+  const files = {
     "manifest.json": JSON.stringify(manifest),
   };
   return AddonTestUtils.promiseWriteFilesToExtension(
     dir.path, manifest.applications.gecko.id, files, true);
 }
 
 add_task(async function testLegacyInstallSuccess() {
-  let { tab, document } = await openAboutDebugging("addons");
+  const { tab, document } = await openAboutDebugging("addons");
   await waitForInitialAddonList(document);
 
   // Install this add-on, and verify that it appears in the about:debugging UI
   await installAddon({
     document,
     path: "addons/unpacked/install.rdf",
     name: ADDON_NAME,
   });
 
   // Install the add-on, and verify that it disappears in the about:debugging UI
   await uninstallAddon({document, id: ADDON_ID, name: ADDON_NAME});
 
   await closeAboutDebugging(tab);
 });
 
 add_task(async function testWebextensionInstallError() {
-  let { tab, document, window } = await openAboutDebugging("addons");
+  const { tab, document, window } = await openAboutDebugging("addons");
   await waitForInitialAddonList(document);
 
   // Trigger the file picker by clicking on the button
   mockFilePicker(window, getSupportsFile("addons/bad/manifest.json").file);
   document.getElementById("load-addon-from-file").click();
 
   info("wait for the install error to appear");
-  let top = document.querySelector(".addons-top");
+  const top = document.querySelector(".addons-top");
   await waitUntilElement(".addons-install-error", top);
 
   await closeAboutDebugging(tab);
 });
 
 add_task(async function testWebextensionInstallErrorRetry() {
-  let { tab, document, window } = await openAboutDebugging("addons");
+  const { tab, document, window } = await openAboutDebugging("addons");
   await waitForInitialAddonList(document);
 
-  let tempdir = AddonTestUtils.tempDir.clone();
-  let addonId = "invalid-addon-install-retry@mozilla.org";
-  let addonName = "invalid-addon-install-retry";
-  let manifest = {
+  const tempdir = AddonTestUtils.tempDir.clone();
+  const addonId = "invalid-addon-install-retry@mozilla.org";
+  const addonName = "invalid-addon-install-retry";
+  const manifest = {
     name: addonName,
     description: "test invalid-addon-install-retry",
     // eslint-disable-next-line camelcase
     manifest_version: 2,
     version: "1.0",
     applications: { gecko: { id: addonId } },
     // These should all be wrapped in arrays.
     // eslint-disable-next-line camelcase
     content_scripts: { matches: "http://*/", js: "foo.js" },
   };
 
   await promiseWriteWebManifestForExtension(manifest, tempdir);
 
   // Mock the file picker to select a test addon.
-  let manifestFile = tempdir.clone();
+  const manifestFile = tempdir.clone();
   manifestFile.append(addonId, "manifest.json");
   mockFilePicker(window, manifestFile);
 
   // Trigger the file picker by clicking on the button.
   document.getElementById("load-addon-from-file").click();
 
   info("wait for the install error to appear");
-  let top = document.querySelector(".addons-top");
+  const top = document.querySelector(".addons-top");
   await waitUntilElement(".addons-install-error", top);
 
-  let retryButton = document.querySelector("button.addons-install-retry");
+  const retryButton = document.querySelector("button.addons-install-retry");
   is(retryButton.textContent, "Retry", "Retry button has a good label");
 
   // Fix the manifest so the add-on will install.
   // eslint-disable-next-line camelcase
   manifest.content_scripts = [{
     matches: ["http://*/"],
     js: ["foo.js"],
   }];
   await promiseWriteWebManifestForExtension(manifest, tempdir);
 
-  let addonEl = document.querySelector(`[data-addon-id="${addonId}"]`);
+  const addonEl = document.querySelector(`[data-addon-id="${addonId}"]`);
   // Verify this add-on isn't installed yet.
   ok(!addonEl, "Addon is not installed yet");
 
   // Retry the install.
   retryButton.click();
 
   info("Wait for the add-on to be shown");
   await waitUntilElement(`[data-addon-id="${addonId}"]`, document);
--- a/devtools/client/aboutdebugging/test/browser_addons_reload.js
+++ b/devtools/client/aboutdebugging/test/browser_addons_reload.js
@@ -77,17 +77,17 @@ add_task(async function reloadButtonRelo
   const onBootstrapInstallCalled = new Promise(done => {
     Services.obs.addObserver(function listener() {
       Services.obs.removeObserver(listener, ADDON_NAME);
       info("Add-on was re-installed: " + ADDON_NAME);
       done();
     }, ADDON_NAME);
   });
 
-  let reloaded = once(AboutDebugging, "addon-reload");
+  const reloaded = once(AboutDebugging, "addon-reload");
   reloadButton.click();
   await reloaded;
 
   const [reloadedAddon] = await onInstalled;
   is(reloadedAddon.name, ADDON_NAME,
      "Add-on was reloaded: " + reloadedAddon.name);
 
   await onBootstrapInstallCalled;
@@ -124,17 +124,17 @@ add_task(async function reloadButtonRefr
   await waitUntilAddonContainer("Temporary web extension", document);
 
   const newName = "Temporary web extension (updated)";
   tempExt.writeManifest(Object.assign({}, manifestBase, {name: newName}));
 
   // Wait for the add-on list to be updated with the reloaded name.
   const onReInstall = promiseAddonEvent("onInstalled");
   const reloadButton = getReloadButton(document, manifestBase.name);
-  let reloaded = once(AboutDebugging, "addon-reload");
+  const reloaded = once(AboutDebugging, "addon-reload");
   reloadButton.click();
   await reloaded;
 
   info("Wait until addon onInstalled event is received again");
   const [reloadedAddon] = await onReInstall;
 
   info("Wait until addon name is updated in about:debugging#addons");
   await waitUntilAddonContainer(newName, document);
--- a/devtools/client/aboutdebugging/test/browser_addons_toggle_debug.js
+++ b/devtools/client/aboutdebugging/test/browser_addons_toggle_debug.js
@@ -7,38 +7,38 @@
 // Test that the buttons are updated dynamically if the preference changes.
 
 const ADDON_ID = "test-devtools@mozilla.org";
 const ADDON_NAME = "test-devtools";
 
 add_task(async function() {
   info("Turn off addon debugging.");
   await new Promise(resolve => {
-    let options = {"set": [
+    const options = {"set": [
       ["devtools.chrome.enabled", false],
       ["devtools.debugger.remote-enabled", false],
     ]};
     SpecialPowers.pushPrefEnv(options, resolve);
   });
 
-  let { tab, document } = await openAboutDebugging("addons");
+  const { tab, document } = await openAboutDebugging("addons");
   await waitForInitialAddonList(document);
 
   info("Install a test addon.");
   await installAddon({
     document,
     path: "addons/unpacked/install.rdf",
     name: ADDON_NAME,
   });
 
-  let addonDebugCheckbox = document.querySelector("#enable-addon-debugging");
+  const addonDebugCheckbox = document.querySelector("#enable-addon-debugging");
   ok(!addonDebugCheckbox.checked, "Addons debugging should be disabled.");
 
   info("Check all debug buttons are disabled.");
-  let debugButtons = [...document.querySelectorAll("#addons .debug-button")];
+  const debugButtons = [...document.querySelectorAll("#addons .debug-button")];
   ok(debugButtons.every(b => b.disabled), "Debug buttons should be disabled");
 
   info("Click on 'Enable addons debugging' checkbox.");
   addonDebugCheckbox.click();
 
   info("Wait until all debug buttons are enabled.");
   waitUntil(() => addonDebugCheckbox.checked && areDebugButtonsEnabled(document), 100);
   info("Addons debugging should be enabled and debug buttons are enabled");
--- a/devtools/client/aboutdebugging/test/browser_page_not_found.js
+++ b/devtools/client/aboutdebugging/test/browser_page_not_found.js
@@ -2,17 +2,17 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 "use strict";
 
 // Test that navigating to a about:debugging#invalid-hash should show up an
 // error page.
 // Every url navigating including #invalid-hash should be kept in history and
 // navigate back as expected.
 add_task(async function() {
-  let { tab, document } = await openAboutDebugging("invalid-hash");
+  const { tab, document } = await openAboutDebugging("invalid-hash");
   let element = document.querySelector(".header-name");
   is(element.textContent, "Page not found", "Show error page");
 
   info("Opening addons-panel panel");
   document.querySelector("[aria-controls='addons-panel']").click();
   await waitUntilElement("#addons-panel", document);
 
   await waitForInitialAddonList(document);
--- a/devtools/client/aboutdebugging/test/browser_service_workers.js
+++ b/devtools/client/aboutdebugging/test/browser_service_workers.js
@@ -6,21 +6,21 @@
 // Service workers can't be loaded from chrome://,
 // but http:// is ok with dom.serviceWorkers.testing.enabled turned on.
 const SERVICE_WORKER = URL_ROOT + "service-workers/empty-sw.js";
 const TAB_URL = URL_ROOT + "service-workers/empty-sw.html";
 
 add_task(async function() {
   await enableServiceWorkerDebugging();
 
-  let { tab, document } = await openAboutDebugging("workers");
+  const { tab, document } = await openAboutDebugging("workers");
 
-  let swTab = await addTab(TAB_URL);
+  const swTab = await addTab(TAB_URL);
 
-  let serviceWorkersElement = getServiceWorkerList(document);
+  const serviceWorkersElement = getServiceWorkerList(document);
 
   await waitUntil(() => {
     // Check that the service worker appears in the UI
     let names = [...document.querySelectorAll("#service-workers .target-name")];
     names = names.map(element => element.textContent);
     return names.includes(SERVICE_WORKER);
   });
   info("The service worker url appears in the list");
--- a/devtools/client/aboutdebugging/test/browser_service_workers_fetch_flag.js
+++ b/devtools/client/aboutdebugging/test/browser_service_workers_fetch_flag.js
@@ -5,21 +5,21 @@
 
 // Service workers can't be loaded from chrome://,
 // but http:// is ok with dom.serviceWorkers.testing.enabled turned on.
 const EMPTY_SW_TAB_URL = URL_ROOT + "service-workers/empty-sw.html";
 const FETCH_SW_TAB_URL = URL_ROOT + "service-workers/fetch-sw.html";
 
 async function testBody(url, expecting) {
   await enableServiceWorkerDebugging();
-  let { tab, document } = await openAboutDebugging("workers");
+  const { tab, document } = await openAboutDebugging("workers");
 
-  let swTab = await addTab(url);
+  const swTab = await addTab(url);
 
-  let serviceWorkersElement = getServiceWorkerList(document);
+  const serviceWorkersElement = getServiceWorkerList(document);
 
   info("Wait for fetch flag.");
   await waitUntil(() => {
     let fetchFlags =
       [...document.querySelectorAll("#service-workers .service-worker-fetch-flag")];
     fetchFlags = fetchFlags.map(element => element.textContent);
     return fetchFlags.includes(expecting);
   }, 100);
--- a/devtools/client/aboutdebugging/test/browser_service_workers_multi_content_process.js
+++ b/devtools/client/aboutdebugging/test/browser_service_workers_multi_content_process.js
@@ -10,52 +10,52 @@
 const SERVICE_WORKER = URL_ROOT + "service-workers/empty-sw.js";
 const TAB_URL = URL_ROOT + "service-workers/empty-sw.html";
 
 add_task(async function() {
   await enableServiceWorkerDebugging();
   info("Force two content processes");
   await pushPref("dom.ipc.processCount", 2);
 
-  let { tab, document } = await openAboutDebugging("workers");
+  const { tab, document } = await openAboutDebugging("workers");
 
-  let warningSection = document.querySelector(".service-worker-multi-process");
-  let img = warningSection.querySelector(".warning");
+  const warningSection = document.querySelector(".service-worker-multi-process");
+  const img = warningSection.querySelector(".warning");
   ok(img, "warning message is rendered");
 
-  let serviceWorkersElement = getServiceWorkerList(document);
+  const serviceWorkersElement = getServiceWorkerList(document);
 
-  let swTab = await addTab(TAB_URL, { background: true });
+  const swTab = await addTab(TAB_URL, { background: true });
 
   info("Wait for service worker to appear in the list");
   // Check that the service worker appears in the UI
-  let serviceWorkerContainer =
+  const serviceWorkerContainer =
     await waitUntilServiceWorkerContainer(SERVICE_WORKER, document);
 
   info("Wait until the service worker is running and the Debug button appears");
   await waitUntil(() => {
     return !!getDebugButton(serviceWorkerContainer);
   }, 100);
 
   info("Check that service worker buttons are disabled.");
   let debugButton = getDebugButton(serviceWorkerContainer);
   ok(debugButton.disabled, "Start/Debug button is disabled");
 
   info("Update the preference to 1");
-  let onWarningCleared = waitUntil(() => {
-    let hasWarning = document.querySelector(".service-worker-multi-process");
+  const onWarningCleared = waitUntil(() => {
+    const hasWarning = document.querySelector(".service-worker-multi-process");
     return !hasWarning && !debugButton.disabled;
   }, 100);
   await pushPref("dom.ipc.processCount", 1);
   await onWarningCleared;
   ok(!debugButton.disabled, "Debug button is enabled.");
 
   info("Update the preference back to 2");
-  let onWarningRestored = waitUntil(() => {
-    let hasWarning = document.querySelector(".service-worker-multi-process");
+  const onWarningRestored = waitUntil(() => {
+    const hasWarning = document.querySelector(".service-worker-multi-process");
     return hasWarning && getDebugButton(serviceWorkerContainer).disabled;
   }, 100);
   await pushPref("dom.ipc.processCount", 2);
   await onWarningRestored;
 
   // Update the reference to the debugButton, as the previous DOM element might have been
   // deleted.
   debugButton = getDebugButton(serviceWorkerContainer);
--- a/devtools/client/aboutdebugging/test/browser_service_workers_not_compatible.js
+++ b/devtools/client/aboutdebugging/test/browser_service_workers_not_compatible.js
@@ -9,52 +9,52 @@
 // 2. the about:debugging pannel is openned in private browsing mode
 // 3. the about:debugging pannel is openned in private content window
 
 var imgClass = ".service-worker-disabled .warning";
 
 add_task(async function() {
   await new Promise(done => {
     info("disable service workers");
-    let options = {"set": [
+    const options = {"set": [
       ["dom.serviceWorkers.enabled", false],
     ]};
     SpecialPowers.pushPrefEnv(options, done);
   });
 
-  let { tab, document } = await openAboutDebugging("workers");
+  const { tab, document } = await openAboutDebugging("workers");
   // Check that the warning img appears in the UI
-  let img = document.querySelector(imgClass);
+  const img = document.querySelector(imgClass);
   ok(img, "warning message is rendered");
 
   await closeAboutDebugging(tab);
 });
 
 add_task(async function() {
   await new Promise(done => {
     info("set private browsing mode as default");
-    let options = {"set": [
+    const options = {"set": [
       ["browser.privatebrowsing.autostart", true],
     ]};
     SpecialPowers.pushPrefEnv(options, done);
   });
 
-  let { tab, document } = await openAboutDebugging("workers");
+  const { tab, document } = await openAboutDebugging("workers");
   // Check that the warning img appears in the UI
-  let img = document.querySelector(imgClass);
+  const img = document.querySelector(imgClass);
   ok(img, "warning message is rendered");
 
   await closeAboutDebugging(tab);
 });
 
 add_task(async function() {
   info("Opening a new private window");
-  let win = OpenBrowserWindow({private: true});
+  const win = OpenBrowserWindow({private: true});
   await waitForDelayedStartupFinished(win);
 
-  let { tab, document } = await openAboutDebugging("workers", win);
+  const { tab, document } = await openAboutDebugging("workers", win);
   // Check that the warning img appears in the UI
-  let img = document.querySelector(imgClass);
+  const img = document.querySelector(imgClass);
   ok(img, "warning message is rendered");
 
   await closeAboutDebugging(tab);
   win.close();
 });
--- a/devtools/client/aboutdebugging/test/browser_service_workers_push.js
+++ b/devtools/client/aboutdebugging/test/browser_service_workers_push.js
@@ -11,62 +11,62 @@
 
 // Service workers can't be loaded from chrome://, but http:// is ok with
 // dom.serviceWorkers.testing.enabled turned on.
 const SERVICE_WORKER = URL_ROOT + "service-workers/push-sw.js";
 const TAB_URL = URL_ROOT + "service-workers/push-sw.html";
 
 add_task(async function() {
   await enableServiceWorkerDebugging();
-  let { tab, document } = await openAboutDebugging("workers");
+  const { tab, document } = await openAboutDebugging("workers");
 
   // Listen for mutations in the service-workers list.
-  let serviceWorkersElement = getServiceWorkerList(document);
+  const serviceWorkersElement = getServiceWorkerList(document);
 
   // Open a tab that registers a push service worker.
-  let swTab = await addTab(TAB_URL);
+  const swTab = await addTab(TAB_URL);
 
   info("Make the test page notify us when the service worker sends a message.");
 
   await ContentTask.spawn(swTab.linkedBrowser, {}, function() {
-    let win = content.wrappedJSObject;
+    const win = content.wrappedJSObject;
     win.navigator.serviceWorker.addEventListener("message", function(event) {
       sendAsyncMessage(event.data);
     });
   });
 
   // Expect the service worker to claim the test window when activating.
-  let onClaimed = onTabMessage(swTab, "sw-claimed");
+  const onClaimed = onTabMessage(swTab, "sw-claimed");
 
   info("Wait until the service worker appears in the UI");
   await waitUntilServiceWorkerContainer(SERVICE_WORKER, document);
 
   info("Ensure that the registration resolved before trying to interact with " +
     "the service worker.");
   await waitForServiceWorkerRegistered(swTab);
   ok(true, "Service worker registration resolved");
 
   await waitForServiceWorkerActivation(SERVICE_WORKER, document);
 
   // Retrieve the Push button for the worker.
-  let names = [...document.querySelectorAll("#service-workers .target-name")];
-  let name = names.filter(element => element.textContent === SERVICE_WORKER)[0];
+  const names = [...document.querySelectorAll("#service-workers .target-name")];
+  const name = names.filter(element => element.textContent === SERVICE_WORKER)[0];
   ok(name, "Found the service worker in the list");
 
-  let targetElement = name.parentNode.parentNode;
+  const targetElement = name.parentNode.parentNode;
 
-  let pushBtn = targetElement.querySelector(".push-button");
+  const pushBtn = targetElement.querySelector(".push-button");
   ok(pushBtn, "Found its push button");
 
   info("Wait for the service worker to claim the test window before proceeding.");
   await onClaimed;
 
   info("Click on the Push button and wait for the service worker to receive " +
     "a push notification");
-  let onPushNotification = onTabMessage(swTab, "sw-pushed");
+  const onPushNotification = onTabMessage(swTab, "sw-pushed");
 
   pushBtn.click();
   await onPushNotification;
   ok(true, "Service worker received a push notification");
 
   // Finally, unregister the service worker itself.
   try {
     await unregisterServiceWorker(swTab, serviceWorkersElement);
@@ -78,16 +78,16 @@ add_task(async function() {
   await removeTab(swTab);
   await closeAboutDebugging(tab);
 });
 
 /**
  * Helper to listen once on a message sent using postMessage from the provided tab.
  */
 function onTabMessage(tab, message) {
-  let mm = tab.linkedBrowser.messageManager;
+  const mm = tab.linkedBrowser.messageManager;
   return new Promise(done => {
     mm.addMessageListener(message, function listener() {
       mm.removeMessageListener(message, listener);
       done();
     });
   });
 }
--- a/devtools/client/aboutdebugging/test/browser_service_workers_push_service.js
+++ b/devtools/client/aboutdebugging/test/browser_service_workers_push_service.js
@@ -28,65 +28,65 @@ add_task(async function() {
     _notify(scope) {
       Services.obs.notifyObservers(
         null,
         PushService.subscriptionModifiedTopic,
         scope);
     },
     init() {},
     register(pageRecord) {
-      let registration = {
+      const registration = {
         endpoint: FAKE_ENDPOINT
       };
       this._registrations.set(pageRecord.scope, registration);
       this._notify(pageRecord.scope);
       return Promise.resolve(registration);
     },
     registration(pageRecord) {
       return Promise.resolve(this._registrations.get(pageRecord.scope));
     },
     unregister(pageRecord) {
-      let deleted = this._registrations.delete(pageRecord.scope);
+      const deleted = this._registrations.delete(pageRecord.scope);
       if (deleted) {
         this._notify(pageRecord.scope);
       }
       return Promise.resolve(deleted);
     },
   };
 
-  let { tab, document } = await openAboutDebugging("workers");
+  const { tab, document } = await openAboutDebugging("workers");
 
   // Listen for mutations in the service-workers list.
-  let serviceWorkersElement = document.getElementById("service-workers");
+  const serviceWorkersElement = document.getElementById("service-workers");
 
   // Open a tab that registers a push service worker.
-  let swTab = await addTab(TAB_URL);
+  const swTab = await addTab(TAB_URL);
 
   info("Wait until the service worker appears in about:debugging");
   await waitUntilServiceWorkerContainer(SERVICE_WORKER, document);
 
   await waitForServiceWorkerActivation(SERVICE_WORKER, document);
 
   // Wait for the service worker details to update.
-  let names = [...document.querySelectorAll("#service-workers .target-name")];
-  let name = names.filter(element => element.textContent === SERVICE_WORKER)[0];
+  const names = [...document.querySelectorAll("#service-workers .target-name")];
+  const name = names.filter(element => element.textContent === SERVICE_WORKER)[0];
   ok(name, "Found the service worker in the list");
 
-  let targetContainer = name.closest(".target-container");
+  const targetContainer = name.closest(".target-container");
 
   // Retrieve the push subscription endpoint URL, and verify it looks good.
   info("Wait for the push URL");
-  let pushURL = await waitUntilElement(".service-worker-push-url", targetContainer);
+  const pushURL = await waitUntilElement(".service-worker-push-url", targetContainer);
 
   info("Found the push service URL in the service worker details");
   is(pushURL.textContent, FAKE_ENDPOINT, "The push service URL looks correct");
 
   // Unsubscribe from the push service.
   ContentTask.spawn(swTab.linkedBrowser, {}, function() {
-    let win = content.wrappedJSObject;
+    const win = content.wrappedJSObject;
     return win.sub.unsubscribe();
   });
 
   // Wait for the service worker details to update again
   info("Wait until the push URL is removed from the UI");
   await waitUntil(() => !targetContainer.querySelector(".service-worker-push-url"), 100);
   info("The push service URL should be removed");
 
--- a/devtools/client/aboutdebugging/test/browser_service_workers_start.js
+++ b/devtools/client/aboutdebugging/test/browser_service_workers_start.js
@@ -14,50 +14,50 @@ const TAB_URL = URL_ROOT + "service-work
 
 const SW_TIMEOUT = 1000;
 
 add_task(async function() {
   await enableServiceWorkerDebugging();
   await pushPref("dom.serviceWorkers.idle_timeout", SW_TIMEOUT);
   await pushPref("dom.serviceWorkers.idle_extended_timeout", SW_TIMEOUT);
 
-  let { tab, document } = await openAboutDebugging("workers");
+  const { tab, document } = await openAboutDebugging("workers");
 
   // Listen for mutations in the service-workers list.
-  let serviceWorkersElement = getServiceWorkerList(document);
+  const serviceWorkersElement = getServiceWorkerList(document);
 
   // Open a tab that registers an empty service worker.
-  let swTab = await addTab(TAB_URL);
+  const swTab = await addTab(TAB_URL);
 
   // Wait for the service-workers list to update.
   info("Wait until the service worker appears in about:debugging");
   await waitUntilServiceWorkerContainer(SERVICE_WORKER, document);
 
   info("Ensure that the registration resolved before trying to interact with " +
     "the service worker.");
   await waitForServiceWorkerRegistered(swTab);
   ok(true, "Service worker registration resolved");
 
   await waitForServiceWorkerActivation(SERVICE_WORKER, document);
 
   // Retrieve the Target element corresponding to the service worker.
-  let names = [...document.querySelectorAll("#service-workers .target-name")];
-  let name = names.filter(element => element.textContent === SERVICE_WORKER)[0];
+  const names = [...document.querySelectorAll("#service-workers .target-name")];
+  const name = names.filter(element => element.textContent === SERVICE_WORKER)[0];
   ok(name, "Found the service worker in the list");
-  let targetElement = name.parentNode.parentNode;
+  const targetElement = name.parentNode.parentNode;
 
   // The service worker may already be killed with the low 1s timeout.
   // At this stage, either the SW is started and the Debug button is visible or was
   // already stopped and the start button is visible. Wait until the service worker is
   // stopped.
   info("Wait until the start button is visible");
   await waitUntilElement(".start-button", targetElement);
 
   // We should now have a Start button but no Debug button.
-  let startBtn = targetElement.querySelector(".start-button");
+  const startBtn = targetElement.querySelector(".start-button");
   ok(startBtn, "Found its start button");
   ok(!targetElement.querySelector(".debug-button"), "No debug button");
 
   // Click on the Start button and wait for the service worker to be back.
   startBtn.click();
 
   info("Wait until the service worker starts and the debug button appears");
   await waitUntilElement(".debug-button", targetElement);
--- a/devtools/client/aboutdebugging/test/browser_service_workers_status.js
+++ b/devtools/client/aboutdebugging/test/browser_service_workers_status.js
@@ -11,31 +11,31 @@ const SW_TIMEOUT = 2000;
 
 requestLongerTimeout(2);
 
 add_task(async function() {
   await enableServiceWorkerDebugging();
   await pushPref("dom.serviceWorkers.idle_timeout", SW_TIMEOUT);
   await pushPref("dom.serviceWorkers.idle_extended_timeout", SW_TIMEOUT);
 
-  let { tab, document } = await openAboutDebugging("workers");
+  const { tab, document } = await openAboutDebugging("workers");
 
   // Listen for mutations in the service-workers list.
-  let serviceWorkersElement = getServiceWorkerList(document);
+  const serviceWorkersElement = getServiceWorkerList(document);
 
-  let swTab = await addTab(TAB_URL);
+  const swTab = await addTab(TAB_URL);
 
   info("Wait until the service worker appears in about:debugging");
-  let container = await waitUntilServiceWorkerContainer(SERVICE_WORKER, document);
+  const container = await waitUntilServiceWorkerContainer(SERVICE_WORKER, document);
 
   // We should ideally check that the service worker registration goes through the
   // "registering" and "running" steps, but it is difficult to workaround race conditions
   // for a test running on a wide variety of platforms. Due to intermittent failures, we
   // simply check that the registration transitions to "stopped".
-  let status = container.querySelector(".target-status");
+  const status = container.querySelector(".target-status");
   await waitUntil(() => status.textContent == "Stopped", 100);
   is(status.textContent, "Stopped", "Service worker is currently stopped");
 
   try {
     await unregisterServiceWorker(swTab, serviceWorkersElement);
     ok(true, "Service worker unregistered");
   } catch (e) {
     ok(false, "Service worker not unregistered; " + e);
--- a/devtools/client/aboutdebugging/test/browser_service_workers_timeout.js
+++ b/devtools/client/aboutdebugging/test/browser_service_workers_timeout.js
@@ -11,39 +11,39 @@ const TAB_URL = URL_ROOT + "service-work
 
 const SW_TIMEOUT = 1000;
 
 add_task(async function() {
   await enableServiceWorkerDebugging();
   await pushPref("dom.serviceWorkers.idle_timeout", SW_TIMEOUT);
   await pushPref("dom.serviceWorkers.idle_extended_timeout", SW_TIMEOUT);
 
-  let { tab, document } = await openAboutDebugging("workers");
+  const { tab, document } = await openAboutDebugging("workers");
 
-  let serviceWorkersElement = getServiceWorkerList(document);
+  const serviceWorkersElement = getServiceWorkerList(document);
 
-  let swTab = await addTab(TAB_URL);
+  const swTab = await addTab(TAB_URL);
 
   info("Wait until the service worker appears in about:debugging");
   await waitUntilServiceWorkerContainer(SERVICE_WORKER, document);
 
   // Ensure that the registration resolved before trying to connect to the sw
   await waitForServiceWorkerRegistered(swTab);
   ok(true, "Service worker registration resolved");
 
   // Retrieve the DEBUG button for the worker
-  let names = [...document.querySelectorAll("#service-workers .target-name")];
-  let name = names.filter(element => element.textContent === SERVICE_WORKER)[0];
+  const names = [...document.querySelectorAll("#service-workers .target-name")];
+  const name = names.filter(element => element.textContent === SERVICE_WORKER)[0];
   ok(name, "Found the service worker in the list");
-  let targetElement = name.parentNode.parentNode;
-  let debugBtn = targetElement.querySelector(".debug-button");
+  const targetElement = name.parentNode.parentNode;
+  const debugBtn = targetElement.querySelector(".debug-button");
   ok(debugBtn, "Found its debug button");
 
   // Click on it and wait for the toolbox to be ready
-  let onToolboxReady = new Promise(done => {
+  const onToolboxReady = new Promise(done => {
     gDevTools.once("toolbox-ready", function(toolbox) {
       done(toolbox);
     });
   });
   debugBtn.click();
 
   let toolbox = await onToolboxReady;
 
--- a/devtools/client/aboutdebugging/test/browser_service_workers_unregister.js
+++ b/devtools/client/aboutdebugging/test/browser_service_workers_unregister.js
@@ -12,45 +12,45 @@
 // dom.serviceWorkers.testing.enabled turned on.
 const SCOPE = URL_ROOT + "service-workers/";
 const SERVICE_WORKER = SCOPE + "empty-sw.js";
 const TAB_URL = SCOPE + "empty-sw.html";
 
 add_task(async function() {
   await enableServiceWorkerDebugging();
 
-  let { tab, document } = await openAboutDebugging("workers");
+  const { tab, document } = await openAboutDebugging("workers");
 
   // Open a tab that registers an empty service worker.
-  let swTab = await addTab(TAB_URL);
+  const swTab = await addTab(TAB_URL);
 
   info("Wait until the service worker appears in about:debugging");
   await waitUntilServiceWorkerContainer(SERVICE_WORKER, document);
 
   await waitForServiceWorkerActivation(SERVICE_WORKER, document);
 
   info("Ensure that the registration resolved before trying to interact with " +
     "the service worker.");
   await waitForServiceWorkerRegistered(swTab);
   ok(true, "Service worker registration resolved");
 
-  let targets = document.querySelectorAll("#service-workers .target");
+  const targets = document.querySelectorAll("#service-workers .target");
   is(targets.length, 1, "One service worker is now displayed.");
 
-  let target = targets[0];
-  let name = target.querySelector(".target-name");
+  const target = targets[0];
+  const name = target.querySelector(".target-name");
   is(name.textContent, SERVICE_WORKER, "Found the service worker in the list");
 
   info("Check the scope displayed scope is correct");
-  let scope = target.querySelector(".service-worker-scope");
+  const scope = target.querySelector(".service-worker-scope");
   is(scope.textContent, SCOPE,
     "The expected scope is displayed in the service worker info.");
 
   info("Unregister the service worker via the unregister link.");
-  let unregisterLink = target.querySelector(".unregister-link");
+  const unregisterLink = target.querySelector(".unregister-link");
   ok(unregisterLink, "Found the unregister link");
 
   unregisterLink.click();
 
   info("Wait until the service worker disappears");
   await waitUntil(() => {
     return !document.querySelector("#service-workers .target");
   });
--- a/devtools/client/aboutdebugging/test/browser_tabs.js
+++ b/devtools/client/aboutdebugging/test/browser_tabs.js
@@ -1,45 +1,45 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 "use strict";
 
 const TAB_URL = "data:text/html,<title>foo</title>";
 
 add_task(async function() {
-  let { tab, document } = await openAboutDebugging("tabs");
+  const { tab, document } = await openAboutDebugging("tabs");
 
   // Wait for initial tabs list which may be empty
   let tabsElement = getTabList(document);
   await waitUntilElement(".target-name", tabsElement);
 
   // Refresh tabsElement to get the .target-list element
   tabsElement = getTabList(document);
 
   let names = [...tabsElement.querySelectorAll(".target-name")];
-  let initialTabCount = names.length;
+  const initialTabCount = names.length;
 
   info("Open a new background tab");
-  let newTab = await addTab(TAB_URL, { background: true });
+  const newTab = await addTab(TAB_URL, { background: true });
 
   info("Wait for the tab to appear in the list with the correct name");
-  let container = await waitUntilTabContainer("foo", document);
+  const container = await waitUntilTabContainer("foo", document);
 
   info("Wait until the title to update");
   await waitUntil(() => {
     return container.querySelector(".target-name").title === TAB_URL;
   }, 100);
 
-  let icon = container.querySelector(".target-icon");
+  const icon = container.querySelector(".target-icon");
   ok(icon && icon.src, "Tab icon found and src attribute is not empty");
 
   info("Check if the tab icon is a valid image");
   await new Promise(r => {
-    let image = new Image();
+    const image = new Image();
     image.onload = () => {
       ok(true, "Favicon is not a broken image");
       r();
     };
     image.onerror = () => {
       ok(false, "Favicon is a broken image");
       r();
     };
@@ -55,18 +55,18 @@ add_task(async function() {
   // Check that the tab disappeared from the UI
   names = [...tabsElement.querySelectorAll("#tabs .target-name")];
   is(names.length, initialTabCount, "The tab disappeared from the UI");
 
   await closeAboutDebugging(tab);
 });
 
 function getTabContainer(name, document) {
-  let nameElements = [...document.querySelectorAll("#tabs .target-name")];
-  let nameElement = nameElements.filter(element => element.textContent === name)[0];
+  const nameElements = [...document.querySelectorAll("#tabs .target-name")];
+  const nameElement = nameElements.filter(element => element.textContent === name)[0];
   if (nameElement) {
     return nameElement.closest(".target-container");
   }
 
   return null;
 }
 
 async function waitUntilTabContainer(name, document) {
--- a/devtools/client/aboutdebugging/test/head.js
+++ b/devtools/client/aboutdebugging/test/head.js
@@ -17,37 +17,37 @@ const { Management } = ChromeUtils.impor
 
 async function openAboutDebugging(page, win) {
   info("opening about:debugging");
   let url = "about:debugging";
   if (page) {
     url += "#" + page;
   }
 
-  let tab = await addTab(url, { window: win });
-  let browser = tab.linkedBrowser;
-  let document = browser.contentDocument;
-  let window = browser.contentWindow;
+  const tab = await addTab(url, { window: win });
+  const browser = tab.linkedBrowser;
+  const document = browser.contentDocument;
+  const window = browser.contentWindow;
 
   info("Wait until the main about debugging container is available");
   await waitUntilElement(".app", document);
 
   return { tab, document, window };
 }
 
 function closeAboutDebugging(tab) {
   info("Closing about:debugging");
   return removeTab(tab);
 }
 
 function getSupportsFile(path) {
-  let cr = Cc["@mozilla.org/chrome/chrome-registry;1"]
+  const cr = Cc["@mozilla.org/chrome/chrome-registry;1"]
     .getService(Ci.nsIChromeRegistry);
-  let uri = Services.io.newURI(CHROME_URL_ROOT + path);
-  let fileurl = cr.convertChromeURL(uri);
+  const uri = Services.io.newURI(CHROME_URL_ROOT + path);
+  const fileurl = cr.convertChromeURL(uri);
   return fileurl.QueryInterface(Ci.nsIFileURL);
 }
 
 /**
  * Depending on whether there are addons installed, return either a target list
  * element or its container.
  * @param  {DOMDocument}  document   #addons section container document
  * @return {DOMNode}                 target list or container element
@@ -105,18 +105,18 @@ function getServiceWorkerList(document) 
  *
  * @param  {String} name
  *         expected service worker name
  * @param  {DOMDocument} document
  *         #service-workers section container document
  * @return {DOMNode} container element
  */
 function getServiceWorkerContainer(name, document) {
-  let nameElements = [...document.querySelectorAll("#service-workers .target-name")];
-  let nameElement = nameElements.filter(element => element.textContent === name)[0];
+  const nameElements = [...document.querySelectorAll("#service-workers .target-name")];
+  const nameElement = nameElements.filter(element => element.textContent === name)[0];
   if (nameElement) {
     return nameElement.closest(".target-container");
   }
 
   return null;
 }
 
 /**
@@ -162,19 +162,19 @@ async function waitUntilElement(selector
  */
 function getTabList(document) {
   return document.querySelector("#tabs .target-list") ||
     document.querySelector("#tabs.targets");
 }
 
 async function installAddon({document, path, name, isWebExtension}) {
   // Mock the file picker to select a test addon
-  let MockFilePicker = SpecialPowers.MockFilePicker;
+  const MockFilePicker = SpecialPowers.MockFilePicker;
   MockFilePicker.init(window);
-  let file = getSupportsFile(path);
+  const file = getSupportsFile(path);
   MockFilePicker.setFiles([file.file]);
 
   let onAddonInstalled;
 
   if (isWebExtension) {
     onAddonInstalled = new Promise(done => {
       Management.on("startup", function listener(event, extension) {
         if (extension.name != name) {
@@ -203,18 +203,18 @@ async function installAddon({document, p
 
   info("Wait for the addon to appear in the UI");
   await waitUntilAddonContainer(name, document);
 }
 
 async function uninstallAddon({document, id, name}) {
   // Now uninstall this addon
   await new Promise(async done => {
-    let addon = await AddonManager.getAddonByID(id);
-    let listener = {
+    const addon = await AddonManager.getAddonByID(id);
+    const listener = {
       onUninstalled: function(uninstalledAddon) {
         if (uninstalledAddon != addon) {
           return;
         }
         AddonManager.removeAddonListener(listener);
 
         done();
       }
@@ -224,34 +224,34 @@ async function uninstallAddon({document,
   });
 
   info("Wait until the addon is removed from about:debugging");
   await waitUntil(() => !getAddonContainer(name, document), 100);
 }
 
 function getAddonCount(document) {
   const addonListContainer = getAddonList(document);
-  let addonElements = addonListContainer.querySelectorAll(".target");
+  const addonElements = addonListContainer.querySelectorAll(".target");
   return addonElements.length;
 }
 
 /**
  * Returns a promise that will resolve when the add-on list has been updated.
  *
  * @param {Node} document
  * @return {Promise}
  */
 function waitForInitialAddonList(document) {
   info("Waiting for add-ons to load. Current add-on count: " + getAddonCount(document));
   return waitUntil(() => getAddonCount(document) > 0, 100);
 }
 
 function getAddonContainer(name, document) {
-  let nameElements = [...document.querySelectorAll("#addons-panel .target-name")];
-  let nameElement = nameElements.filter(element => element.textContent === name)[0];
+  const nameElements = [...document.querySelectorAll("#addons-panel .target-name")];
+  const nameElement = nameElements.filter(element => element.textContent === name)[0];
   if (nameElement) {
     return nameElement.closest(".addon-target-container");
   }
 
   return null;
 }
 
 async function waitUntilAddonContainer(name, document) {
@@ -280,46 +280,46 @@ function assertHasTarget(expected, docum
  * Returns a promise that will resolve after the service worker in the page
  * has successfully registered itself.
  * @param {Tab} tab
  * @return {Promise} Resolves when the service worker is registered.
  */
 function waitForServiceWorkerRegistered(tab) {
   return ContentTask.spawn(tab.linkedBrowser, {}, async function() {
     // Retrieve the `sw` promise created in the html page.
-    let { sw } = content.wrappedJSObject;
+    const { sw } = content.wrappedJSObject;
     await sw;
   });
 }
 
 /**
  * Asks the service worker within the test page to unregister, and returns a
  * promise that will resolve when it has successfully unregistered itself and the
  * about:debugging UI has fully processed this update.
  *
  * @param {Tab} tab
  * @param {Node} serviceWorkersElement
  * @return {Promise} Resolves when the service worker is unregistered.
  */
 async function unregisterServiceWorker(tab, serviceWorkersElement) {
   // Get the initial count of service worker registrations.
   let registrations = serviceWorkersElement.querySelectorAll(".target-container");
-  let registrationCount = registrations.length;
+  const registrationCount = registrations.length;
 
   // Wait until the registration count is decreased by one.
-  let isRemoved = waitUntil(() => {
+  const isRemoved = waitUntil(() => {
     registrations = serviceWorkersElement.querySelectorAll(".target-container");
     return registrations.length === registrationCount - 1;
   }, 100);
 
   // Unregister the service worker from the content page
   await ContentTask.spawn(tab.linkedBrowser, {}, async function() {
     // Retrieve the `sw` promise created in the html page
-    let { sw } = content.wrappedJSObject;
-    let registration = await sw;
+    const { sw } = content.wrappedJSObject;
+    const registration = await sw;
     await registration.unregister();
   });
 
   return isRemoved;
 }
 
 /**
  * Waits for the creation of a new window, usually used with create private
@@ -338,70 +338,70 @@ function waitForDelayedStartupFinished(w
   });
 }
 
 /**
  * open the about:debugging page and install an addon
  */
 async function setupTestAboutDebuggingWebExtension(name, path) {
   await new Promise(resolve => {
-    let options = {"set": [
+    const options = {"set": [
       // Force enabling of addons debugging
       ["devtools.chrome.enabled", true],
       ["devtools.debugger.remote-enabled", true],
       // Disable security prompt
       ["devtools.debugger.prompt-connection", false],
       // Enable Browser toolbox test script execution via env variable
       ["devtools.browser-toolbox.allow-unsafe-script", true],
     ]};
     SpecialPowers.pushPrefEnv(options, resolve);
   });
 
-  let { tab, document } = await openAboutDebugging("addons");
+  const { tab, document } = await openAboutDebugging("addons");
   await waitForInitialAddonList(document);
 
   await installAddon({
     document,
     path,
     name,
     isWebExtension: true,
   });
 
   // Retrieve the DEBUG button for the addon
-  let names = getInstalledAddonNames(document);
-  let nameEl = names.filter(element => element.textContent === name)[0];
+  const names = getInstalledAddonNames(document);
+  const nameEl = names.filter(element => element.textContent === name)[0];
   ok(name, "Found the addon in the list");
-  let targetElement = nameEl.parentNode.parentNode;
-  let debugBtn = targetElement.querySelector(".debug-button");
+  const targetElement = nameEl.parentNode.parentNode;
+  const debugBtn = targetElement.querySelector(".debug-button");
   ok(debugBtn, "Found its debug button");
 
   return { tab, document, debugBtn };
 }
 
 /**
  * Wait for aboutdebugging to be notified about the activation of the service worker
  * corresponding to the provided service worker url.
  */
 async function waitForServiceWorkerActivation(swUrl, document) {
-  let serviceWorkersElement = getServiceWorkerList(document);
-  let names = serviceWorkersElement.querySelectorAll(".target-name");
-  let name = [...names].filter(element => element.textContent === swUrl)[0];
+  const serviceWorkersElement = getServiceWorkerList(document);
+  const names = serviceWorkersElement.querySelectorAll(".target-name");
+  const name = [...names].filter(element => element.textContent === swUrl)[0];
 
-  let targetElement = name.parentNode.parentNode;
-  let targetStatus = targetElement.querySelector(".target-status");
+  const targetElement = name.parentNode.parentNode;
+  const targetStatus = targetElement.querySelector(".target-status");
   await waitUntil(() => {
     return targetStatus.textContent !== "Registering";
   }, 100);
 }
 
 /**
  * Set all preferences needed to enable service worker debugging and testing.
  */
 async function enableServiceWorkerDebugging() {
-  let options = { "set": [
+  const options = { "set": [
     // Enable service workers.
     ["dom.serviceWorkers.enabled", true],
     // Accept workers from mochitest's http.
     ["dom.serviceWorkers.testing.enabled", true],
     // Force single content process.
     ["dom.ipc.processCount", 1],
   ]};
 
@@ -414,33 +414,33 @@ async function enableServiceWorkerDebugg
 }
 
 /**
  * Returns a promise that resolves when the given add-on event is fired. The
  * resolved value is an array of arguments passed for the event.
  */
 function promiseAddonEvent(event) {
   return new Promise(resolve => {
-    let listener = {
+    const listener = {
       [event]: function(...args) {
         AddonManager.removeAddonListener(listener);
         resolve(args);
       }
     };
 
     AddonManager.addAddonListener(listener);
   });
 }
 
 /**
  * Install an add-on using the AddonManager so it does not show up as temporary.
  */
 function installAddonWithManager(filePath) {
   return new Promise(async (resolve, reject) => {
-    let install = await AddonManager.getInstallForFile(filePath);
+    const install = await AddonManager.getInstallForFile(filePath);
     if (!install) {
       throw new Error(`An install was not created for ${filePath}`);
     }
     install.addListener({
       onDownloadFailed: reject,
       onDownloadCancelled: reject,
       onInstallFailed: reject,
       onInstallCancelled: reject,
--- a/devtools/client/aboutdebugging/test/service-workers/push-sw.html
+++ b/devtools/client/aboutdebugging/test/service-workers/push-sw.html
@@ -10,24 +10,24 @@
 
 "use strict";
 // The subscription is expected as a global by browser_service_workers_push_service.js
 var sub = null;
 
 // The registration promise is expected as a global by head.js's unregisterServiceWorker.
 var sw = (async function() {
   await new Promise(resolve => {
-    let perm = { type: "desktop-notification", allow: true, context: document };
+    const perm = { type: "desktop-notification", allow: true, context: document };
     SpecialPowers.pushPermissions([perm], resolve);
   });
 
-  let registrationPromise = navigator.serviceWorker.register("push-sw.js");
+  const registrationPromise = navigator.serviceWorker.register("push-sw.js");
 
   try {
-    let registration = await registrationPromise;
+    const registration = await registrationPromise;
     dump("SW registered\n");
 
     try {
       sub = await registration.pushManager.subscribe();
       dump("SW subscribed to push: " + sub.endpoint + "\n");
     } catch (e) {
       dump("SW not subscribed to push: " + e + "\n");
     }
--- a/devtools/client/accessibility/accessibility-view.js
+++ b/devtools/client/accessibility/accessibility-view.js
@@ -77,17 +77,17 @@ AccessibilityView.prototype = {
   async selectNodeAccessible(walker, node) {
     let accessible = await walker.getAccessibleFor(node);
     // If node does not have an accessible object, try to find node's child text node and
     // try to retrieve an accessible object for that child instead. This is the best
     // effort approach until there's accessibility API to retrieve accessible object at
     // point.
     if (!accessible || accessible.indexInParent < 0) {
       const { nodes: children } = await gToolbox.walker.children(node);
-      for (let child of children) {
+      for (const child of children) {
         if (child.nodeType === nodeConstants.TEXT_NODE) {
           accessible = await walker.getAccessibleFor(child);
           if (accessible && accessible.indexInParent >= 0) {
             break;
           }
         }
       }
     }
--- a/devtools/client/accessibility/components/AccessibilityTree.js
+++ b/devtools/client/accessibility/components/AccessibilityTree.js
@@ -45,32 +45,32 @@ class AccessibilityTree extends Componen
     this.onTextChange = this.onTextChange.bind(this);
   }
 
   /**
    * Add accessibility walker front event listeners that affect tree rendering
    * and updates.
    */
   componentWillMount() {
-    let { walker } = this.props;
+    const { walker } = this.props;
     walker.on("reorder", this.onReorder);
     walker.on("name-change", this.onNameChange);
     walker.on("text-change", this.onTextChange);
     return null;
   }
 
   componentDidUpdate() {
     window.emit(EVENTS.ACCESSIBILITY_INSPECTOR_UPDATED);
   }
 
   /**
    * Remove accessible walker front event listeners.
    */
   componentWillUnmount() {
-    let { walker } = this.props;
+    const { walker } = this.props;
     walker.off("reorder", this.onReorder);
     walker.off("name-change", this.onNameChange);
     walker.off("text-change", this.onTextChange);
   }
 
   /**
    * Handle accessible reorder event. If the accessible is cached and rendered
    * within the accessibility tree, re-fetch its children and re-render the
@@ -90,17 +90,17 @@ class AccessibilityTree extends Componen
    * re-fetch its parent's children and re-render the corresponding subtree.
    * @param {Object} accessible accessible object that had its name changed.
    * @param {Object} parent     optional parent accessible object. Note: if it
    *                            parent is not present, we assume that the top
    *                            level document's name has changed and use
    *                            accessible walker as a parent.
    */
   onNameChange(accessible, parent) {
-    let { accessibles, walker, dispatch } = this.props;
+    const { accessibles, walker, dispatch } = this.props;
     parent = parent || walker;
 
     if (accessibles.has(accessible.actorID) ||
         accessibles.has(parent.actorID)) {
       dispatch(fetchChildren(parent));
     }
   }
 
@@ -108,53 +108,53 @@ class AccessibilityTree extends Componen
    * Handle accessible text change (change/insert/remove) event. If the text of
    * an accessible changes and that accessible is cached and rendered within the
    * accessibility tree, re-fetch its children and re-render the corresponding
    * subtree.
    * @param  {Object} accessible  accessible object that had its child text
    *                              changed.
    */
   onTextChange(accessible) {
-    let { accessibles, dispatch } = this.props;
+    const { accessibles, dispatch } = this.props;
     if (accessibles.has(accessible.actorID)) {
       dispatch(fetchChildren(accessible));
     }
   }
 
   /**
    * Render Accessibility panel content
    */
   render() {
-    let columns = [{
+    const columns = [{
       "id": "default",
       "title": L10N.getStr("accessibility.role")
     }, {
       "id": "value",
       "title": L10N.getStr("accessibility.name")
     }];
 
-    let {
+    const {
       accessibles,
       dispatch,
       expanded,
       selected,
       highlighted: highlightedItem,
       walker
     } = this.props;
 
-    let renderValue = props => {
+    const renderValue = props => {
       return Rep(Object.assign({}, props, {
         defaultRep: Grip,
         cropLimit: 50,
       }));
     };
 
-    let renderRow = rowProps => {
-      let { object } = rowProps.member;
-      let highlighted = object === highlightedItem;
+    const renderRow = rowProps => {
+      const { object } = rowProps.member;
+      const highlighted = object === highlightedItem;
       return AccessibilityRow(Object.assign({}, rowProps, {
         walker,
         highlighted,
         decorator: {
           getRowClass: function() {
             return highlighted ? ["highlighted"] : [];
           }
         }
--- a/devtools/client/accessibility/components/Accessible.js
+++ b/devtools/client/accessibility/components/Accessible.js
@@ -32,28 +32,28 @@ class AccessiblePropertyClass extends Co
       accessible: PropTypes.string,
       object: PropTypes.any,
       focused: PropTypes.bool,
       children: PropTypes.func
     };
   }
 
   componentDidUpdate({ object: prevObject, accessible: prevAccessible }) {
-    let { accessible, object, focused } = this.props;
+    const { accessible, object, focused } = this.props;
     // Fast check if row is focused or if the value did not update.
     if (focused || accessible !== prevAccessible || prevObject === object ||
         (object && prevObject && typeof object === "object")) {
       return;
     }
 
     this.flashRow();
   }
 
   flashRow() {
-    let row = findDOMNode(this);
+    const row = findDOMNode(this);
     flashElementOn(row);
     if (this._flashMutationTimer) {
       clearTimeout(this._flashMutationTimer);
       this._flashMutationTimer = null;
     }
     this._flashMutationTimer = setTimeout(() => {
       flashElementOff(row);
     }, VALUE_FLASHING_DURATION);
@@ -91,48 +91,48 @@ class Accessible extends Component {
     this.update = this.update.bind(this);
   }
 
   componentWillMount() {
     window.on(EVENTS.NEW_ACCESSIBLE_FRONT_INSPECTED, this.onAccessibleInspected);
   }
 
   componentWillReceiveProps({ accessible }) {
-    let oldAccessible = this.props.accessible;
+    const oldAccessible = this.props.accessible;
 
     if (oldAccessible) {
       if (accessible && accessible.actorID === oldAccessible.actorID) {
         return;
       }
       ACCESSIBLE_EVENTS.forEach(event => oldAccessible.off(event, this.update));
     }
 
     if (accessible) {
       ACCESSIBLE_EVENTS.forEach(event => accessible.on(event, this.update));
     }
   }
 
   componentWillUnmount() {
     window.off(EVENTS.NEW_ACCESSIBLE_FRONT_INSPECTED, this.onAccessibleInspected);
 
-    let { accessible } = this.props;
+    const { accessible } = this.props;
     if (accessible) {
       ACCESSIBLE_EVENTS.forEach(event => accessible.off(event, this.update));
     }
   }
 
   onAccessibleInspected() {
-    let { props } = this.refs;
+    const { props } = this.refs;
     if (props) {
       props.refs.tree.focus();
     }
   }
 
   update() {
-    let { dispatch, accessible } = this.props;
+    const { dispatch, accessible } = this.props;
     if (gToolbox) {
       dispatch(updateDetails(gToolbox.walker, accessible));
     }
   }
 
   setExpanded(item, isExpanded) {
     const { expanded } = this.state;
 
@@ -191,31 +191,31 @@ class Accessible extends Component {
     }
 
     const win = gToolbox.doc.defaultView.top;
     win.openWebLinkIn(link, where);
   }
 
   renderItem(item, depth, focused, arrow, expanded) {
     const object = item.contents;
-    let valueProps = {
+    const valueProps = {
       object,
       mode: MODE.TINY,
       title: "Object",
       openLink: this.openLink
     };
 
     if (isNode(object)) {
       valueProps.defaultRep = ElementNode;
       valueProps.onDOMNodeMouseOut = () => this.hideHighlighter();
       valueProps.onDOMNodeMouseOver = () => this.showHighlighter(this.props.DOMNode);
       valueProps.onInspectIconClick = () => this.selectNode(this.props.DOMNode);
     }
 
-    let classList = [ "node", "object-node" ];
+    const classList = [ "node", "object-node" ];
     if (focused) {
       classList.push("focused");
     }
 
     return AccessibleProperty(
       { object, focused, accessible: this.props.accessible.actorID },
       () => div({
         className: classList.join(" "),
@@ -273,21 +273,21 @@ class Accessible extends Component {
 
 /**
  * Find currently focused item.
  * @param  {String} focused Key of the currently focused item.
  * @param  {Array}  items   Accessibility properties array.
  * @return {Object?}        Possibly found focused item.
  */
 const findFocused = (focused, items) => {
-  for (let item of items) {
+  for (const item of items) {
     if (item.path === focused) {
       return item;
     }
-    let found = findFocused(focused, item.children);
+    const found = findFocused(focused, item.children);
     if (found) {
       return found;
     }
   }
   return null;
 };
 
 /**
@@ -301,22 +301,22 @@ const isNode = value => value && value.t
  * While waiting for a reps fix in https://github.com/devtools-html/reps/issues/92,
  * translate nodeFront to a grip-like object that can be used with an ElementNode rep.
  *
  * @params  {NodeFront} nodeFront
  *          The NodeFront for which we want to create a grip-like object.
  * @returns {Object} a grip-like object that can be used with Reps.
  */
 const translateNodeFrontToGrip = nodeFront => {
-  let { attributes, actorID, typeName, nodeName, nodeType } = nodeFront;
+  const { attributes, actorID, typeName, nodeName, nodeType } = nodeFront;
 
   // The main difference between NodeFront and grips is that attributes are treated as
   // a map in grips and as an array in NodeFronts.
-  let attributesMap = {};
-  for (let { name, value } of attributes) {
+  const attributesMap = {};
+  for (const { name, value } of attributes) {
     attributesMap[name] = value;
   }
 
   return {
     actor: actorID,
     typeName,
     preview: {
       attributes: attributesMap,
@@ -334,17 +334,17 @@ const translateNodeFrontToGrip = nodeFro
  * Build props ingestible by Tree component.
  * @param  {Object} props      Component properties to be processed.
  * @param  {String} parentPath Unique path that is used to identify a Tree Node.
  * @return {Object}            Processed properties.
  */
 const makeItemsForDetails = (props, parentPath) =>
   Object.getOwnPropertyNames(props).map(name => {
     let children = [];
-    let path = `${parentPath}/${name}`;
+    const path = `${parentPath}/${name}`;
     let contents = props[name];
 
     if (contents) {
       if (isNode(contents)) {
         contents = translateNodeFrontToGrip(contents);
       } else if (Array.isArray(contents) || typeof contents === "object") {
         children = makeItemsForDetails(contents, path);
       }
@@ -365,23 +365,23 @@ const makeParentMap = (items) => {
     }
   }
 
   items.forEach(_traverse);
   return map;
 };
 
 const mapStateToProps = ({ details }) => {
-  let { accessible, DOMNode } = details;
+  const { accessible, DOMNode } = details;
   if (!accessible || !DOMNode) {
     return {};
   }
 
-  let items = makeItemsForDetails(ORDERED_PROPS.reduce((props, key) => {
+  const items = makeItemsForDetails(ORDERED_PROPS.reduce((props, key) => {
     props[key] = key === "DOMNode" ? DOMNode : accessible[key];
     return props;
   }, {}), "");
-  let parents = makeParentMap(items);
+  const parents = makeParentMap(items);
 
   return { accessible, DOMNode, items, parents };
 };
 
 module.exports = connect(mapStateToProps)(Accessible);
--- a/devtools/client/accessibility/components/Button.js
+++ b/devtools/client/accessibility/components/Button.js
@@ -33,26 +33,26 @@ class Button extends Component {
     };
   }
 
   static get defaultProps() {
     return defaultProps;
   }
 
   render() {
-    let className = [
+    const className = [
       ...this.props.className.split(" "),
       "devtools-button"
     ].join(" ");
-    let props = Object.assign({}, this.props, {
+    const props = Object.assign({}, this.props, {
       className,
       "aria-busy": this.props.busy
     });
 
-    let classList = ["btn-content"];
+    const classList = ["btn-content"];
     if (this.props.busy) {
       classList.push("devtools-throbber");
     }
 
     return (button(props, span({
       className: classList.join(" "),
       tabIndex: -1
     }, this.props.children)));
--- a/devtools/client/accessibility/components/Description.js
+++ b/devtools/client/accessibility/components/Description.js
@@ -62,36 +62,36 @@ class Description extends Component {
   }
 
   componentWillUnmount() {
     this.props.accessibility.off("can-be-enabled-change",
       this.onCanBeEnabledChange);
   }
 
   onEnable() {
-    let { accessibility, dispatch } = this.props;
+    const { accessibility, dispatch } = this.props;
     this.setState({ enabling: true });
 
     if (gTelemetry) {
       gTelemetry.scalarAdd(A11Y_SERVICE_ENABLED_COUNT, 1);
     }
 
     dispatch(enable(accessibility))
       .then(() => this.setState({ enabling: false }))
       .catch(() => this.setState({ enabling: false }));
   }
 
   onCanBeEnabledChange(canBeEnabled) {
     this.props.dispatch(updateCanBeEnabled(canBeEnabled));
   }
 
   render() {
-    let { canBeEnabled } = this.props;
-    let { enabling } = this.state;
-    let enableButtonStr = enabling ? "accessibility.enabling" : "accessibility.enable";
+    const { canBeEnabled } = this.props;
+    const { enabling } = this.state;
+    const enableButtonStr = enabling ? "accessibility.enabling" : "accessibility.enable";
 
     let title;
     let disableButton = false;
 
     if (canBeEnabled) {
       title = L10N.getStr("accessibility.enable.enabledTitle");
     } else {
       disableButton = true;
--- a/devtools/client/accessibility/components/MainFrame.js
+++ b/devtools/client/accessibility/components/MainFrame.js
@@ -63,22 +63,22 @@ class MainFrame extends Component {
     this.props.accessibility.off("init", this.resetAccessibility);
     this.props.accessibility.off("shutdown", this.resetAccessibility);
     this.props.walker.off("document-ready", this.resetAccessibility);
 
     window.removeEventListener("resize", this.onPanelWindowResize, true);
   }
 
   resetAccessibility() {
-    let { dispatch, accessibility } = this.props;
+    const { dispatch, accessibility } = this.props;
     dispatch(reset(accessibility));
   }
 
   get useLandscapeMode() {
-    let { clientWidth } = document.getElementById("content");
+    const { clientWidth } = document.getElementById("content");
     return clientWidth > PORTRAIT_MODE_WIDTH;
   }
 
   /**
    * If panel width is less than PORTRAIT_MODE_WIDTH px, the splitter changes
    * its mode to `horizontal` to support portrait view.
    */
   onPanelWindowResize() {
@@ -86,17 +86,17 @@ class MainFrame extends Component {
       this.refs.splitBox.setState({ vert: this.useLandscapeMode });
     }
   }
 
   /**
    * Render Accessibility panel content
    */
   render() {
-    let { accessibility, walker, enabled } = this.props;
+    const { accessibility, walker, enabled } = this.props;
 
     if (!enabled) {
       return Description({ accessibility });
     }
 
     return (
       div({ className: "mainFrame", role: "presentation" },
         Toolbar({ accessibility, walker }),
--- a/devtools/client/accessibility/components/Toolbar.js
+++ b/devtools/client/accessibility/components/Toolbar.js
@@ -43,28 +43,28 @@ class Toolbar extends Component {
       this.onCanBeDisabledChange);
   }
 
   onCanBeDisabledChange(canBeDisabled) {
     this.props.dispatch(updateCanBeDisabled(canBeDisabled));
   }
 
   onDisable() {
-    let { accessibility, dispatch } = this.props;
+    const { accessibility, dispatch } = this.props;
     this.setState({ disabling: true });
 
     dispatch(disable(accessibility))
       .then(() => this.setState({ disabling: false }))
       .catch(() => this.setState({ disabling: false }));
   }
 
   render() {
-    let { canBeDisabled } = this.props;
-    let { disabling } = this.state;
-    let disableButtonStr = disabling ?
+    const { canBeDisabled } = this.props;
+    const { disabling } = this.state;
+    const disableButtonStr = disabling ?
       "accessibility.disabling" : "accessibility.disable";
     let title;
     let isDisabled = false;
 
     if (canBeDisabled) {
       title = L10N.getStr("accessibility.disable.enabledTitle");
     } else {
       isDisabled = true;
--- a/devtools/client/accessibility/provider.js
+++ b/devtools/client/accessibility/provider.js
@@ -25,17 +25,17 @@ class Provider {
    * @param {Object}  accessible accessible object whose children to get.
    * @returns {Array} arraof of accessible children.
    */
   getChildren(accessible) {
     if (!accessible || !accessible.actor || accessible.childCount === 0) {
       return [];
     }
 
-    let obj = this.accessibles.get(accessible.actorID);
+    const obj = this.accessibles.get(accessible.actorID);
     if (!obj || !obj.children) {
       return this.dispatch(fetchChildren(accessible));
     }
 
     return obj.children;
   }
 
   /**
--- a/devtools/client/accessibility/reducers/accessibles.js
+++ b/devtools/client/accessibility/reducers/accessibles.js
@@ -32,51 +32,51 @@ function accessibles(state = getInitialS
 /**
  * If accessible is cached recursively remove all its children and remove itself
  * from cache.
  * @param {Map}    cache      Previous state maintaining a cache of previously
  *                            fetched accessibles.
  * @param {Object} accessible Accessible object to remove from cache.
  */
 function cleanupChild(cache, accessible) {
-  let cached = cache.get(accessible.actorID);
+  const cached = cache.get(accessible.actorID);
   if (!cached) {
     return;
   }
 
-  for (let child of cached.children) {
+  for (const child of cached.children) {
     cleanupChild(cache, child);
   }
 
   cache.delete(accessible.actorID);
 }
 
 /**
  * Determine if accessible in cache is stale. Accessible object is stale if its
  * cached children array has the size other than the value of its childCount
  * property that updates on accessible actor event.
  * @param {Map}    cache      Previous state maintaining a cache of previously
  *                             fetched accessibles.
  * @param {Object} accessible Accessible object to test for staleness.
  */
 function staleChildren(cache, accessible) {
-  let cached = cache.get(accessible.actorID);
+  const cached = cache.get(accessible.actorID);
   if (!cached) {
     return false;
   }
 
   return cached.children.length !== accessible.childCount;
 }
 
 function updateChildrenCache(cache, accessible, children) {
-  let { actorID } = accessible;
+  const { actorID } = accessible;
 
   if (cache.has(actorID)) {
-    let cached = cache.get(actorID);
-    for (let child of cached.children) {
+    const cached = cache.get(actorID);
+    for (const child of cached.children) {
       // If exhisting children cache includes an accessible that is not present
       // any more or if child accessible is stale remove it and all its children
       // from cache.
       if (!children.includes(child) || staleChildren(cache, child)) {
         cleanupChild(cache, child);
       }
     }
     cached.children = children;
@@ -91,34 +91,34 @@ function updateChildrenCache(cache, acce
 /**
  * Handles fetching of accessible children.
  * @param {Map}     cache  Previous state maintaining a cache of previously
  *                         fetched accessibles.
  * @param {Object}  action Redux action object.
  * @return {Object} updated state
  */
 function onReceiveChildren(cache, action) {
-  let { accessible, response: children, error } = action;
+  const { accessible, response: children, error } = action;
 
   if (error) {
     console.warn("Error fetching children", accessible, error);
     return cache;
   }
 
   return updateChildrenCache(new Map(cache), accessible, children);
 }
 
 function onReceiveAncestry(cache, action) {
-  let { accessible: acc, response: ancestry, error } = action;
+  const { accessible: acc, response: ancestry, error } = action;
 
   if (error) {
     console.warn("Error fetching ancestry", acc, error);
     return cache;
   }
 
-  let newCache = new Map(cache);
+  const newCache = new Map(cache);
   ancestry.forEach(({ accessible, children }) =>
     updateChildrenCache(newCache, accessible, children));
 
   return newCache;
 }
 
 exports.accessibles = accessibles;
--- a/devtools/client/accessibility/reducers/details.js
+++ b/devtools/client/accessibility/reducers/details.js
@@ -28,17 +28,17 @@ function details(state = getInitialState
 
 /**
  * Handle details update for an accessible object
  * @param {Object} state  Current accessible object details.
  * @param {Object} action Redux action object
  * @return {Object}  updated state
  */
 function onUpdateDetails(state, action) {
-  let { accessible, response: DOMNode, error } = action;
+  const { accessible, response: DOMNode, error } = action;
   if (error) {
     console.warn("Error fetching DOMNode for accessible", accessible, error);
     return state;
   }
 
   return { accessible, DOMNode };
 }
 
--- a/devtools/client/accessibility/reducers/ui.js
+++ b/devtools/client/accessibility/reducers/ui.js
@@ -71,44 +71,44 @@ function onUpdateDetails(state) {
   return Object.assign({}, state, { selected: null });
 }
 
 function onUnhighlight(state) {
   return Object.assign({}, state, { highlighted: null });
 }
 
 function updateExpandedNodes(state, ancestry) {
-  let expanded = new Set(state.expanded);
-  let path = ancestry.reduceRight((accPath, { accessible }) => {
+  const expanded = new Set(state.expanded);
+  const path = ancestry.reduceRight((accPath, { accessible }) => {
     accPath = TreeView.subPath(accPath, accessible.actorID);
     expanded.add(accPath);
     return accPath;
   }, "");
 
   return { path, expanded };
 }
 
 function onHighlight(state, { accessible, response: ancestry, error }) {
   if (error) {
     console.warn("Error fetching ancestry", accessible, error);
     return state;
   }
 
-  let { expanded } = updateExpandedNodes(state, ancestry);
+  const { expanded } = updateExpandedNodes(state, ancestry);
   return Object.assign({}, state, { expanded, highlighted: accessible });
 }
 
 function onSelect(state, { accessible, response: ancestry, error }) {
   if (error) {
     console.warn("Error fetching ancestry", accessible, error);
     return state;
   }
 
-  let { path, expanded } = updateExpandedNodes(state, ancestry);
-  let selected = TreeView.subPath(path, accessible.actorID);
+  const { path, expanded } = updateExpandedNodes(state, ancestry);
+  const selected = TreeView.subPath(path, accessible.actorID);
 
   return Object.assign({}, state, { expanded, selected });
 }
 
 /**
  * Handle "canBeDisabled" flag update for accessibility service
  * @param  {Object}  state   Current ui state
  * @param  {Object}  action  Redux action object
@@ -130,17 +130,17 @@ function onCanBeEnabledChange(state, { c
 
 /**
  * Handle reset action for the accessibility panel UI.
  * @param  {Object}  state   Current ui state.
  * @param  {Object}  action  Redux action object
  * @return {Object}  updated state
  */
 function onReset(state, { accessibility }) {
-  let { enabled, canBeDisabled, canBeEnabled } = accessibility;
+  const { enabled, canBeDisabled, canBeEnabled } = accessibility;
   toggleHighlightTool(enabled);
   return Object.assign({}, state, { enabled, canBeDisabled, canBeEnabled });
 }
 
 /**
  * Handle accessibilty service enabling/disabling.
  * @param {Object}  state   Current accessibility services enabled state.
  * @param {Object}  action  Redux action object
--- a/devtools/client/accessibility/test/browser/browser_accessibility_context_menu_browser.js
+++ b/devtools/client/accessibility/test/browser/browser_accessibility_context_menu_browser.js
@@ -1,54 +1,54 @@
 /* Any copyright is dedicated to the Public Domain.
  * http://creativecommons.org/publicdomain/zero/1.0/ */
 
 "use strict";
 
 const TEST_URI = "<h1 id=\"h1\">header</h1><p id=\"p\">paragraph</p>";
 
 add_task(async function testNoShowAccessibilityPropertiesContextMenu() {
-  let tab = await addTab(buildURL(TEST_URI));
-  let { linkedBrowser: browser } = tab;
+  const tab = await addTab(buildURL(TEST_URI));
+  const { linkedBrowser: browser } = tab;
 
-  let contextMenu = document.getElementById("contentAreaContextMenu");
-  let awaitPopupShown = BrowserTestUtils.waitForEvent(contextMenu, "popupshown");
+  const contextMenu = document.getElementById("contentAreaContextMenu");
+  const awaitPopupShown = BrowserTestUtils.waitForEvent(contextMenu, "popupshown");
   await BrowserTestUtils.synthesizeMouse("#h1", 0, 0, {
     type: "contextmenu",
     button: 2,
     centered: true,
   }, browser);
   await awaitPopupShown;
 
-  let inspectA11YPropsItem = contextMenu.querySelector("#context-inspect-a11y");
+  const inspectA11YPropsItem = contextMenu.querySelector("#context-inspect-a11y");
   ok(inspectA11YPropsItem.hidden, "Accessibility tools are not enabled.");
   contextMenu.hidePopup();
   gBrowser.removeCurrentTab();
 });
 
 addA11YPanelTask("Test show accessibility properties context menu in browser.",
   TEST_URI,
   async function({ panel, toolbox, browser }) {
-    let headerSelector = "#h1";
+    const headerSelector = "#h1";
 
-    let contextMenu = document.getElementById("contentAreaContextMenu");
-    let awaitPopupShown = BrowserTestUtils.waitForEvent(contextMenu, "popupshown");
+    const contextMenu = document.getElementById("contentAreaContextMenu");
+    const awaitPopupShown = BrowserTestUtils.waitForEvent(contextMenu, "popupshown");
     await BrowserTestUtils.synthesizeMouse(headerSelector, 0, 0, {
       type: "contextmenu",
       button: 2,
       centered: true,
     }, browser);
     await awaitPopupShown;
 
-    let inspectA11YPropsItem = contextMenu.querySelector("#context-inspect-a11y");
+    const inspectA11YPropsItem = contextMenu.querySelector("#context-inspect-a11y");
 
     info("Triggering 'Inspect Accessibility Properties' and waiting for " +
          "accessibility panel to open");
     inspectA11YPropsItem.click();
     contextMenu.hidePopup();
 
-    let selected = await panel.once("new-accessible-front-selected");
-    let expectedSelectedNode = await getNodeFront(headerSelector,
+    const selected = await panel.once("new-accessible-front-selected");
+    const expectedSelectedNode = await getNodeFront(headerSelector,
                                                   toolbox.getPanel("inspector"));
-    let expectedSelected = await panel.walker.getAccessibleFor(expectedSelectedNode);
+    const expectedSelected = await panel.walker.getAccessibleFor(expectedSelectedNode);
     is(toolbox.getCurrentPanel(), panel, "Accessibility panel is currently selected");
     is(selected, expectedSelected, "Accessible front selected correctly");
   });
--- a/devtools/client/accessibility/test/browser/browser_accessibility_context_menu_inspector.js
+++ b/devtools/client/accessibility/test/browser/browser_accessibility_context_menu_inspector.js
@@ -15,50 +15,50 @@ async function openContextMenuForNode({ 
   info("Selecting Inspector tab and opening a context menu");
   const inspector = await toolbox.selectTool("inspector");
 
   if (!selector) {
     ok(inspector.selection.isBodyNode(), "Default selection is a body node.");
   } else if (typeof selector === "string") {
     await selectNode(selector, inspector, "test");
   } else {
-    let updated = inspector.once("inspector-updated");
+    const updated = inspector.once("inspector-updated");
     inspector.selection.setNodeFront(selector, { reason: "test" });
     await updated;
   }
 
-  let menuUpdated = inspector.once("node-menu-updated");
-  let allMenuItems = openContextMenuAndGetAllItems(inspector);
+  const menuUpdated = inspector.once("node-menu-updated");
+  const allMenuItems = openContextMenuAndGetAllItems(inspector);
   await menuUpdated;
   return allMenuItems;
 }
 
 function checkShowA11YPropertiesNode(allMenuItems, disabled) {
-  let showA11YPropertiesNode = allMenuItems.find(item =>
+  const showA11YPropertiesNode = allMenuItems.find(item =>
     item.id === "node-menu-showaccessibilityproperties");
   ok(showA11YPropertiesNode,
     "the popup menu now has a show accessibility properties item");
   is(showA11YPropertiesNode.disabled, disabled,
     "Show accessibility properties item has correct state");
   return showA11YPropertiesNode;
 }
 
 async function checkAccessibleObjectSelection({ toolbox, panel }, menuItem, isText) {
   const inspector = await toolbox.getPanel("inspector");
   info("Triggering 'Show Accessibility Properties' and waiting for " +
        "accessibility panel to open");
-  let panelSelected = toolbox.once("accessibility-selected");
-  let objectSelected = panel.once("new-accessible-front-selected");
+  const panelSelected = toolbox.once("accessibility-selected");
+  const objectSelected = panel.once("new-accessible-front-selected");
   menuItem.click();
   await panelSelected;
-  let selected = await objectSelected;
+  const selected = await objectSelected;
 
-  let expectedNode = isText ?
+  const expectedNode = isText ?
     inspector.selection.nodeFront.inlineTextChild : inspector.selection.nodeFront;
-  let expectedSelected = await panel.walker.getAccessibleFor(expectedNode);
+  const expectedSelected = await panel.walker.getAccessibleFor(expectedNode);
   is(selected, expectedSelected, "Accessible front selected correctly");
 }
 
 addA11YPanelTask("Test show accessibility properties context menu.", TEST_URI,
   async function testShowAccessibilityPropertiesContextMenu(env) {
     let allMenuItems = await openContextMenuForNode(env);
     let showA11YPropertiesNode = checkShowA11YPropertiesNode(allMenuItems, true);
 
@@ -69,15 +69,15 @@ addA11YPanelTask("Test show accessibilit
     allMenuItems = await openContextMenuForNode(env, "#span-1");
     showA11YPropertiesNode = checkShowA11YPropertiesNode(allMenuItems, false);
     await checkAccessibleObjectSelection(env, showA11YPropertiesNode, true);
 
     allMenuItems = await openContextMenuForNode(env, "#span-2");
     showA11YPropertiesNode = checkShowA11YPropertiesNode(allMenuItems, true);
 
     const inspector = env.toolbox.getPanel("inspector");
-    let span2 = await getNodeFront("#span-2", inspector);
+    const span2 = await getNodeFront("#span-2", inspector);
     await inspector.markup.expandNode(span2);
-    let { nodes } = await inspector.walker.children(span2);
+    const { nodes } = await inspector.walker.children(span2);
     allMenuItems = await openContextMenuForNode(env, nodes[0]);
     showA11YPropertiesNode = checkShowA11YPropertiesNode(allMenuItems, false);
     await checkAccessibleObjectSelection(env, showA11YPropertiesNode, false);
   });
--- a/devtools/client/accessibility/test/browser/browser_accessibility_sidebar.js
+++ b/devtools/client/accessibility/test/browser/browser_accessibility_sidebar.js
@@ -43,18 +43,18 @@ const tests = [{
   expected: {
     sidebar: {
       states: ["unavailable", "readonly", "focusable", "opaque"]
     }
   }
 }, {
   desc: "Append a new child to the document.",
   action: async ({ browser }) => ContentTask.spawn(browser, {}, () => {
-    let doc = content.document;
-    let button = doc.createElement("button");
+    const doc = content.document;
+    const button = doc.createElement("button");
     button.textContent = "Press Me!";
     doc.body.appendChild(button);
   }),
   expected: {
     sidebar: {
       childCount: 1
     }
   }
--- a/devtools/client/accessibility/test/browser/head.js
+++ b/devtools/client/accessibility/test/browser/head.js
@@ -40,17 +40,17 @@ function shutdownA11y() {
   }
 
   // Force collections to speed up accessibility service shutdown.
   Cu.forceGC();
   Cu.forceCC();
   Cu.forceShrinkingGC();
 
   return new Promise(resolve => {
-    let observe = (subject, topic, data) => {
+    const observe = (subject, topic, data) => {
       if (data === "0") {
         Services.obs.removeObserver(observe, "a11y-init-or-shutdown");
         resolve();
       }
     };
     // This event is coming from Gecko accessibility module when the
     // accessibility service is shutdown or initialzied. We attempt to shutdown
     // accessibility service naturally if there are no more XPCOM references to
@@ -72,21 +72,21 @@ const EXPANDABLE_PROPS = ["actions", "st
  * @param {String} url
  *        The url to be loaded in the new tab
  * @return a promise that resolves to the tab object when
  *        the url is loaded
  */
 async function addTestTab(url) {
   info("Adding a new test tab with URL: '" + url + "'");
 
-  let tab = await addTab(url);
-  let panel = await initAccessibilityPanel(tab);
-  let win = panel.panelWin;
-  let doc = win.document;
-  let store = win.view.store;
+  const tab = await addTab(url);
+  const panel = await initAccessibilityPanel(tab);
+  const win = panel.panelWin;
+  const doc = win.document;
+  const store = win.view.store;
 
   EventUtils.sendMouseEvent({ type: "click" },
     doc.getElementById("accessibility-enable-button"), win);
 
   await waitUntilState(store, state =>
     state.accessibles.size === 1 && state.details.accessible &&
     state.details.accessible.role === "document");
 
@@ -105,47 +105,47 @@ async function addTestTab(url) {
   };
 }
 
 /**
  * Turn off accessibility features from within the panel. We call it before the
  * cleanup function to make sure that the panel is still present.
  */
 async function disableAccessibilityInspector(env) {
-  let { doc, win, panel } = env;
+  const { doc, win, panel } = env;
   // Disable accessibility service through the panel and wait for the shutdown
   // event.
-  let shutdown = panel._front.once("shutdown");
+  const shutdown = panel._front.once("shutdown");
   EventUtils.sendMouseEvent({ type: "click" },
     doc.getElementById("accessibility-disable-button"), win);
   await shutdown;
 }
 
 /**
  * Open the Accessibility panel for the given tab.
  *
  * @param {Element} tab
  *        Optional tab element for which you want open the Accessibility panel.
  *        The default tab is taken from the global variable |tab|.
  * @return a promise that is resolved once the panel is open.
  */
 async function initAccessibilityPanel(tab = gBrowser.selectedTab) {
-  let target = TargetFactory.forTab(tab);
-  let toolbox = await gDevTools.showToolbox(target, "accessibility");
+  const target = TargetFactory.forTab(tab);
+  const toolbox = await gDevTools.showToolbox(target, "accessibility");
   return toolbox.getCurrentPanel();
 }
 
 /**
  * Check the state of the accessibility tree.
  * @param  {document} doc       panel documnent.
  * @param  {Array}    expected  an array that represents an expected row list.
  */
 async function checkTreeState(doc, expected) {
   info("Checking tree state.");
-  let hasExpectedStructure = await BrowserTestUtils.waitForCondition(() =>
+  const hasExpectedStructure = await BrowserTestUtils.waitForCondition(() =>
     [...doc.querySelectorAll(".treeRow")].every((row, i) =>
       row.querySelector(".treeLabelCell").textContent === expected[i].role &&
       row.querySelector(".treeValueCell").textContent === expected[i].name),
     "Wait for the right tree update.");
 
   ok(hasExpectedStructure, "Tree structure is correct.");
 }
 
@@ -153,18 +153,18 @@ async function checkTreeState(doc, expec
  * Check the state of the accessibility sidebar.
  * @param  {Object} store         React store for the panel (includes store for
  *                                the sidebar).
  * @param  {Object} expectedState Expected state of the sidebar.
  */
 async function checkSidebarState(store, expectedState) {
   info("Checking sidebar state.");
   await waitUntilState(store, ({ details }) => {
-    for (let key of ORDERED_PROPS) {
-      let expected = expectedState[key];
+    for (const key of ORDERED_PROPS) {
+      const expected = expectedState[key];
       if (expected === undefined) {
         continue;
       }
 
       if (EXPANDABLE_PROPS.includes(key)) {
         if (JSON.stringify(details.accessible[key]) !== JSON.stringify(expected)) {
           return false;
         }
@@ -190,19 +190,19 @@ function selectRow(doc, rowNumber) {
 }
 
 /**
  * Toggle an expandable tree row.
  * @param  {document} doc       panel documnent.
  * @param  {Number}   rowNumber number of the row/tree node to be toggled.
  */
 async function toggleRow(doc, rowNumber) {
-  let win = doc.defaultView;
-  let twisty = doc.querySelectorAll(".theme-twisty")[rowNumber];
-  let expected = !twisty.classList.contains("open");
+  const win = doc.defaultView;
+  const twisty = doc.querySelectorAll(".theme-twisty")[rowNumber];
+  const expected = !twisty.classList.contains("open");
 
   info(`${expected ? "Expanding" : "Collapsing"} row ${rowNumber}.`);
 
   EventUtils.sendMouseEvent({ type: "click" }, twisty, win);
   await BrowserTestUtils.waitForCondition(() =>
     !twisty.classList.contains("devtools-throbber") &&
     expected === twisty.classList.contains("open"), "Twisty updated.");
 }
@@ -218,24 +218,24 @@ async function toggleRow(doc, rowNumber)
  *                                           tree and the sidebar can be checked
  *                      expected {JSON}      An expected states for the tree and
  *                                           the sidebar
  *                    }
  * @param  {Object} env  contains all relevant environment objects (same
  *                       structure as the return value of 'addTestTab' funciton)
  */
 async function runA11yPanelTests(tests, env) {
-  for (let { desc, action, expected } of tests) {
+  for (const { desc, action, expected } of tests) {
     info(desc);
 
     if (action) {
       await action(env);
     }
 
-    let { tree, sidebar } = expected;
+    const { tree, sidebar } = expected;
     if (tree) {
       await checkTreeState(env.doc, tree);
     }
 
     if (sidebar) {
       await checkSidebarState(env.store, sidebar);
     }
   }
@@ -273,17 +273,17 @@ function addA11yPanelTestsTask(tests, ur
  * the test and then disables accessibility tools.
  * @param {String}   msg    a message that is printed for the test
  * @param {String}   uri    test URL
  * @param {Function} task   task function containing the tests.
  */
 function addA11YPanelTask(msg, uri, task) {
   add_task(async function a11YPanelTask() {
     info(msg);
-    let env = await addTestTab(buildURL(uri));
+    const env = await addTestTab(buildURL(uri));
     await task(env);
     await disableAccessibilityInspector(env);
   });
 }
 
 /**
  * Reload panel target.
  * @param  {Object} target             Panel target.
--- a/devtools/client/application/initializer.js
+++ b/devtools/client/application/initializer.js
@@ -9,16 +9,18 @@ const require = BrowserLoader({
   baseURI: "resource://devtools/client/application/",
   window,
 }).require;
 
 const { createFactory } = require("devtools/client/shared/vendor/react");
 const { render, unmountComponentAtNode } = require("devtools/client/shared/vendor/react-dom");
 const Provider = createFactory(require("devtools/client/shared/vendor/react-redux").Provider);
 const { bindActionCreators } = require("devtools/client/shared/vendor/redux");
+const { L10nRegistry } = require("resource://gre/modules/L10nRegistry.jsm");
+const Services = require("Services");
 
 const { configureStore } = require("./src/create-store");
 const actions = require("./src/actions/index");
 
 const App = createFactory(require("./src/components/App"));
 
 /**
  * Global Application object in this panel. This object is expected by panel.js and is
@@ -46,23 +48,44 @@ window.Application = {
     this.client.addListener("serviceWorkerRegistrationListChanged", this.updateWorkers);
     this.client.addListener("registration-changed", this.updateWorkers);
     this.client.addListener("processListChanged", this.updateWorkers);
     this.toolbox.target.on("navigate", this.updateDomain);
 
     this.updateDomain();
     await this.updateWorkers();
 
+    const messageContexts = await this.createMessageContexts();
+
     // Render the root Application component.
-    const app = App({ client: this.client, serviceContainer });
+    const app = App({ client: this.client, messageContexts, serviceContainer });
     render(Provider({ store: this.store }, app), this.mount);
   },
 
+  /**
+   * Retrieve message contexts for the current locales, and return them as an array of
+   * MessageContext elements.
+   */
+  async createMessageContexts() {
+    const locales = Services.locale.getAppLocalesAsBCP47();
+    const generator =
+      L10nRegistry.generateContexts(locales, ["devtools/application.ftl"]);
+
+    // Return value of generateContexts is a generator and should be converted to
+    // a sync iterable before using it with React.
+    const contexts = [];
+    for await (const message of generator) {
+      contexts.push(message);
+    }
+
+    return contexts;
+  },
+
   async updateWorkers() {
-    let { service } = await this.client.mainRoot.listAllWorkers();
+    const { service } = await this.client.mainRoot.listAllWorkers();
     this.actions.updateWorkers(service);
   },
 
   updateDomain() {
     this.actions.updateDomain(this.toolbox.target.url);
   },
 
   destroy() {
--- a/devtools/client/application/src/components/App.js
+++ b/devtools/client/application/src/components/App.js
@@ -4,45 +4,51 @@
 
 "use strict";
 
 const PropTypes = require("devtools/client/shared/vendor/react-prop-types");
 const { createFactory, Component } = require("devtools/client/shared/vendor/react");
 const { connect } = require("devtools/client/shared/vendor/react-redux");
 const { main } = require("devtools/client/shared/vendor/react-dom-factories");
 
+const FluentReact = require("devtools/client/shared/vendor/fluent-react");
+const LocalizationProvider = createFactory(FluentReact.LocalizationProvider);
+
 const WorkerList = createFactory(require("./WorkerList"));
 const WorkerListEmpty = createFactory(require("./WorkerListEmpty"));
 
 /**
  * This is the main component for the application panel.
  */
 class App extends Component {
   static get propTypes() {
     return {
       client: PropTypes.object.isRequired,
       workers: PropTypes.object.isRequired,
       serviceContainer: PropTypes.object.isRequired,
       domain: PropTypes.string.isRequired,
+      messageContexts: PropTypes.array.isRequired,
     };
   }
 
   render() {
-    let { workers, domain, client, serviceContainer } = this.props;
+    let { workers, domain, client, serviceContainer, messageContexts } = this.props;
 
     // Filter out workers from other domains
     workers = workers.filter((x) => new URL(x.url).hostname === domain);
     const isEmpty = workers.length === 0;
 
     return (
-      main(
-        { className: `application ${isEmpty ? "application--empty" : ""}` },
-        isEmpty
-          ? WorkerListEmpty({ serviceContainer })
-          : WorkerList({ workers, client })
+      LocalizationProvider(
+        { messages: messageContexts },
+        main(
+          { className: `application ${isEmpty ? "application--empty" : ""}` },
+          isEmpty ? WorkerListEmpty({ serviceContainer })
+                  : WorkerList({ workers, client })
+        )
       )
     );
   }
 }
 
 // Exports
 
 module.exports = connect(
--- a/devtools/client/application/src/components/Worker.css
+++ b/devtools/client/application/src/components/Worker.css
@@ -68,13 +68,8 @@
 
 .worker__data > * {
   margin: 0;
 }
 
 .worker__data__updated {
   color: var(--theme-body-color-alt);
 }
-
-.worker__unregister-button {
-  /* TODO: remove this once/if we have proper capitalization in the strings file */
-  text-transform: capitalize;
-}
--- a/devtools/client/application/src/components/Worker.js
+++ b/devtools/client/application/src/components/Worker.js
@@ -1,29 +1,28 @@
 /* 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 { Component } = require("devtools/client/shared/vendor/react");
+const { createFactory, Component } = require("devtools/client/shared/vendor/react");
 const PropTypes = require("devtools/client/shared/vendor/react-prop-types");
 const { a, br, button, dd, dl, dt, header, li, section, span, time } =
   require("devtools/client/shared/vendor/react-dom-factories");
-const Services = require("Services");
 const { getUnicodeUrl, getUnicodeUrlPath } = require("devtools/client/shared/unicode-url");
 
+const FluentReact = require("devtools/client/shared/vendor/fluent-react");
+const Localized = createFactory(FluentReact.Localized);
+
 loader.lazyRequireGetter(this, "DebuggerClient",
   "devtools/shared/client/debugger-client", true);
 loader.lazyRequireGetter(this, "gDevToolsBrowser",
   "devtools/client/framework/devtools-browser", true);
 
-const Strings = Services.strings.createBundle(
-  "chrome://devtools/locale/aboutdebugging.properties");
-
 /**
  * This component is dedicated to display a worker, more accurately a service worker, in
  * the list of workers displayed in the application panel. It displays information about
  * the worker as well as action links and buttons to interact with the worker (e.g. debug,
  * unregister, update etc...).
  */
 class Worker extends Component {
   static get propTypes() {
@@ -50,35 +49,35 @@ class Worker extends Component {
   }
 
   debug() {
     if (!this.isRunning()) {
       console.log("Service workers cannot be debugged if they are not running");
       return;
     }
 
-    let { client, worker } = this.props;
+    const { client, worker } = this.props;
     gDevToolsBrowser.openWorkerToolbox(client, worker.workerActor);
   }
 
   start() {
     if (!this.isActive() || this.isRunning()) {
       console.log("Running or inactive service workers cannot be started");
       return;
     }
 
-    let { client, worker } = this.props;
+    const { client, worker } = this.props;
     client.request({
       to: worker.registrationActor,
       type: "start"
     });
   }
 
   unregister() {
-    let { client, worker } = this.props;
+    const { client, worker } = this.props;
     client.request({
       to: worker.registrationActor,
       type: "unregister"
     });
   }
 
   isRunning() {
     // We know the worker is running if it has a worker actor.
@@ -97,79 +96,102 @@ class Worker extends Component {
     }
     // We cannot get service worker registrations unless the registration is in
     // ACTIVE state. Unable to know the actual state ("installing", "waiting"), we
     // display a custom state "registering" for now. See Bug 1153292.
     return "registering";
   }
 
   formatScope(scope) {
-    let [, remainder] = getUnicodeUrl(scope).split("://");
+    const [, remainder] = getUnicodeUrl(scope).split("://");
     return remainder || scope;
   }
 
   formatSource(source) {
-    let parts = source.split("/");
+    const parts = source.split("/");
     return getUnicodeUrlPath(parts[parts.length - 1]);
   }
 
   render() {
-    let { worker } = this.props;
-    let status = this.getServiceWorkerStatus();
+    const { worker } = this.props;
+    const status = this.getServiceWorkerStatus();
 
     const unregisterButton = this.isActive() ?
-      button({
-        onClick: this.unregister,
-        className: "devtools-button worker__unregister-button js-unregister-button",
-        "data-standalone": true
-      },
-        Strings.GetStringFromName("unregister"))
-      : null;
+      Localized(
+        { id: "serviceworker-worker-unregister" },
+        button({
+          onClick: this.unregister,
+          className: "devtools-button worker__unregister-button js-unregister-button",
+          "data-standalone": true
+        })
+      ) : null;
 
     const debugLinkDisabled = this.isRunning() ? "" : "disabled";
 
-    const debugLink = a({
-      onClick: this.isRunning() ? this.debug : null,
-      title: this.isRunning() ? null : "Only running service workers can be debugged",
-      className: `${debugLinkDisabled} worker__debug-link js-debug-link`
+    const debugLink = Localized({
+      id: "serviceworker-worker-debug",
+      // The localized title is only displayed if the debug link is disabled.
+      attrs: { title: !this.isRunning() }
     },
-      Strings.GetStringFromName("debug"));
+      a({
+        onClick: this.isRunning() ? this.debug : null,
+        className: `${debugLinkDisabled} worker__debug-link js-debug-link`
+      })
+    );
 
     const startLink = !this.isRunning() ?
-      a({ onClick: this.start, className: "worker__start-link" },
-        Strings.GetStringFromName("start"))
-      : null;
+      Localized(
+        { id: "serviceworker-worker-start" },
+        a({
+          onClick: this.start,
+          className: "worker__start-link"
+        })
+      ) : null;
 
-    const lastUpdated = worker.lastUpdateTime
-      ? span({ className: "worker__data__updated" },
-          "Updated ",
-          time({ className: "js-sw-updated"},
-            new Date(worker.lastUpdateTime / 1000).toLocaleString()))
-      : null;
+    const lastUpdated = worker.lastUpdateTime ?
+      Localized(
+        {
+          id: "serviceworker-worker-updated",
+          // XXX: $date should normally be a Date object, but we pass the timestamp as a
+          // workaround. See Bug 1465718. worker.lastUpdateTime is in microseconds,
+          // convert to a valid timestamp in milliseconds by dividing by 1000.
+          "$date": worker.lastUpdateTime / 1000,
+          time: time({ className: "js-sw-updated" })
+        },
+        span({ className: "worker__data__updated" })
+      ) : null;
 
     return li({ className: "worker js-sw-container" },
       header(
         { className: "worker__header" },
         span({ title: worker.scope, className: "worker__scope js-sw-scope" },
           this.formatScope(worker.scope)),
         section(
           { className: "worker__controls" },
           unregisterButton),
       ),
       dl(
         { className: "worker__data" },
-        dt({ className: "worker__meta-name" }, "Source"),
+        Localized({ id: "serviceworker-worker-source" },
+          dt({ className: "worker__meta-name" })
+        ),
         dd({},
             span({ title: worker.scope, className: "worker__source-url js-source-url" },
               this.formatSource(worker.url)),
             debugLink,
             lastUpdated ? br({}) : null,
             lastUpdated ? lastUpdated : null),
-        dt({ className: "worker__meta-name" }, "Status"),
+        Localized({ id: "serviceworker-worker-status" },
+          dt({ className: "worker__meta-name" })
+        ),
         dd({},
-          Strings.GetStringFromName(status).toLowerCase(),
-          startLink)
+          Localized(
+            { id: "serviceworker-worker-status-" + status },
+            span({}),
+          ),
+          startLink
+        )
       )
     );
   }
 }
 
 module.exports = Worker;
--- a/devtools/client/application/src/components/WorkerList.css
+++ b/devtools/client/application/src/components/WorkerList.css
@@ -3,14 +3,14 @@
  * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
 
 .aboutdebugging-plug {
   text-align: right;
   padding: 1rem 0;
 }
 
 .aboutdebugging-plug__link {
-  margin-right: 0;
+  margin: 0;
 }
 
 .workers-container {
   flex-grow: 1;
 }
--- a/devtools/client/application/src/components/WorkerList.js
+++ b/devtools/client/application/src/components/WorkerList.js
@@ -5,16 +5,19 @@
 "use strict";
 
 const { openTrustedLink } = require("devtools/client/shared/link");
 const PropTypes = require("devtools/client/shared/vendor/react-prop-types");
 const { createFactory, Component } = require("devtools/client/shared/vendor/react");
 const { a, article, footer, h1, ul } = require("devtools/client/shared/vendor/react-dom-factories");
 const Worker = createFactory(require("./Worker"));
 
+const FluentReact = require("devtools/client/shared/vendor/fluent-react");
+const Localized = createFactory(FluentReact.Localized);
+
 /**
  * This component handles the list of service workers displayed in the application panel
  * and also displays a suggestion to use about debugging for debugging other service
  * workers.
  */
 class WorkerList extends Component {
   static get propTypes() {
     return {
@@ -23,30 +26,38 @@ class WorkerList extends Component {
     };
   }
 
   render() {
     const { workers, client } = this.props;
 
     return [
       article({ className: "workers-container" },
-        h1({}, "Service Workers"),
+        Localized(
+          { id: "serviceworker-list-header" },
+          h1({})
+        ),
         ul({},
           workers.map(worker => Worker({
             client,
             debugDisabled: false,
             worker,
           })))
       ),
-      footer({ className: "aboutdebugging-plug" },
-        "See about:debugging for Service Workers from other domains",
-        a({ className: "aboutdebugging-plug__link",
-            onClick: () => openTrustedLink("about:debugging#workers") },
-          "Open about:debugging"
-        )
+      Localized(
+        {
+          id: "serviceworker-list-aboutdebugging",
+          a: a(
+            {
+              className: "aboutdebugging-plug__link",
+              onClick: () => openTrustedLink("about:debugging#workers")
+            }
+          )
+        },
+        footer({ className: "aboutdebugging-plug" })
       )
     ];
   }
 }
 
 // Exports
 
 module.exports = WorkerList;
--- a/devtools/client/application/src/components/WorkerListEmpty.js
+++ b/devtools/client/application/src/components/WorkerListEmpty.js
@@ -1,18 +1,22 @@
 /* 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 { openWebLink, openTrustedLink } = require("devtools/client/shared/link");
 const PropTypes = require("devtools/client/shared/vendor/react-prop-types");
-const { Component } = require("devtools/client/shared/vendor/react");
+const { createFactory, Component } = require("devtools/client/shared/vendor/react");
 const { a, article, h1, li, p, ul } = require("devtools/client/shared/vendor/react-dom-factories");
+
+const FluentReact = require("devtools/client/shared/vendor/fluent-react");
+const Localized = createFactory(FluentReact.Localized);
+
 const DOC_URL = "https://developer.mozilla.org/docs/Web/API/Service_Worker_API/Using_Service_Workers" +
   "?utm_source=devtools&utm_medium=sw-panel-blank";
 
 /**
  * This component displays help information when no service workers are found for the
  * current target.
  */
 class WorkerListEmpty extends Component {
@@ -36,55 +40,46 @@ class WorkerListEmpty extends Component 
 
   openDocumentation() {
     openWebLink(DOC_URL);
   }
 
   render() {
     return article(
       { className: "worker-list-empty" },
-      h1(
-        { className: "worker-list-empty__title" },
-        "You need to register a Service Worker to inspect it here.",
-        a(
-          { className: "external-link", onClick: () => this.openDocumentation() },
-          "Learn More"
-        )
+      Localized({
+        id: "serviceworker-empty-intro",
+        a: a({ className: "external-link", onClick: () => this.openDocumentation() })
+      },
+        h1({ className: "worker-list-empty__title" })
       ),
-      p(
-        {},
-        `If the current page should have a service worker, ` +
-        `here are some things you can try:`,
+      Localized(
+        { id: "serviceworker-empty-suggestions" },
+        p({})
       ),
       ul(
         { className: "worker-list-empty__tips" },
-        li(
-          { className: "worker-list-empty__tips__item" },
-          "Look for errors in the Console.",
-          a(
-            { className: "link", onClick: () => this.switchToConsole() },
-            "Open the Console"
-          )
+        Localized({
+          id: "serviceworker-empty-suggestions-console",
+          a: a({ className: "link", onClick: () => this.switchToConsole() })
+        },
+          li({ className: "worker-list-empty__tips__item" })
         ),
-        li(
-          { className: "worker-list-empty__tips__item" },
-          "Step through you Service Worker registration and look for exceptions.",
-          a(
-            { className: "link", onClick: () => this.switchToDebugger()},
-            "Open the Debugger"
-          )
+        Localized({
+          id: "serviceworker-empty-suggestions-debugger",
+          a: a({ className: "link", onClick: () => this.switchToDebugger() })
+        },
+          li({ className: "worker-list-empty__tips__item" })
         ),
-        li(
-          { className: "worker-list-empty__tips__item" },
-          "Inspect Service Workers from other domains.",
-          a(
-            { className: "external-link", onClick: () => this.openAboutDebugging() },
-            "Open about:debugging"
-          )
-        )
+        Localized({
+          id: "serviceworker-empty-suggestions-aboutdebugging",
+          a: a({ className: "link", onClick: () => this.openAboutDebugging() })
+        },
+          li({ className: "worker-list-empty__tips__item" })
+        ),
       )
     );
   }
 }
 
 // Exports
 
 module.exports = WorkerListEmpty;
--- a/devtools/client/application/src/reducers/page-state.js
+++ b/devtools/client/application/src/reducers/page-state.js
@@ -17,17 +17,17 @@ function PageState() {
 
 function getDomainFromUrl(url) {
   return new URL(url).hostname;
 }
 
 function pageReducer(state = PageState(), action) {
   switch (action.type) {
     case UPDATE_DOMAIN: {
-      let { url } = action;
+      const { url } = action;
       return {
         domain: getDomainFromUrl(url)
       };
     }
 
     default:
       return state;
   }
--- a/devtools/client/application/src/reducers/workers-state.js
+++ b/devtools/client/application/src/reducers/workers-state.js
@@ -13,17 +13,17 @@ function WorkersState() {
     // Array of all service workers
     list: [],
   };
 }
 
 function workersReducer(state = WorkersState(), action) {
   switch (action.type) {
     case UPDATE_WORKERS: {
-      let { workers } = action;
+      const { workers } = action;
       return { list: workers };
     }
 
     default:
       return state;
   }
 }
 
--- a/devtools/client/application/test/browser_application_panel_debug-service-worker.js
+++ b/devtools/client/application/test/browser_application_panel_debug-service-worker.js
@@ -8,36 +8,36 @@ Services.scriptloader.loadSubScript(
   "chrome://mochitests/content/browser/devtools/client/debugger/new/test/mochitest/helpers.js",
   this);
 
 const TAB_URL = URL_ROOT + "service-workers/debug.html";
 
 add_task(async function() {
   await enableApplicationPanel();
 
-  let { panel, tab, target } = await openNewTabAndApplicationPanel(TAB_URL);
-  let doc = panel.panelWin.document;
+  const { panel, tab, target } = await openNewTabAndApplicationPanel(TAB_URL);
+  const doc = panel.panelWin.document;
 
   info("Wait until the service worker appears in the application panel");
   await waitUntil(() => getWorkerContainers(doc).length === 1);
 
-  let container = getWorkerContainers(doc)[0];
+  const container = getWorkerContainers(doc)[0];
   info("Wait until the debug link is displayed and enabled");
   await waitUntil(() =>
     container.querySelector(".js-debug-link:not(.worker__debug-link--disabled)"));
 
   info("Click on the debug link and wait for the new toolbox to be ready");
-  let onToolboxReady = gDevTools.once("toolbox-ready");
+  const onToolboxReady = gDevTools.once("toolbox-ready");
 
-  let debugLink = container.querySelector(".js-debug-link");
+  const debugLink = container.querySelector(".js-debug-link");
   debugLink.click();
 
-  let serviceWorkerToolbox = await onToolboxReady;
+  const serviceWorkerToolbox = await onToolboxReady;
   await serviceWorkerToolbox.selectTool("jsdebugger");
-  let debuggerContext = createDebuggerContext(serviceWorkerToolbox);
+  const debuggerContext = createDebuggerContext(serviceWorkerToolbox);
 
   await waitForSources(debuggerContext, "debug-sw.js");
   await selectSource(debuggerContext, "debug-sw.js");
   await waitForLoadedSource(debuggerContext, "debug-sw.js");
 
   await addBreakpoint(debuggerContext, "debug-sw.js", 8);
 
   info("Reload the main tab, expect the service worker script to pause on line 8");
--- a/devtools/client/application/test/browser_application_panel_list-domain-workers.js
+++ b/devtools/client/application/test/browser_application_panel_list-domain-workers.js
@@ -11,18 +11,18 @@
 const SIMPLE_URL = URL_ROOT + "service-workers/simple.html";
 const OTHER_URL = SIMPLE_URL.replace("example.com", "test1.example.com");
 const EMPTY_URL = (URL_ROOT + "service-workers/empty.html")
   .replace("example.com", "test2.example.com");
 
 add_task(async function() {
   await enableApplicationPanel();
 
-  let { panel, target } = await openNewTabAndApplicationPanel(SIMPLE_URL);
-  let doc = panel.panelWin.document;
+  const { panel, target } = await openNewTabAndApplicationPanel(SIMPLE_URL);
+  const doc = panel.panelWin.document;
 
   info("Wait until the service worker appears in the application panel");
   await waitUntil(() => getWorkerContainers(doc).length === 1);
 
   let scopeEl = getWorkerContainers(doc)[0].querySelector(".js-sw-scope");
   ok(scopeEl.textContent.startsWith("example.com"),
     "First service worker registration is displayed for the correct domain");
 
--- a/devtools/client/application/test/browser_application_panel_list-several-workers.js
+++ b/devtools/client/application/test/browser_application_panel_list-several-workers.js
@@ -9,18 +9,18 @@
  */
 
 const SIMPLE_URL = URL_ROOT + "service-workers/simple.html";
 const OTHER_SCOPE_URL = URL_ROOT + "service-workers/scope-page.html";
 
 add_task(async function() {
   await enableApplicationPanel();
 
-  let { panel, target } = await openNewTabAndApplicationPanel(SIMPLE_URL);
-  let doc = panel.panelWin.document;
+  const { panel, target } = await openNewTabAndApplicationPanel(SIMPLE_URL);
+  const doc = panel.panelWin.document;
 
   info("Wait until the service worker appears in the application panel");
   await waitUntil(() => getWorkerContainers(doc).length === 1);
 
   info("Wait until the unregister button is displayed for the service worker");
   await waitUntil(() => getWorkerContainers(doc)[0]
     .querySelector(".js-unregister-button"));
 
--- a/devtools/client/application/test/browser_application_panel_list-single-worker.js
+++ b/devtools/client/application/test/browser_application_panel_list-single-worker.js
@@ -3,47 +3,47 @@
 
 "use strict";
 
 const TAB_URL = URL_ROOT + "service-workers/dynamic-registration.html";
 
 add_task(async function() {
   await enableApplicationPanel();
 
-  let { panel, tab } = await openNewTabAndApplicationPanel(TAB_URL);
-  let doc = panel.panelWin.document;
+  const { panel, tab } = await openNewTabAndApplicationPanel(TAB_URL);
+  const doc = panel.panelWin.document;
 
-  let isWorkerListEmpty = !!doc.querySelector(".worker-list-empty");
+  const isWorkerListEmpty = !!doc.querySelector(".worker-list-empty");
   ok(isWorkerListEmpty, "No Service Worker displayed");
 
   info("Register a service worker in the page.");
   await ContentTask.spawn(tab.linkedBrowser, {}, async function() {
     content.wrappedJSObject.registerServiceWorker();
   });
 
   info("Wait until the service worker appears in the application panel");
   await waitUntil(() => getWorkerContainers(doc).length > 0);
 
-  let workerContainer = getWorkerContainers(doc)[0];
+  const workerContainer = getWorkerContainers(doc)[0];
 
   info("Wait until the unregister button is displayed for the service worker");
   await waitUntil(() => workerContainer.querySelector(".js-unregister-button"));
 
-  let scopeEl = workerContainer.querySelector(".js-sw-scope");
-  let expectedScope = "example.com/browser/devtools/client/application/test/" +
+  const scopeEl = workerContainer.querySelector(".js-sw-scope");
+  const expectedScope = "example.com/browser/devtools/client/application/test/" +
                       "service-workers/";
   ok(scopeEl.textContent.startsWith(expectedScope),
     "Service worker has the expected scope");
 
-  let updatedEl = workerContainer.querySelector(".js-sw-updated");
+  const updatedEl = workerContainer.querySelector(".js-sw-updated");
   ok(updatedEl.textContent.includes(`${new Date().getFullYear()}`),
     "Service worker has a last updated time");
 
   info("Unregister the service worker");
   await ContentTask.spawn(tab.linkedBrowser, {}, async function() {
-    let registration = await content.wrappedJSObject.sw;
+    const registration = await content.wrappedJSObject.sw;
     registration.unregister();
   });
 
   info("Wait until the service worker is removed from the application panel");
   await waitUntil(() => getWorkerContainers(doc).length === 0);
 });
 
--- a/devtools/client/application/test/browser_application_panel_list-unicode.js
+++ b/devtools/client/application/test/browser_application_panel_list-unicode.js
@@ -9,31 +9,31 @@ const TAB_URL = (URL_ROOT + "service-wor
 /**
  * Check that the application panel displays filenames and URL's in human-readable,
  * Unicode characters, and not encoded URI's or punycode.
  */
 
 add_task(async function() {
   await enableApplicationPanel();
 
-  let { panel, target } = await openNewTabAndApplicationPanel(TAB_URL);
-  let doc = panel.panelWin.document;
+  const { panel, target } = await openNewTabAndApplicationPanel(TAB_URL);
+  const doc = panel.panelWin.document;
 
   info("Wait until the service worker appears in the application panel");
   await waitUntil(() => getWorkerContainers(doc).length === 1);
 
-  let workerContainer = getWorkerContainers(doc)[0];
+  const workerContainer = getWorkerContainers(doc)[0];
 
-  let scopeEl = workerContainer.querySelector(".js-sw-scope");
+  const scopeEl = workerContainer.querySelector(".js-sw-scope");
   ok(
     scopeEl.textContent.startsWith(
       "\u03C0\u03B1\u03C1\u03AC\u03B4\u03B5\u03B9\u03B3\u03BC\u03B1." +
       "\u03B4\u03BF\u03BA\u03B9\u03BC\u03AE"),
     "Service worker has the expected Unicode scope"
   );
-  let urlEl = workerContainer.querySelector(".js-source-url");
+  const urlEl = workerContainer.querySelector(".js-source-url");
   ok(
     urlEl.textContent.endsWith("\u65E5\u672C"),
     "Service worker has the expected Unicode url"
   );
 
   await unregisterAllWorkers(target.client);
 });
--- a/devtools/client/application/test/head.js
+++ b/devtools/client/application/test/head.js
@@ -41,35 +41,35 @@ function getWorkerContainers(doc) {
 }
 
 function navigate(target, url, waitForTargetEvent = "navigate") {
   executeSoon(() => target.activeTab.navigateTo(url));
   return once(target, waitForTargetEvent);
 }
 
 async function openNewTabAndApplicationPanel(url) {
-  let tab = await addTab(url);
-  let target = TargetFactory.forTab(tab);
+  const tab = await addTab(url);
+  const target = TargetFactory.forTab(tab);
   await target.makeRemote();
 
-  let toolbox = await gDevTools.showToolbox(target, "application");
-  let panel = toolbox.getCurrentPanel();
+  const toolbox = await gDevTools.showToolbox(target, "application");
+  const panel = toolbox.getCurrentPanel();
   return { panel, tab, target, toolbox };
 }
 
 async function unregisterAllWorkers(client) {
   info("Wait until all workers have a valid registrationActor");
   let workers;
   await asyncWaitUntil(async function() {
     workers = await client.mainRoot.listAllWorkers();
     const allWorkersRegistered =
       workers.service.every(worker => !!worker.registrationActor);
     return allWorkersRegistered;
   });
 
   info("Unregister all service workers");
-  for (let worker of workers.service) {
+  for (const worker of workers.service) {
     await client.request({
       to: worker.registrationActor,
       type: "unregister"
     });
   }
 }
--- a/devtools/client/application/test/service-workers/debug-sw.js
+++ b/devtools/client/application/test/service-workers/debug-sw.js
@@ -1,10 +1,10 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 "use strict";
 
 // Bug 1328293
 self.onfetch = function(event) {
-  let a = 5;
+  const a = 5;
   console.log(a);
 };
--- a/devtools/client/canvasdebugger/callslist.js
+++ b/devtools/client/canvasdebugger/callslist.js
@@ -44,68 +44,68 @@ var CallsListView = extend(WidgetMethods
    *
    * @param array functionCalls
    *        A list of function call actors received from the backend.
    */
   showCalls: function(functionCalls) {
     this.empty();
 
     for (let i = 0, len = functionCalls.length; i < len; i++) {
-      let call = functionCalls[i];
+      const call = functionCalls[i];
 
-      let view = document.createElement("vbox");
+      const view = document.createElement("vbox");
       view.className = "call-item-view devtools-monospace";
       view.setAttribute("flex", "1");
 
-      let contents = document.createElement("hbox");
+      const contents = document.createElement("hbox");
       contents.className = "call-item-contents";
       contents.setAttribute("align", "center");
       contents.addEventListener("dblclick", this._onExpand);
       view.appendChild(contents);
 
-      let index = document.createElement("label");
+      const index = document.createElement("label");
       index.className = "plain call-item-index";
       index.setAttribute("flex", "1");
       index.setAttribute("value", i + 1);
 
-      let gutter = document.createElement("hbox");
+      const gutter = document.createElement("hbox");
       gutter.className = "call-item-gutter";
       gutter.appendChild(index);
       contents.appendChild(gutter);
 
       if (call.callerPreview) {
-        let context = document.createElement("label");
+        const context = document.createElement("label");
         context.className = "plain call-item-context";
         context.setAttribute("value", call.callerPreview);
         contents.appendChild(context);
 
-        let separator = document.createElement("label");
+        const separator = document.createElement("label");
         separator.className = "plain call-item-separator";
         separator.setAttribute("value", ".");
         contents.appendChild(separator);
       }
 
-      let name = document.createElement("label");
+      const name = document.createElement("label");
       name.className = "plain call-item-name";
       name.setAttribute("value", call.name);
       contents.appendChild(name);
 
-      let argsPreview = document.createElement("label");
+      const argsPreview = document.createElement("label");
       argsPreview.className = "plain call-item-args";
       argsPreview.setAttribute("crop", "end");
       argsPreview.setAttribute("flex", "100");
       // Getters and setters are displayed differently from regular methods.
       if (call.type == CallWatcherFront.METHOD_FUNCTION) {
         argsPreview.setAttribute("value", "(" + call.argsPreview + ")");
       } else {
         argsPreview.setAttribute("value", " = " + call.argsPreview);
       }
       contents.appendChild(argsPreview);
 
-      let location = document.createElement("label");
+      const location = document.createElement("label");
       location.className = "plain call-item-location";
       location.setAttribute("value", getFileName(call.file) + ":" + call.line);
       location.setAttribute("crop", "start");
       location.setAttribute("flex", "1");
       location.addEventListener("mousedown", this._onExpand);
       contents.appendChild(location);
 
       // Append a function call item to this container.
@@ -134,25 +134,25 @@ var CallsListView = extend(WidgetMethods
   /**
    * Displays an image in the rendering preview of this container, generated
    * for the specified draw call in the recorded animation frame snapshot.
    *
    * @param array screenshot
    *        A single "snapshot-image" instance received from the backend.
    */
   showScreenshot: function(screenshot) {
-    let { index, width, height, scaling, flipped, pixels } = screenshot;
+    const { index, width, height, scaling, flipped, pixels } = screenshot;
 
-    let screenshotNode = $("#screenshot-image");
+    const screenshotNode = $("#screenshot-image");
     screenshotNode.setAttribute("flipped", flipped);
     drawBackground("screenshot-rendering", width, height, pixels);
 
-    let dimensionsNode = $("#screenshot-dimensions");
-    let actualWidth = (width / scaling) | 0;
-    let actualHeight = (height / scaling) | 0;
+    const dimensionsNode = $("#screenshot-dimensions");
+    const actualWidth = (width / scaling) | 0;
+    const actualHeight = (height / scaling) | 0;
     dimensionsNode.setAttribute("value",
       SHARED_L10N.getFormatStr("dimensions", actualWidth, actualHeight));
 
     window.emit(EVENTS.CALL_SCREENSHOT_DISPLAYED);
   },
 
   /**
    * Populates this container's footer with a list of thumbnails, one generated
@@ -160,34 +160,34 @@ var CallsListView = extend(WidgetMethods
    *
    * @param array thumbnails
    *        An array of "snapshot-image" instances received from the backend.
    */
   showThumbnails: function(thumbnails) {
     while (this._filmstrip.hasChildNodes()) {
       this._filmstrip.firstChild.remove();
     }
-    for (let thumbnail of thumbnails) {
+    for (const thumbnail of thumbnails) {
       this.appendThumbnail(thumbnail);
     }
 
     window.emit(EVENTS.THUMBNAILS_DISPLAYED);
   },
 
   /**
    * Displays an image in the thumbnails list of this container, generated
    * for the specified draw call in the recorded animation frame snapshot.
    *
    * @param array thumbnail
    *        A single "snapshot-image" instance received from the backend.
    */
   appendThumbnail: function(thumbnail) {
-    let { index, width, height, flipped, pixels } = thumbnail;
+    const { index, width, height, flipped, pixels } = thumbnail;
 
-    let thumbnailNode = document.createElementNS(HTML_NS, "canvas");
+    const thumbnailNode = document.createElementNS(HTML_NS, "canvas");
     thumbnailNode.setAttribute("flipped", flipped);
     thumbnailNode.width = Math.max(CanvasFront.THUMBNAIL_SIZE, width);
     thumbnailNode.height = Math.max(CanvasFront.THUMBNAIL_SIZE, height);
     drawImage(thumbnailNode, width, height, pixels, { centered: true });
 
     thumbnailNode.className = "filmstrip-thumbnail";
     thumbnailNode.onmousedown = e => this._onThumbnailClick(e, index);
     thumbnailNode.setAttribute("index", index);
@@ -198,23 +198,23 @@ var CallsListView = extend(WidgetMethods
    * Sets the currently highlighted thumbnail in this container.
    * A screenshot will always correlate to a thumbnail in the filmstrip,
    * both being identified by the same 'index' of the context function call.
    *
    * @param number index
    *        The context function call's index.
    */
   set highlightedThumbnail(index) {
-    let currHighlightedThumbnail = $(".filmstrip-thumbnail[index='" + index + "']");
+    const currHighlightedThumbnail = $(".filmstrip-thumbnail[index='" + index + "']");
     if (currHighlightedThumbnail == null) {
       return;
     }
 
-    let prevIndex = this._highlightedThumbnailIndex;
-    let prevHighlightedThumbnail = $(".filmstrip-thumbnail[index='" + prevIndex + "']");
+    const prevIndex = this._highlightedThumbnailIndex;
+    const prevHighlightedThumbnail = $(".filmstrip-thumbnail[index='" + prevIndex + "']");
     if (prevHighlightedThumbnail) {
       prevHighlightedThumbnail.removeAttribute("highlighted");
     }
 
     currHighlightedThumbnail.setAttribute("highlighted", "");
     currHighlightedThumbnail.scrollIntoView();
     this._highlightedThumbnailIndex = index;
   },
@@ -254,37 +254,37 @@ var CallsListView = extend(WidgetMethods
     }
 
     // To keep continuous selection buttery smooth (for example, while pressing
     // the DOWN key or moving the slider), only display the screenshot after
     // any kind of user input stops.
     setConditionalTimeout("screenshot-display", SCREENSHOT_DISPLAY_DELAY, () => {
       return !this._isSliding;
     }, () => {
-      let frameSnapshot = SnapshotsListView.selectedItem.attachment.actor;
-      let functionCall = callItem.attachment.actor;
+      const frameSnapshot = SnapshotsListView.selectedItem.attachment.actor;
+      const functionCall = callItem.attachment.actor;
       frameSnapshot.generateScreenshotFor(functionCall).then(screenshot => {
         this.showScreenshot(screenshot);
         this.highlightedThumbnail = screenshot.index;
       }).catch(console.error);
     });
   },
 
   /**
    * The input listener for the calls searchbox.
    */
   _onSearch: function(e) {
-    let lowerCaseSearchToken = this._searchbox.value.toLowerCase();
+    const lowerCaseSearchToken = this._searchbox.value.toLowerCase();
 
     this.filterContents(e => {
-      let call = e.attachment.actor;
-      let name = call.name.toLowerCase();
-      let file = call.file.toLowerCase();
-      let line = call.line.toString().toLowerCase();
-      let args = call.argsPreview.toLowerCase();
+      const call = e.attachment.actor;
+      const name = call.name.toLowerCase();
+      const file = call.file.toLowerCase();
+      const line = call.line.toString().toLowerCase();
+      const args = call.argsPreview.toLowerCase();
 
       return name.includes(lowerCaseSearchToken) ||
              file.includes(lowerCaseSearchToken) ||
              line.includes(lowerCaseSearchToken) ||
              args.includes(lowerCaseSearchToken);
     });
   },
 
@@ -295,81 +295,81 @@ var CallsListView = extend(WidgetMethods
     this._filmstrip.scrollLeft += e.deltaX;
   },
 
   /**
    * The click/dblclick listener for an item or location url in this container.
    * When expanding an item, it's corresponding call stack will be displayed.
    */
   _onExpand: function(e) {
-    let callItem = this.getItemForElement(e.target);
-    let view = $(".call-item-view", callItem.target);
+    const callItem = this.getItemForElement(e.target);
+    const view = $(".call-item-view", callItem.target);
 
     // If the call stack nodes were already created, simply re-show them
     // or jump to the corresponding file and line in the Debugger if a
     // location link was clicked.
     if (view.hasAttribute("call-stack-populated")) {
-      let isExpanded = view.getAttribute("call-stack-expanded") == "true";
+      const isExpanded = view.getAttribute("call-stack-expanded") == "true";
 
       // If clicking on the location, jump to the Debugger.
       if (e.target.classList.contains("call-item-location")) {
-        let { file, line } = callItem.attachment.actor;
+        const { file, line } = callItem.attachment.actor;
         this._viewSourceInDebugger(file, line);
         return;
       }
       // Otherwise hide the call stack.
 
       view.setAttribute("call-stack-expanded", !isExpanded);
       $(".call-item-stack", view).hidden = isExpanded;
       return;
     }
 
-    let list = document.createElement("vbox");
+    const list = document.createElement("vbox");
     list.className = "call-item-stack";
     view.setAttribute("call-stack-populated", "");
     view.setAttribute("call-stack-expanded", "true");
     view.appendChild(list);
 
     /**
      * Creates a function call nodes in this container for a stack.
      */
-    let display = stack => {
+    const display = stack => {
       for (let i = 1; i < stack.length; i++) {
-        let call = stack[i];
+        const call = stack[i];
 
-        let contents = document.createElement("hbox");
+        const contents = document.createElement("hbox");
         contents.className = "call-item-stack-fn";
         contents.style.paddingInlineStart = (i * STACK_FUNC_INDENTATION) + "px";
 
-        let name = document.createElement("label");
+        const name = document.createElement("label");
         name.className = "plain call-item-stack-fn-name";
         name.setAttribute("value", "↳ " + call.name + "()");
         contents.appendChild(name);
 
-        let spacer = document.createElement("spacer");
+        const spacer = document.createElement("spacer");
         spacer.setAttribute("flex", "100");
         contents.appendChild(spacer);
 
-        let location = document.createElement("label");
+        const location = document.createElement("label");
         location.className = "plain call-item-stack-fn-location";
         location.setAttribute("value", getFileName(call.file) + ":" + call.line);
         location.setAttribute("crop", "start");
         location.setAttribute("flex", "1");
         location.addEventListener("mousedown", e => this._onStackFileClick(e, call));
         contents.appendChild(location);
 
         list.appendChild(contents);
       }
 
       window.emit(EVENTS.CALL_STACK_DISPLAYED);
     };
 
     // If this animation snapshot is loaded from disk, there are no corresponding
     // backend actors available and the data is immediately available.
-    let functionCall = callItem.attachment.actor;
+    const functionCall = callItem.attachment.actor;
     if (functionCall.isLoadedFromDisk) {
       display(functionCall.stack);
     } else {
       // ..otherwise we need to request the function call stack from the backend.
       callItem.attachment.actor.getDetails().then(fn => display(fn.stack));
     }
   },
 
@@ -395,17 +395,17 @@ var CallsListView = extend(WidgetMethods
     this.selectedIndex = index;
   },
 
   /**
    * The click listener for the "resume" button in this container's toolbar.
    */
   _onResume: function() {
     // Jump to the next draw call in the recorded animation frame snapshot.
-    let drawCall = getNextDrawCall(this.items, this.selectedItem);
+    const drawCall = getNextDrawCall(this.items, this.selectedItem);
     if (drawCall) {
       this.selectedItem = drawCall;
       return;
     }
 
     // If there are no more draw calls, just jump to the last context call.
     this._onStepOut();
   },
@@ -420,18 +420,18 @@ var CallsListView = extend(WidgetMethods
   /**
    * The click listener for the "step in" button in this container's toolbar.
    */
   _onStepIn: function() {
     if (this.selectedIndex == -1) {
       this._onResume();
       return;
     }
-    let callItem = this.selectedItem;
-    let { file, line } = callItem.attachment.actor;
+    const callItem = this.selectedItem;
+    const { file, line } = callItem.attachment.actor;
     this._viewSourceInDebugger(file, line);
   },
 
   /**
    * The click listener for the "step out" button in this container's toolbar.
    */
   _onStepOut: function() {
     this.selectedIndex = this.itemCount - 1;
--- a/devtools/client/canvasdebugger/canvasdebugger.js
+++ b/devtools/client/canvasdebugger/canvasdebugger.js
@@ -185,17 +185,17 @@ EventEmitter.decorate(this);
 var $ = (selector, target = document) => target.querySelector(selector);
 var $all = (selector, target = document) => target.querySelectorAll(selector);
 
 /**
  * Gets the fileName part of a string which happens to be an URL.
  */
 function getFileName(url) {
   try {
-    let { fileName } = NetworkHelper.nsIURL(url);
+    const { fileName } = NetworkHelper.nsIURL(url);
     return fileName || "/";
   } catch (e) {
     // This doesn't look like a url, or nsIURL can't handle it.
     return "";
   }
 }
 
 /**
@@ -208,17 +208,17 @@ function getFileName(url) {
  * @param number w
  *        The desired image data storage width.
  * @param number h
  *        The desired image data storage height.
  * @return ImageData
  *         The requested image data buffer.
  */
 function getImageDataStorage(ctx, w, h) {
-  let storage = getImageDataStorage.cache;
+  const storage = getImageDataStorage.cache;
   if (storage && storage.width == w && storage.height == h) {
     return storage;
   }
   return getImageDataStorage.cache = ctx.createImageData(w, h);
 }
 
 // The cache used in the `getImageDataStorage` function.
 getImageDataStorage.cache = null;
@@ -239,31 +239,31 @@ getImageDataStorage.cache = null;
  *        An array buffer view of the image data.
  * @param object options
  *        Additional options supported by this operation:
  *          - centered: specifies whether the image data should be centered
  *                      when copied in the canvas; this is useful when the
  *                      supplied pixels don't completely cover the canvas.
  */
 function drawImage(canvas, width, height, pixels, options = {}) {
-  let ctx = canvas.getContext("2d");
+  const ctx = canvas.getContext("2d");
 
   // FrameSnapshot actors return "snapshot-image" type instances with just an
   // empty pixel array if the source image is completely transparent.
   if (pixels.length <= 1) {
     ctx.clearRect(0, 0, canvas.width, canvas.height);
     return;
   }
 
-  let imageData = getImageDataStorage(ctx, width, height);
+  const imageData = getImageDataStorage(ctx, width, height);
   imageData.data.set(pixels);
 
   if (options.centered) {
-    let left = (canvas.width - width) / 2;
-    let top = (canvas.height - height) / 2;
+    const left = (canvas.width - width) / 2;
+    const top = (canvas.height - height) / 2;
     ctx.putImageData(imageData, left, top);
   } else {
     ctx.putImageData(imageData, 0, 0);
   }
 }
 
 /**
  * Draws image data into a canvas, and sets that as the rendering source for
@@ -274,17 +274,17 @@ function drawImage(canvas, width, height
  * @param number width
  *        The image data width.
  * @param number height
  *        The image data height.
  * @param array pixels
  *        An array buffer view of the image data.
  */
 function drawBackground(id, width, height, pixels) {
-  let canvas = document.createElementNS(HTML_NS, "canvas");
+  const canvas = document.createElementNS(HTML_NS, "canvas");
   canvas.width = width;
   canvas.height = height;
 
   drawImage(canvas, width, height, pixels);
   document.mozSetImageElement(id, canvas);
 
   // Used in tests. Not emitting an event because this shouldn't be "interesting".
   if (window._onMozSetImageElement) {
@@ -292,44 +292,44 @@ function drawBackground(id, width, heigh
   }
 }
 
 /**
  * Iterates forward to find the next draw call in a snapshot.
  */
 function getNextDrawCall(calls, call) {
   for (let i = calls.indexOf(call) + 1, len = calls.length; i < len; i++) {
-    let nextCall = calls[i];
-    let name = nextCall.attachment.actor.name;
+    const nextCall = calls[i];
+    const name = nextCall.attachment.actor.name;
     if (CanvasFront.DRAW_CALLS.has(name)) {
       return nextCall;
     }
   }
   return null;
 }
 
 /**
  * Iterates backwards to find the most recent screenshot for a function call
  * in a snapshot loaded from disk.
  */
 function getScreenshotFromCallLoadedFromDisk(calls, call) {
   for (let i = calls.indexOf(call); i >= 0; i--) {
-    let prevCall = calls[i];
-    let screenshot = prevCall.screenshot;
+    const prevCall = calls[i];
+    const screenshot = prevCall.screenshot;
     if (screenshot) {
       return screenshot;
     }
   }
   return CanvasFront.INVALID_SNAPSHOT_IMAGE;
 }
 
 /**
  * Iterates backwards to find the most recent thumbnail for a function call.
  */
 function getThumbnailForCall(thumbnails, index) {
   for (let i = thumbnails.length - 1; i >= 0; i--) {
-    let thumbnail = thumbnails[i];
+    const thumbnail = thumbnails[i];
     if (thumbnail.index <= index) {
       return thumbnail;
     }
   }
   return CanvasFront.INVALID_SNAPSHOT_IMAGE;
 }
--- a/devtools/client/canvasdebugger/snapshotslist.js
+++ b/devtools/client/canvasdebugger/snapshotslist.js
@@ -42,46 +42,46 @@ var SnapshotsListView = extend(WidgetMet
 
   /**
    * Adds a snapshot entry to this container.
    *
    * @return object
    *         The newly inserted item.
    */
   addSnapshot: function() {
-    let contents = document.createElement("hbox");
+    const contents = document.createElement("hbox");
     contents.className = "snapshot-item";
 
-    let thumbnail = document.createElementNS(HTML_NS, "canvas");
+    const thumbnail = document.createElementNS(HTML_NS, "canvas");
     thumbnail.className = "snapshot-item-thumbnail";
     thumbnail.width = CanvasFront.THUMBNAIL_SIZE;
     thumbnail.height = CanvasFront.THUMBNAIL_SIZE;
 
-    let title = document.createElement("label");
+    const title = document.createElement("label");
     title.className = "plain snapshot-item-title";
     title.setAttribute("value",
       L10N.getFormatStr("snapshotsList.itemLabel", this.itemCount + 1));
 
-    let calls = document.createElement("label");
+    const calls = document.createElement("label");
     calls.className = "plain snapshot-item-calls";
     calls.setAttribute("value",
       L10N.getStr("snapshotsList.loadingLabel"));
 
-    let save = document.createElement("label");
+    const save = document.createElement("label");
     save.className = "plain snapshot-item-save";
     save.addEventListener("click", this._onSaveButtonClick);
 
-    let spacer = document.createElement("spacer");
+    const spacer = document.createElement("spacer");
     spacer.setAttribute("flex", "1");
 
-    let footer = document.createElement("hbox");
+    const footer = document.createElement("hbox");
     footer.className = "snapshot-item-footer";
     footer.appendChild(save);
 
-    let details = document.createElement("vbox");
+    const details = document.createElement("vbox");
     details.className = "snapshot-item-details";
     details.appendChild(title);
     details.appendChild(calls);
     details.appendChild(spacer);
     details.appendChild(footer);
 
     contents.appendChild(thumbnail);
     contents.appendChild(details);
@@ -120,40 +120,40 @@ var SnapshotsListView = extend(WidgetMet
    *        The frame snapshot actor received from the backend.
    * @param object snapshotOverview
    *        Additional data about the snapshot received from the backend.
    */
   customizeSnapshot: function(snapshotItem, snapshotActor, snapshotOverview) {
     // Make sure the function call actors are stored on the item,
     // to be used when populating the CallsListView.
     snapshotItem.attachment.actor = snapshotActor;
-    let functionCalls = snapshotItem.attachment.calls = snapshotOverview.calls;
-    let thumbnails = snapshotItem.attachment.thumbnails = snapshotOverview.thumbnails;
-    let screenshot = snapshotItem.attachment.screenshot = snapshotOverview.screenshot;
+    const functionCalls = snapshotItem.attachment.calls = snapshotOverview.calls;
+    const thumbnails = snapshotItem.attachment.thumbnails = snapshotOverview.thumbnails;
+    const screenshot = snapshotItem.attachment.screenshot = snapshotOverview.screenshot;
 
-    let lastThumbnail = thumbnails[thumbnails.length - 1];
-    let { width, height, flipped, pixels } = lastThumbnail;
+    const lastThumbnail = thumbnails[thumbnails.length - 1];
+    const { width, height, flipped, pixels } = lastThumbnail;
 
-    let thumbnailNode = $(".snapshot-item-thumbnail", snapshotItem.target);
+    const thumbnailNode = $(".snapshot-item-thumbnail", snapshotItem.target);
     thumbnailNode.setAttribute("flipped", flipped);
     drawImage(thumbnailNode, width, height, pixels, { centered: true });
 
-    let callsNode = $(".snapshot-item-calls", snapshotItem.target);
-    let drawCalls = functionCalls.filter(e => CanvasFront.DRAW_CALLS.has(e.name));
+    const callsNode = $(".snapshot-item-calls", snapshotItem.target);
+    const drawCalls = functionCalls.filter(e => CanvasFront.DRAW_CALLS.has(e.name));
 
-    let drawCallsStr = PluralForm.get(drawCalls.length,
+    const drawCallsStr = PluralForm.get(drawCalls.length,
       L10N.getStr("snapshotsList.drawCallsLabel"));
-    let funcCallsStr = PluralForm.get(functionCalls.length,
+    const funcCallsStr = PluralForm.get(functionCalls.length,
       L10N.getStr("snapshotsList.functionCallsLabel"));
 
     callsNode.setAttribute("value",
       drawCallsStr.replace("#1", drawCalls.length) + ", " +
       funcCallsStr.replace("#1", functionCalls.length));
 
-    let saveNode = $(".snapshot-item-save", snapshotItem.target);
+    const saveNode = $(".snapshot-item-save", snapshotItem.target);
     saveNode.setAttribute("disabled", !!snapshotItem.isLoadedFromDisk);
     saveNode.setAttribute("value", snapshotItem.isLoadedFromDisk
       ? L10N.getStr("snapshotsList.loadedLabel")
       : L10N.getStr("snapshotsList.saveLabel"));
 
     // Make sure there's always a selected item available.
     if (!this.selectedItem) {
       this.selectedIndex = 0;
@@ -164,17 +164,17 @@ var SnapshotsListView = extend(WidgetMet
    * The select listener for this container.
    */
   _onSelect: function({ detail: snapshotItem }) {
     // Check to ensure the attachment has an actor, like
     // an in-progress recording.
     if (!snapshotItem || !snapshotItem.attachment.actor) {
       return;
     }
-    let { calls, thumbnails, screenshot } = snapshotItem.attachment;
+    const { calls, thumbnails, screenshot } = snapshotItem.attachment;
 
     $("#reload-notice").hidden = true;
     $("#empty-notice").hidden = true;
     $("#waiting-notice").hidden = false;
 
     $("#debugging-pane-contents").hidden = true;
     $("#screenshot-container").hidden = true;
     $("#snapshot-filmstrip").hidden = true;
@@ -297,17 +297,17 @@ var SnapshotsListView = extend(WidgetMet
   },
 
   /**
    * Stops recording animation. Called when a click on the stopwatch occurs during a recording,
    * or if a recording times out.
    */
   async _stopRecordingAnimation() {
     clearNamedTimeout("canvas-actor-recording");
-    let actorCanStop = await gTarget.actorHasMethod("canvas", "stopRecordingAnimationFrame");
+    const actorCanStop = await gTarget.actorHasMethod("canvas", "stopRecordingAnimationFrame");
 
     if (actorCanStop) {
       await gFront.stopRecordingAnimationFrame();
     } else {
       // If actor does not have the method to stop recording (Fx39+),
       // manually call the record failure method. This will call a connection failure
       // on disconnect as a result of `gFront.recordAnimationFrame()` never resolving,
       // but this is better than it hanging when there is no requestAnimationFrame anyway.
@@ -320,18 +320,18 @@ var SnapshotsListView = extend(WidgetMet
   },
 
   /**
    * Resolves from the front's recordAnimationFrame to setup the interface with the screenshots.
    */
   async _onRecordSuccess(snapshotActor) {
     // Clear bail-out case if frame found in CANVAS_ACTOR_RECORDING_ATTEMPT milliseconds
     clearNamedTimeout("canvas-actor-recording");
-    let snapshotItem = this.getItemAtIndex(this.itemCount - 1);
-    let snapshotOverview = await snapshotActor.getOverview();
+    const snapshotItem = this.getItemAtIndex(this.itemCount - 1);
+    const snapshotOverview = await snapshotActor.getOverview();
     this.customizeSnapshot(snapshotItem, snapshotActor, snapshotOverview);
 
     this._recording = false;
     $("#record-snapshot").removeAttribute("checked");
 
     window.emit(EVENTS.SNAPSHOT_RECORDING_COMPLETED);
     window.emit(EVENTS.SNAPSHOT_RECORDING_FINISHED);
   },
@@ -346,152 +346,152 @@ var SnapshotsListView = extend(WidgetMet
     window.emit(EVENTS.SNAPSHOT_RECORDING_FINISHED);
     this.removeLastSnapshot();
   },
 
   /**
    * The click listener for the "import" button in this container.
    */
   _onImportButtonClick: function() {
-    let fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
+    const fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
     fp.init(window, L10N.getStr("snapshotsList.saveDialogTitle"), Ci.nsIFilePicker.modeOpen);
     fp.appendFilter(L10N.getStr("snapshotsList.saveDialogJSONFilter"), "*.json");
     fp.appendFilter(L10N.getStr("snapshotsList.saveDialogAllFilter"), "*.*");
 
     fp.open(rv => {
       if (rv != Ci.nsIFilePicker.returnOK) {
         return;
       }
 
-      let channel = NetUtil.newChannel({
+      const channel = NetUtil.newChannel({
         uri: NetUtil.newURI(fp.file), loadUsingSystemPrincipal: true});
       channel.contentType = "text/plain";
 
       NetUtil.asyncFetch(channel, (inputStream, status) => {
         if (!Components.isSuccessCode(status)) {
           console.error("Could not import recorded animation frame snapshot file.");
           return;
         }
         var data;
         try {
-          let string = NetUtil.readInputStreamToString(inputStream, inputStream.available());
+          const string = NetUtil.readInputStreamToString(inputStream, inputStream.available());
           data = JSON.parse(string);
         } catch (e) {
           console.error("Could not read animation frame snapshot file.");
           return;
         }
         if (data.fileType != CALLS_LIST_SERIALIZER_IDENTIFIER) {
           console.error("Unrecognized animation frame snapshot file.");
           return;
         }
 
         // Add a `isLoadedFromDisk` flag on everything to avoid sending invalid
         // requests to the backend, since we're not dealing with actors anymore.
-        let snapshotItem = this.addSnapshot();
+        const snapshotItem = this.addSnapshot();
         snapshotItem.isLoadedFromDisk = true;
         data.calls.forEach(e => e.isLoadedFromDisk = true);
 
         this.customizeSnapshot(snapshotItem, data.calls, data);
       });
     });
   },
 
   /**
    * The click listener for the "save" button of each item in this container.
    */
   _onSaveButtonClick: function(e) {
-    let snapshotItem = this.getItemForElement(e.target);
+    const snapshotItem = this.getItemForElement(e.target);
 
-    let fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
+    const fp = Cc["@mozilla.org/filepicker;1"].createInstance(Ci.nsIFilePicker);
     fp.init(window, L10N.getStr("snapshotsList.saveDialogTitle"), Ci.nsIFilePicker.modeSave);
     fp.appendFilter(L10N.getStr("snapshotsList.saveDialogJSONFilter"), "*.json");
     fp.appendFilter(L10N.getStr("snapshotsList.saveDialogAllFilter"), "*.*");
     fp.defaultString = "snapshot.json";
 
     // Start serializing all the function call actors for the specified snapshot,
     // while the nsIFilePicker dialog is being opened. Snappy.
-    let serialized = (async function() {
-      let data = {
+    const serialized = (async function() {
+      const data = {
         fileType: CALLS_LIST_SERIALIZER_IDENTIFIER,
         version: CALLS_LIST_SERIALIZER_VERSION,
         calls: [],
         thumbnails: [],
         screenshot: null
       };
-      let functionCalls = snapshotItem.attachment.calls;
-      let thumbnails = snapshotItem.attachment.thumbnails;
-      let screenshot = snapshotItem.attachment.screenshot;
+      const functionCalls = snapshotItem.attachment.calls;
+      const thumbnails = snapshotItem.attachment.thumbnails;
+      const screenshot = snapshotItem.attachment.screenshot;
 
       // Prepare all the function calls for serialization.
       await DevToolsUtils.yieldingEach(functionCalls, (call, i) => {
-        let { type, name, file, line, timestamp, argsPreview, callerPreview } = call;
+        const { type, name, file, line, timestamp, argsPreview, callerPreview } = call;
         return call.getDetails().then(({ stack }) => {
           data.calls[i] = {
             type: type,
             name: name,
             file: file,
             line: line,
             stack: stack,
             timestamp: timestamp,
             argsPreview: argsPreview,
             callerPreview: callerPreview
           };
         });
       });
 
       // Prepare all the thumbnails for serialization.
       await DevToolsUtils.yieldingEach(thumbnails, (thumbnail, i) => {
-        let { index, width, height, flipped, pixels } = thumbnail;
+        const { index, width, height, flipped, pixels } = thumbnail;
         data.thumbnails.push({ index, width, height, flipped, pixels });
       });
 
       // Prepare the screenshot for serialization.
-      let { index, width, height, flipped, pixels } = screenshot;
+      const { index, width, height, flipped, pixels } = screenshot;
       data.screenshot = { index, width, height, flipped, pixels };
 
-      let string = JSON.stringify(data);
-      let converter = Cc["@mozilla.org/intl/scriptableunicodeconverter"]
+      const string = JSON.stringify(data);
+      const converter = Cc["@mozilla.org/intl/scriptableunicodeconverter"]
         .createInstance(Ci.nsIScriptableUnicodeConverter);
 
       converter.charset = "UTF-8";
       return converter.convertToInputStream(string);
     })();
 
     // Open the nsIFilePicker and wait for the function call actors to finish
     // being serialized, in order to save the generated JSON data to disk.
     fp.open({ done: result => {
       if (result == Ci.nsIFilePicker.returnCancel) {
         return;
       }
-      let footer = $(".snapshot-item-footer", snapshotItem.target);
-      let save = $(".snapshot-item-save", snapshotItem.target);
+      const footer = $(".snapshot-item-footer", snapshotItem.target);
+      const save = $(".snapshot-item-save", snapshotItem.target);
 
       // Show a throbber and a "Saving…" label if serializing isn't immediate.
       setNamedTimeout("call-list-save", CALLS_LIST_SLOW_SAVE_DELAY, () => {
         footer.classList.add("devtools-throbber");
         save.setAttribute("disabled", "true");
         save.setAttribute("value", L10N.getStr("snapshotsList.savingLabel"));
       });
 
       serialized.then(inputStream => {
-        let outputStream = FileUtils.openSafeFileOutputStream(fp.file);
+        const outputStream = FileUtils.openSafeFileOutputStream(fp.file);
 
         NetUtil.asyncCopy(inputStream, outputStream, status => {
           if (!Components.isSuccessCode(status)) {
             console.error("Could not save recorded animation frame snapshot file.");
           }
           clearNamedTimeout("call-list-save");
           footer.classList.remove("devtools-throbber");
           save.removeAttribute("disabled");
           save.setAttribute("value", L10N.getStr("snapshotsList.saveLabel"));
         });
       });
     }});
   }
 });
 
 function showNotification(toolbox, name, message) {
-  let notificationBox = toolbox.getNotificationBox();
-  let notification = notificationBox.getNotificationWithValue(name);
+  const notificationBox = toolbox.getNotificationBox();
+  const notification = notificationBox.getNotificationWithValue(name);
   if (!notification) {
     notificationBox.appendNotification(message, name, "", notificationBox.PRIORITY_WARNING_HIGH);
   }
 }
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-01.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-01.js
@@ -2,16 +2,16 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if the canvas debugger leaks on initialization and sudden destruction.
  * You can also use this initialization format as a template for other tests.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCallWatcherBackend(SIMPLE_CANVAS_URL);
+  const { target, front } = await initCallWatcherBackend(SIMPLE_CANVAS_URL);
 
   ok(target, "Should have a target available.");
   ok(front, "Should have a protocol front available.");
 
   await removeTab(target.tab);
   finish();
 }
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-02.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-02.js
@@ -2,35 +2,35 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if functions calls are recorded and stored for a canvas context,
  * and that their stack is successfully retrieved.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCallWatcherBackend(SIMPLE_CANVAS_URL);
+  const { target, front } = await initCallWatcherBackend(SIMPLE_CANVAS_URL);
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({
     tracedGlobals: ["CanvasRenderingContext2D", "WebGLRenderingContext"],
     startRecording: true,
     performReload: true,
     storeCalls: true
   });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
   // Allow the content to execute some functions.
   await waitForTick();
 
-  let functionCalls = await front.pauseRecording();
+  const functionCalls = await front.pauseRecording();
   ok(functionCalls,
     "An array of function call actors was sent after reloading.");
   ok(functionCalls.length > 0,
     "There's at least one function call actor available.");
 
   is(functionCalls[0].type, CallWatcherFront.METHOD_FUNCTION,
     "The called function is correctly identified as a method.");
   is(functionCalls[0].name, "clearRect",
@@ -40,17 +40,17 @@ async function ifTestingSupported() {
   is(functionCalls[0].line, 25,
     "The called function's line is correct.");
 
   is(functionCalls[0].callerPreview, "Object",
     "The called function's caller preview is correct.");
   is(functionCalls[0].argsPreview, "0, 0, 128, 128",
     "The called function's args preview is correct.");
 
-  let details = await functionCalls[1].getDetails();
+  const details = await functionCalls[1].getDetails();
   ok(details,
     "The first called function has some details available.");
 
   is(details.stack.length, 3,
     "The called function's stack depth is correct.");
 
   is(details.stack[0].name, "fillStyle",
     "The called function's stack is correct (1.1).");
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-03.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-03.js
@@ -2,35 +2,35 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if functions inside a single animation frame are recorded and stored
  * for a canvas context.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_URL);
+  const { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_URL);
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
-  let snapshotActor = await front.recordAnimationFrame();
+  const snapshotActor = await front.recordAnimationFrame();
   ok(snapshotActor,
     "A snapshot actor was sent after recording.");
 
-  let animationOverview = await snapshotActor.getOverview();
+  const animationOverview = await snapshotActor.getOverview();
   ok(snapshotActor,
     "An animation overview could be retrieved after recording.");
 
-  let functionCalls = animationOverview.calls;
+  const functionCalls = animationOverview.calls;
   ok(functionCalls,
     "An array of function call actors was sent after recording.");
   is(functionCalls.length, 8,
     "The number of function call actors is correct.");
 
   is(functionCalls[0].type, CallWatcherFront.METHOD_FUNCTION,
     "The first called function is correctly identified as a method.");
   is(functionCalls[0].name, "clearRect",
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-04.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-04.js
@@ -2,35 +2,35 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if draw calls inside a single animation frame generate and retrieve
  * the correct thumbnails.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_URL);
+  const { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_URL);
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
-  let snapshotActor = await front.recordAnimationFrame();
+  const snapshotActor = await front.recordAnimationFrame();
   ok(snapshotActor,
     "A snapshot actor was sent after recording.");
 
-  let animationOverview = await snapshotActor.getOverview();
+  const animationOverview = await snapshotActor.getOverview();
   ok(animationOverview,
     "An animation overview could be retrieved after recording.");
 
-  let thumbnails = animationOverview.thumbnails;
+  const thumbnails = animationOverview.thumbnails;
   ok(thumbnails,
     "An array of thumbnails was sent after recording.");
   is(thumbnails.length, 4,
     "The number of thumbnails is correct.");
 
   is(thumbnails[0].index, 0,
     "The first thumbnail's index is correct.");
   is(thumbnails[0].width, 50,
@@ -75,11 +75,11 @@ async function ifTestingSupported() {
   is([].find.call(Uint32(thumbnails[3].pixels), e => e > 0), 4290822336,
     "The fourth thumbnail's pixels seem to not be completely transparent.");
 
   await removeTab(target.tab);
   finish();
 }
 
 function Uint32(src) {
-  let charView = new Uint8Array(src);
+  const charView = new Uint8Array(src);
   return new Uint32Array(charView.buffer);
 }
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-05.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-05.js
@@ -2,35 +2,35 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if draw calls inside a single animation frame generate and retrieve
  * the correct "end result" screenshot.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_URL);
+  const { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_URL);
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
-  let snapshotActor = await front.recordAnimationFrame();
+  const snapshotActor = await front.recordAnimationFrame();
   ok(snapshotActor,
     "A snapshot actor was sent after recording.");
 
-  let animationOverview = await snapshotActor.getOverview();
+  const animationOverview = await snapshotActor.getOverview();
   ok(snapshotActor,
     "An animation overview could be retrieved after recording.");
 
-  let screenshot = animationOverview.screenshot;
+  const screenshot = animationOverview.screenshot;
   ok(screenshot,
     "A screenshot was sent after recording.");
 
   is(screenshot.index, 6,
     "The screenshot's index is correct.");
   is(screenshot.width, 128,
     "The screenshot's width is correct.");
   is(screenshot.height, 128,
@@ -40,11 +40,11 @@ async function ifTestingSupported() {
   is([].find.call(Uint32(screenshot.pixels), e => e > 0), 4290822336,
     "The screenshot's pixels seem to not be completely transparent.");
 
   await removeTab(target.tab);
   finish();
 }
 
 function Uint32(src) {
-  let charView = new Uint8Array(src);
+  const charView = new Uint8Array(src);
   return new Uint32Array(charView.buffer);
 }
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-06.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-06.js
@@ -1,48 +1,48 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if screenshots for arbitrary draw calls are generated properly.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_TRANSPARENT_URL);
+  const { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_TRANSPARENT_URL);
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
-  let snapshotActor = await front.recordAnimationFrame();
-  let animationOverview = await snapshotActor.getOverview();
+  const snapshotActor = await front.recordAnimationFrame();
+  const animationOverview = await snapshotActor.getOverview();
 
-  let functionCalls = animationOverview.calls;
+  const functionCalls = animationOverview.calls;
   ok(functionCalls,
     "An array of function call actors was sent after recording.");
   is(functionCalls.length, 8,
     "The number of function call actors is correct.");
 
   is(functionCalls[0].name, "clearRect",
     "The first called function's name is correct.");
   is(functionCalls[2].name, "fillRect",
     "The second called function's name is correct.");
   is(functionCalls[4].name, "fillRect",
     "The third called function's name is correct.");
   is(functionCalls[6].name, "fillRect",
     "The fourth called function's name is correct.");
 
-  let firstDrawCallScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[0]);
-  let secondDrawCallScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[2]);
-  let thirdDrawCallScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[4]);
-  let fourthDrawCallScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[6]);
+  const firstDrawCallScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[0]);
+  const secondDrawCallScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[2]);
+  const thirdDrawCallScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[4]);
+  const fourthDrawCallScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[6]);
 
   ok(firstDrawCallScreenshot,
     "The first draw call has a screenshot attached.");
   is(firstDrawCallScreenshot.index, 0,
     "The first draw call has the correct screenshot index.");
   is(firstDrawCallScreenshot.width, 128,
     "The first draw call has the correct screenshot width.");
   is(firstDrawCallScreenshot.height, 128,
@@ -90,11 +90,11 @@ async function ifTestingSupported() {
   isnot(thirdDrawCallScreenshot.pixels, fourthDrawCallScreenshot.pixels,
     "The screenshots taken on consecutive draw calls are different (3).");
 
   await removeTab(target.tab);
   finish();
 }
 
 function Uint32(src) {
-  let charView = new Uint8Array(src);
+  const charView = new Uint8Array(src);
   return new Uint32Array(charView.buffer);
 }
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-07.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-07.js
@@ -2,74 +2,74 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if screenshots for non-draw calls can still be retrieved properly,
  * by deferring the the most recent previous draw-call.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_URL);
+  const { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_URL);
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
-  let snapshotActor = await front.recordAnimationFrame();
-  let animationOverview = await snapshotActor.getOverview();
+  const snapshotActor = await front.recordAnimationFrame();
+  const animationOverview = await snapshotActor.getOverview();
 
-  let functionCalls = animationOverview.calls;
+  const functionCalls = animationOverview.calls;
   ok(functionCalls,
     "An array of function call actors was sent after recording.");
   is(functionCalls.length, 8,
     "The number of function call actors is correct.");
 
-  let firstNonDrawCall = await functionCalls[1].getDetails();
-  let secondNonDrawCall = await functionCalls[3].getDetails();
-  let lastNonDrawCall = await functionCalls[7].getDetails();
+  const firstNonDrawCall = await functionCalls[1].getDetails();
+  const secondNonDrawCall = await functionCalls[3].getDetails();
+  const lastNonDrawCall = await functionCalls[7].getDetails();
 
   is(firstNonDrawCall.name, "fillStyle",
     "The first non-draw function's name is correct.");
   is(secondNonDrawCall.name, "fillStyle",
     "The second non-draw function's name is correct.");
   is(lastNonDrawCall.name, "requestAnimationFrame",
     "The last non-draw function's name is correct.");
 
-  let firstScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[1]);
-  let secondScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[3]);
-  let lastScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[7]);
+  const firstScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[1]);
+  const secondScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[3]);
+  const lastScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[7]);
 
   ok(firstScreenshot,
     "A screenshot was successfully retrieved for the first non-draw function.");
   ok(secondScreenshot,
     "A screenshot was successfully retrieved for the second non-draw function.");
   ok(lastScreenshot,
     "A screenshot was successfully retrieved for the last non-draw function.");
 
-  let firstActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[0]);
+  const firstActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[0]);
   ok(sameArray(firstScreenshot.pixels, firstActualScreenshot.pixels),
     "The screenshot for the first non-draw function is correct.");
   is(firstScreenshot.width, 128,
     "The screenshot for the first non-draw function has the correct width.");
   is(firstScreenshot.height, 128,
     "The screenshot for the first non-draw function has the correct height.");
 
-  let secondActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[2]);
+  const secondActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[2]);
   ok(sameArray(secondScreenshot.pixels, secondActualScreenshot.pixels),
     "The screenshot for the second non-draw function is correct.");
   is(secondScreenshot.width, 128,
     "The screenshot for the second non-draw function has the correct width.");
   is(secondScreenshot.height, 128,
     "The screenshot for the second non-draw function has the correct height.");
 
-  let lastActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[6]);
+  const lastActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[6]);
   ok(sameArray(lastScreenshot.pixels, lastActualScreenshot.pixels),
     "The screenshot for the last non-draw function is correct.");
   is(lastScreenshot.width, 128,
     "The screenshot for the last non-draw function has the correct width.");
   is(lastScreenshot.height, 128,
     "The screenshot for the last non-draw function has the correct height.");
 
   ok(!sameArray(firstScreenshot.pixels, secondScreenshot.pixels),
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-08.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-08.js
@@ -2,29 +2,29 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that integers used in arguments are not cast to their constant, enum value
  * forms if the method's signature does not expect an enum. Bug 999687.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCanvasDebuggerBackend(SIMPLE_BITMASKS_URL);
+  const { target, front } = await initCanvasDebuggerBackend(SIMPLE_BITMASKS_URL);
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
-  let snapshotActor = await front.recordAnimationFrame();
-  let animationOverview = await snapshotActor.getOverview();
-  let functionCalls = animationOverview.calls;
+  const snapshotActor = await front.recordAnimationFrame();
+  const animationOverview = await snapshotActor.getOverview();
+  const functionCalls = animationOverview.calls;
 
   is(functionCalls[0].name, "clearRect",
     "The first called function's name is correct.");
   is(functionCalls[0].argsPreview, "0, 0, 4, 4",
     "The first called function's args preview is not cast to enums.");
 
   is(functionCalls[2].name, "fillRect",
     "The fillRect called function's name is correct.");
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-09.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-09.js
@@ -2,29 +2,29 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that integers used in arguments are not cast to their constant, enum value
  * forms if the method's signature does not expect an enum. Bug 999687.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCanvasDebuggerBackend(WEBGL_ENUM_URL);
+  const { target, front } = await initCanvasDebuggerBackend(WEBGL_ENUM_URL);
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
-  let snapshotActor = await front.recordAnimationFrame();
-  let animationOverview = await snapshotActor.getOverview();
-  let functionCalls = animationOverview.calls;
+  const snapshotActor = await front.recordAnimationFrame();
+  const animationOverview = await snapshotActor.getOverview();
+  const functionCalls = animationOverview.calls;
 
   is(functionCalls[0].name, "clear",
     "The function's name is correct.");
   is(functionCalls[0].argsPreview, "DEPTH_BUFFER_BIT | STENCIL_BUFFER_BIT | COLOR_BUFFER_BIT",
     "The bits passed into `gl.clear` have been cast to their enum values.");
 
   is(functionCalls[1].name, "bindTexture",
     "The function's name is correct.");
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-10.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-10.js
@@ -2,32 +2,32 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that the correct framebuffer, renderbuffer and textures are re-bound
  * after generating screenshots using the actor.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCanvasDebuggerBackend(WEBGL_BINDINGS_URL);
+  const { target, front } = await initCanvasDebuggerBackend(WEBGL_BINDINGS_URL);
   loadFrameScriptUtils();
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
-  let snapshotActor = await front.recordAnimationFrame();
-  let animationOverview = await snapshotActor.getOverview();
-  let functionCalls = animationOverview.calls;
+  const snapshotActor = await front.recordAnimationFrame();
+  const animationOverview = await snapshotActor.getOverview();
+  const functionCalls = animationOverview.calls;
 
-  let firstScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[0]);
+  const firstScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[0]);
   is(firstScreenshot.index, -1,
     "The first screenshot didn't encounter any draw call.");
   is(firstScreenshot.scaling, 0.25,
     "The first screenshot has the correct scaling.");
   is(firstScreenshot.width, CanvasFront.WEBGL_SCREENSHOT_MAX_HEIGHT,
     "The first screenshot has the correct width.");
   is(firstScreenshot.height, CanvasFront.WEBGL_SCREENSHOT_MAX_HEIGHT,
     "The first screenshot has the correct height.");
@@ -53,17 +53,17 @@ async function ifTestingSupported() {
     "The debuggee's gl context viewport's left coord. wasn't changed.");
   is((await evalInDebuggee("gl.getParameter(gl.VIEWPORT)[2]")),
     384,
     "The debuggee's gl context viewport's left coord. wasn't changed.");
   is((await evalInDebuggee("gl.getParameter(gl.VIEWPORT)[3]")),
     512,
     "The debuggee's gl context viewport's left coord. wasn't changed.");
 
-  let secondScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[1]);
+  const secondScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[1]);
   is(secondScreenshot.index, 1,
     "The second screenshot has the correct index.");
   is(secondScreenshot.width, CanvasFront.WEBGL_SCREENSHOT_MAX_HEIGHT,
     "The second screenshot has the correct width.");
   is(secondScreenshot.height, CanvasFront.WEBGL_SCREENSHOT_MAX_HEIGHT,
     "The second screenshot has the correct height.");
   is(secondScreenshot.scaling, 0.25,
     "The second screenshot has the correct scaling.");
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-11.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-11.js
@@ -2,35 +2,35 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that loops using setTimeout are recorded and stored
  * for a canvas context, and that the generated screenshots are correct.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCanvasDebuggerBackend(SET_TIMEOUT_URL);
+  const { target, front } = await initCanvasDebuggerBackend(SET_TIMEOUT_URL);
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
-  let snapshotActor = await front.recordAnimationFrame();
+  const snapshotActor = await front.recordAnimationFrame();
   ok(snapshotActor,
     "A snapshot actor was sent after recording.");
 
-  let animationOverview = await snapshotActor.getOverview();
+  const animationOverview = await snapshotActor.getOverview();
   ok(snapshotActor,
     "An animation overview could be retrieved after recording.");
 
-  let functionCalls = animationOverview.calls;
+  const functionCalls = animationOverview.calls;
   ok(functionCalls,
     "An array of function call actors was sent after recording.");
   is(functionCalls.length, 8,
     "The number of function call actors is correct.");
 
   is(functionCalls[0].type, CallWatcherFront.METHOD_FUNCTION,
     "The first called function is correctly identified as a method.");
   is(functionCalls[0].name, "clearRect",
@@ -65,55 +65,55 @@ async function ifTestingSupported() {
     "The last called function's file is correct.");
   is(functionCalls[7].line, 30,
     "The last called function's line is correct.");
   ok(functionCalls[7].argsPreview.includes("Function"),
     "The last called function's args preview is correct.");
   is(functionCalls[7].callerPreview, "Object",
     "The last called function's caller preview is correct.");
 
-  let firstNonDrawCall = await functionCalls[1].getDetails();
-  let secondNonDrawCall = await functionCalls[3].getDetails();
-  let lastNonDrawCall = await functionCalls[7].getDetails();
+  const firstNonDrawCall = await functionCalls[1].getDetails();
+  const secondNonDrawCall = await functionCalls[3].getDetails();
+  const lastNonDrawCall = await functionCalls[7].getDetails();
 
   is(firstNonDrawCall.name, "fillStyle",
     "The first non-draw function's name is correct.");
   is(secondNonDrawCall.name, "fillStyle",
     "The second non-draw function's name is correct.");
   is(lastNonDrawCall.name, "setTimeout",
     "The last non-draw function's name is correct.");
 
-  let firstScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[1]);
-  let secondScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[3]);
-  let lastScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[7]);
+  const firstScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[1]);
+  const secondScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[3]);
+  const lastScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[7]);
 
   ok(firstScreenshot,
     "A screenshot was successfully retrieved for the first non-draw function.");
   ok(secondScreenshot,
     "A screenshot was successfully retrieved for the second non-draw function.");
   ok(lastScreenshot,
     "A screenshot was successfully retrieved for the last non-draw function.");
 
-  let firstActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[0]);
+  const firstActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[0]);
   ok(sameArray(firstScreenshot.pixels, firstActualScreenshot.pixels),
     "The screenshot for the first non-draw function is correct.");
   is(firstScreenshot.width, 128,
     "The screenshot for the first non-draw function has the correct width.");
   is(firstScreenshot.height, 128,
     "The screenshot for the first non-draw function has the correct height.");
 
-  let secondActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[2]);
+  const secondActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[2]);
   ok(sameArray(secondScreenshot.pixels, secondActualScreenshot.pixels),
     "The screenshot for the second non-draw function is correct.");
   is(secondScreenshot.width, 128,
     "The screenshot for the second non-draw function has the correct width.");
   is(secondScreenshot.height, 128,
     "The screenshot for the second non-draw function has the correct height.");
 
-  let lastActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[6]);
+  const lastActualScreenshot = await snapshotActor.generateScreenshotFor(functionCalls[6]);
   ok(sameArray(lastScreenshot.pixels, lastActualScreenshot.pixels),
     "The screenshot for the last non-draw function is correct.");
   is(lastScreenshot.width, 128,
     "The screenshot for the last non-draw function has the correct width.");
   is(lastScreenshot.height, 128,
     "The screenshot for the last non-draw function has the correct height.");
 
   ok(!sameArray(firstScreenshot.pixels, secondScreenshot.pixels),
--- a/devtools/client/canvasdebugger/test/browser_canvas-actor-test-12.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-actor-test-12.js
@@ -2,28 +2,28 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that the recording can be disabled via stopRecordingAnimationFrame
  * in the event no rAF loop is found.
  */
 
 async function ifTestingSupported() {
-  let { target, front } = await initCanvasDebuggerBackend(NO_CANVAS_URL);
+  const { target, front } = await initCanvasDebuggerBackend(NO_CANVAS_URL);
   loadFrameScriptUtils();
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
-  let startRecording = front.recordAnimationFrame();
+  const startRecording = front.recordAnimationFrame();
   await front.stopRecordingAnimationFrame();
 
   ok(!(await startRecording),
     "recordAnimationFrame() does not return a SnapshotActor when cancelled.");
 
   await removeTab(target.tab);
   finish();
 }
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-highlight.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-highlight.js
@@ -1,23 +1,23 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if certain function calls are properly highlighted in the UI.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
   SnapshotsListView._onRecordButtonClick();
   await Promise.all([recordingFinished, callListPopulated]);
 
   is(CallsListView.itemCount, 8,
     "All the function calls should now be displayed in the UI.");
 
   is($(".call-item-view", CallsListView.getItemAtIndex(0).target).hasAttribute("draw-call"), true,
     "The first item's node should have a draw-call attribute.");
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-list.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-list.js
@@ -2,23 +2,23 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if all the function calls associated with an animation frame snapshot
  * are properly displayed in the UI.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
   SnapshotsListView._onRecordButtonClick();
   await Promise.all([recordingFinished, callListPopulated]);
 
   is(CallsListView.itemCount, 8,
     "All the function calls should now be displayed in the UI.");
 
   testItem(CallsListView.getItemAtIndex(0),
     "1", "Object", "clearRect", "(0, 0, 128, 128)", "doc_simple-canvas.html:25");
@@ -37,17 +37,17 @@ async function ifTestingSupported() {
     "6", "Object", "fillStyle", " = rgba(192, 0, 0, 0.5)", "doc_simple-canvas.html:20");
   testItem(CallsListView.getItemAtIndex(6),
     "7", "Object", "fillRect", "(10, 10, 55, 50)", "doc_simple-canvas.html:21");
 
   testItem(CallsListView.getItemAtIndex(7),
     "8", "", "requestAnimationFrame", "(Function)", "doc_simple-canvas.html:30");
 
   function testItem(item, index, context, name, args, location) {
-    let i = CallsListView.indexOfItem(item);
+    const i = CallsListView.indexOfItem(item);
     is(i, index - 1,
       "The item at index " + index + " is correctly displayed in the UI.");
 
     is($(".call-item-index", item.target).getAttribute("value"), index,
       "The item's gutter label has the correct text.");
 
     if (context) {
       is($(".call-item-context", item.target).getAttribute("value"), context,
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-search.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-search.js
@@ -1,23 +1,23 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if filtering the items in the call list works properly.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
-  let searchbox = $("#calls-searchbox");
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
+  const searchbox = $("#calls-searchbox");
 
   await reload(target);
 
-  let firstRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const firstRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
   let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
   SnapshotsListView._onRecordButtonClick();
   await Promise.all([firstRecordingFinished, callListPopulated]);
 
   is(searchbox.value, "",
     "The searchbox should be initially empty.");
   is(CallsListView.visibleItems.length, 8,
     "All the items should be initially visible in the calls list.");
@@ -38,17 +38,17 @@ async function ifTestingSupported() {
     "The visible item's file has the expected value.");
   is(CallsListView.visibleItems[0].attachment.actor.line, 25,
     "The visible item's line has the expected value.");
   is(CallsListView.visibleItems[0].attachment.actor.argsPreview, "0, 0, 128, 128",
     "The visible item's args have the expected value.");
   is(CallsListView.visibleItems[0].attachment.actor.callerPreview, "Object",
     "The visible item's caller has the expected value.");
 
-  let secondRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const secondRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
   callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
 
   SnapshotsListView._onRecordButtonClick();
   await secondRecordingFinished;
 
   SnapshotsListView.selectedIndex = 1;
   await callListPopulated;
 
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-stack-01.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-stack-01.js
@@ -7,33 +7,33 @@
 
 // Force the old debugger UI since it's directly used (see Bug 1301705)
 Services.prefs.setBoolPref("devtools.debugger.new-debugger-frontend", false);
 registerCleanupFunction(function() {
   Services.prefs.clearUserPref("devtools.debugger.new-debugger-frontend");
 });
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_DEEP_STACK_URL);
-  let { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_DEEP_STACK_URL);
+  const { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
   SnapshotsListView._onRecordButtonClick();
   await Promise.all([recordingFinished, callListPopulated]);
 
-  let callItem = CallsListView.getItemAtIndex(2);
-  let locationLink = $(".call-item-location", callItem.target);
+  const callItem = CallsListView.getItemAtIndex(2);
+  const locationLink = $(".call-item-location", callItem.target);
 
   is($(".call-item-stack", callItem.target), null,
     "There should be no stack container available yet for the draw call.");
 
-  let callStackDisplayed = once(window, EVENTS.CALL_STACK_DISPLAYED);
+  const callStackDisplayed = once(window, EVENTS.CALL_STACK_DISPLAYED);
   EventUtils.sendMouseEvent({ type: "mousedown" }, locationLink, window);
   await callStackDisplayed;
 
   isnot($(".call-item-stack", callItem.target), null,
     "There should be a stack container available now for the draw call.");
   // We may have more than 4 functions, depending on whether async
   // stacks are available.
   ok($all(".call-item-stack-fn", callItem.target).length >= 4,
@@ -60,22 +60,22 @@ async function ifTestingSupported() {
     "The second function on the stack has the correct location.");
   is($all(".call-item-stack-fn-location", callItem.target)[2].getAttribute("value"),
     "doc_simple-canvas-deep-stack.html:30",
     "The third function on the stack has the correct location.");
   is($all(".call-item-stack-fn-location", callItem.target)[3].getAttribute("value"),
     "doc_simple-canvas-deep-stack.html:35",
     "The fourth function on the stack has the correct location.");
 
-  let jumpedToSource = once(window, EVENTS.SOURCE_SHOWN_IN_JS_DEBUGGER);
+  const jumpedToSource = once(window, EVENTS.SOURCE_SHOWN_IN_JS_DEBUGGER);
   EventUtils.sendMouseEvent({ type: "mousedown" }, $(".call-item-stack-fn-location", callItem.target));
   await jumpedToSource;
 
-  let toolbox = await gDevTools.getToolbox(target);
-  let { panelWin: { DebuggerView: view } } = toolbox.getPanel("jsdebugger");
+  const toolbox = await gDevTools.getToolbox(target);
+  const { panelWin: { DebuggerView: view } } = toolbox.getPanel("jsdebugger");
 
   is(view.Sources.selectedValue, getSourceActor(view.Sources, SIMPLE_CANVAS_DEEP_STACK_URL),
     "The expected source was shown in the debugger.");
   is(view.editor.getCursor().line, 25,
     "The expected source line is highlighted in the debugger.");
 
   await teardown(panel);
   finish();
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-stack-02.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-stack-02.js
@@ -8,49 +8,49 @@
 
 // Force the old debugger UI since it's directly used (see Bug 1301705)
 Services.prefs.setBoolPref("devtools.debugger.new-debugger-frontend", false);
 registerCleanupFunction(function() {
   Services.prefs.clearUserPref("devtools.debugger.new-debugger-frontend");
 });
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_DEEP_STACK_URL);
-  let { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_DEEP_STACK_URL);
+  const { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
   SnapshotsListView._onRecordButtonClick();
   await Promise.all([recordingFinished, callListPopulated]);
 
-  let callItem = CallsListView.getItemAtIndex(2);
-  let locationLink = $(".call-item-location", callItem.target);
+  const callItem = CallsListView.getItemAtIndex(2);
+  const locationLink = $(".call-item-location", callItem.target);
 
   is($(".call-item-stack", callItem.target), null,
     "There should be no stack container available yet for the draw call.");
 
-  let callStackDisplayed = once(window, EVENTS.CALL_STACK_DISPLAYED);
+  const callStackDisplayed = once(window, EVENTS.CALL_STACK_DISPLAYED);
   EventUtils.sendMouseEvent({ type: "mousedown" }, locationLink, window);
   await callStackDisplayed;
 
   isnot($(".call-item-stack", callItem.target), null,
     "There should be a stack container available now for the draw call.");
   // We may have more than 4 functions, depending on whether async
   // stacks are available.
   ok($all(".call-item-stack-fn", callItem.target).length >= 4,
      "There should be at least 4 functions on the stack for the draw call.");
 
-  let jumpedToSource = once(window, EVENTS.SOURCE_SHOWN_IN_JS_DEBUGGER);
+  const jumpedToSource = once(window, EVENTS.SOURCE_SHOWN_IN_JS_DEBUGGER);
   EventUtils.sendMouseEvent({ type: "mousedown" }, $(".call-item-location", callItem.target));
   await jumpedToSource;
 
-  let toolbox = await gDevTools.getToolbox(target);
-  let { panelWin: { DebuggerView: view } } = toolbox.getPanel("jsdebugger");
+  const toolbox = await gDevTools.getToolbox(target);
+  const { panelWin: { DebuggerView: view } } = toolbox.getPanel("jsdebugger");
 
   is(view.Sources.selectedValue, getSourceActor(view.Sources, SIMPLE_CANVAS_DEEP_STACK_URL),
     "The expected source was shown in the debugger.");
   is(view.editor.getCursor().line, 23,
     "The expected source line is highlighted in the debugger.");
 
   await teardown(panel);
   finish();
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-stack-03.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-call-stack-03.js
@@ -2,38 +2,38 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if the a function call's stack can be shown/hidden by double-clicking
  * on a function call item.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_DEEP_STACK_URL);
-  let { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_DEEP_STACK_URL);
+  const { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
   SnapshotsListView._onRecordButtonClick();
   await Promise.all([recordingFinished, callListPopulated]);
 
-  let callItem = CallsListView.getItemAtIndex(2);
-  let view = $(".call-item-view", callItem.target);
-  let contents = $(".call-item-contents", callItem.target);
+  const callItem = CallsListView.getItemAtIndex(2);
+  const view = $(".call-item-view", callItem.target);
+  const contents = $(".call-item-contents", callItem.target);
 
   is(view.hasAttribute("call-stack-populated"), false,
     "The call item's view should not have the stack populated yet.");
   is(view.hasAttribute("call-stack-expanded"), false,
     "The call item's view should not have the stack populated yet.");
   is($(".call-item-stack", callItem.target), null,
     "There should be no stack container available yet for the draw call.");
 
-  let callStackDisplayed = once(window, EVENTS.CALL_STACK_DISPLAYED);
+  const callStackDisplayed = once(window, EVENTS.CALL_STACK_DISPLAYED);
   EventUtils.sendMouseEvent({ type: "dblclick" }, contents, window);
   await callStackDisplayed;
 
   is(view.hasAttribute("call-stack-populated"), true,
     "The call item's view should have the stack populated now.");
   is(view.getAttribute("call-stack-expanded"), "true",
     "The call item's view should have the stack expanded now.");
   isnot($(".call-item-stack", callItem.target), null,
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-clear.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-clear.js
@@ -1,40 +1,40 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if clearing the snapshots list works as expected.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, EVENTS, SnapshotsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, EVENTS, SnapshotsListView } = panel.panelWin;
 
   await reload(target);
 
-  let firstRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const firstRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
   SnapshotsListView._onRecordButtonClick();
 
   await firstRecordingFinished;
   ok(true, "Finished recording a snapshot of the animation loop.");
 
   is(SnapshotsListView.itemCount, 1,
     "There should be one item available in the snapshots list.");
 
-  let secondRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const secondRecordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
   SnapshotsListView._onRecordButtonClick();
 
   await secondRecordingFinished;
   ok(true, "Finished recording another snapshot of the animation loop.");
 
   is(SnapshotsListView.itemCount, 2,
     "There should be two items available in the snapshots list.");
 
-  let clearingFinished = once(window, EVENTS.SNAPSHOTS_LIST_CLEARED);
+  const clearingFinished = once(window, EVENTS.SNAPSHOTS_LIST_CLEARED);
   SnapshotsListView._onClearButtonClick();
 
   await clearingFinished;
   ok(true, "Finished recording all snapshots.");
 
   is(SnapshotsListView.itemCount, 0,
     "There should be no items available in the snapshots list.");
 
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-img-screenshots.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-img-screenshots.js
@@ -1,24 +1,24 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if screenshots are properly displayed in the UI.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, $, EVENTS, SnapshotsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, $, EVENTS, SnapshotsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
-  let screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
+  const screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
   SnapshotsListView._onRecordButtonClick();
   await Promise.all([recordingFinished, callListPopulated, screenshotDisplayed]);
 
   is($("#screenshot-container").hidden, false,
     "The screenshot container should now be visible.");
 
   is($("#screenshot-dimensions").getAttribute("value"), "128" + "\u00D7" + "128",
     "The screenshot dimensions label has the expected value.");
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-img-thumbnails-01.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-img-thumbnails-01.js
@@ -1,61 +1,61 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if thumbnails are properly displayed in the UI.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, $, $all, EVENTS, SnapshotsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, $, $all, EVENTS, SnapshotsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
-  let thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
+  const thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
   SnapshotsListView._onRecordButtonClick();
   await Promise.all([recordingFinished, callListPopulated, thumbnailsDisplayed]);
 
   is($all(".filmstrip-thumbnail").length, 4,
     "There should be 4 thumbnails displayed in the UI.");
 
-  let firstThumbnail = $(".filmstrip-thumbnail[index='0']");
+  const firstThumbnail = $(".filmstrip-thumbnail[index='0']");
   ok(firstThumbnail,
     "The first thumbnail element should be for the function call at index 0.");
   is(firstThumbnail.width, 50,
     "The first thumbnail's width is correct.");
   is(firstThumbnail.height, 50,
     "The first thumbnail's height is correct.");
   is(firstThumbnail.getAttribute("flipped"), "false",
     "The first thumbnail should not be flipped vertically.");
 
-  let secondThumbnail = $(".filmstrip-thumbnail[index='2']");
+  const secondThumbnail = $(".filmstrip-thumbnail[index='2']");
   ok(secondThumbnail,
     "The second thumbnail element should be for the function call at index 2.");
   is(secondThumbnail.width, 50,
     "The second thumbnail's width is correct.");
   is(secondThumbnail.height, 50,
     "The second thumbnail's height is correct.");
   is(secondThumbnail.getAttribute("flipped"), "false",
     "The second thumbnail should not be flipped vertically.");
 
-  let thirdThumbnail = $(".filmstrip-thumbnail[index='4']");
+  const thirdThumbnail = $(".filmstrip-thumbnail[index='4']");
   ok(thirdThumbnail,
     "The third thumbnail element should be for the function call at index 4.");
   is(thirdThumbnail.width, 50,
     "The third thumbnail's width is correct.");
   is(thirdThumbnail.height, 50,
     "The third thumbnail's height is correct.");
   is(thirdThumbnail.getAttribute("flipped"), "false",
     "The third thumbnail should not be flipped vertically.");
 
-  let fourthThumbnail = $(".filmstrip-thumbnail[index='6']");
+  const fourthThumbnail = $(".filmstrip-thumbnail[index='6']");
   ok(fourthThumbnail,
     "The fourth thumbnail element should be for the function call at index 6.");
   is(fourthThumbnail.width, 50,
     "The fourth thumbnail's width is correct.");
   is(fourthThumbnail.height, 50,
     "The fourth thumbnail's height is correct.");
   is(fourthThumbnail.getAttribute("flipped"), "false",
     "The fourth thumbnail should not be flipped vertically.");
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-img-thumbnails-02.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-img-thumbnails-02.js
@@ -2,25 +2,25 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if thumbnails are correctly linked with other UI elements like
  * function call items and their respective screenshots.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
-  let thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
-  let screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
+  const thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
+  const screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
   SnapshotsListView._onRecordButtonClick();
   await Promise.all([
     recordingFinished,
     callListPopulated,
     thumbnailsDisplayed,
     screenshotDisplayed
   ]);
 
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-open.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-open.js
@@ -1,18 +1,18 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that the frontend UI is properly configured when opening the tool.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { $ } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { $ } = panel.panelWin;
 
   is($("#snapshots-pane").hasAttribute("hidden"), false,
     "The snapshots pane should initially be visible.");
   is($("#debugging-pane").hasAttribute("hidden"), false,
     "The debugging pane should initially be visible.");
 
   is($("#record-snapshot").getAttribute("hidden"), "true",
     "The 'record snapshot' button should initially be hidden.");
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-record-01.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-record-01.js
@@ -1,35 +1,35 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests whether the frontend behaves correctly while reording a snapshot.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
 
   await reload(target);
 
   is($("#record-snapshot").hasAttribute("checked"), false,
     "The 'record snapshot' button should initially be unchecked.");
   is($("#record-snapshot").hasAttribute("disabled"), false,
     "The 'record snapshot' button should initially be enabled.");
   is($("#record-snapshot").hasAttribute("hidden"), false,
     "The 'record snapshot' button should now be visible.");
 
   is(SnapshotsListView.itemCount, 0,
     "There should be no items available in the snapshots list view.");
   is(SnapshotsListView.selectedIndex, -1,
     "There should be no selected item in the snapshots list view.");
 
-  let recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
   SnapshotsListView._onRecordButtonClick();
 
   await recordingStarted;
   ok(true, "Started recording a snapshot of the animation loop.");
 
   is($("#record-snapshot").getAttribute("checked"), "true",
     "The 'record snapshot' button should now be checked.");
   is($("#record-snapshot").hasAttribute("hidden"), false,
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-record-02.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-record-02.js
@@ -1,30 +1,30 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests whether the frontend displays a placeholder snapshot while recording.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, EVENTS, L10N, $, SnapshotsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, EVENTS, L10N, $, SnapshotsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let recordingSelected = once(window, EVENTS.SNAPSHOT_RECORDING_SELECTED);
+  const recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const recordingSelected = once(window, EVENTS.SNAPSHOT_RECORDING_SELECTED);
   SnapshotsListView._onRecordButtonClick();
 
   await recordingStarted;
   ok(true, "Started recording a snapshot of the animation loop.");
 
-  let item = SnapshotsListView.getItemAtIndex(0);
+  const item = SnapshotsListView.getItemAtIndex(0);
 
   is($(".snapshot-item-title", item.target).getAttribute("value"),
     L10N.getFormatStr("snapshotsList.itemLabel", 1),
     "The placeholder item's title label is correct.");
 
   is($(".snapshot-item-calls", item.target).getAttribute("value"),
     L10N.getStr("snapshotsList.loadingLabel"),
     "The placeholder item's calls label is correct.");
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-record-03.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-record-03.js
@@ -2,28 +2,28 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests whether the frontend displays the correct info for a snapshot
  * after finishing recording.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
   SnapshotsListView._onRecordButtonClick();
 
   await recordingFinished;
   ok(true, "Finished recording a snapshot of the animation loop.");
 
-  let item = SnapshotsListView.getItemAtIndex(0);
+  const item = SnapshotsListView.getItemAtIndex(0);
 
   is(SnapshotsListView.selectedItem, item,
     "The first item should now be selected in the snapshots list view (1).");
   is(SnapshotsListView.selectedIndex, 0,
     "The first item should now be selected in the snapshots list view (2).");
 
   is($(".snapshot-item-calls", item.target).getAttribute("value"), "4 draws, 8 calls",
     "The placeholder item's calls label is correct.");
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-record-04.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-record-04.js
@@ -4,23 +4,23 @@
 /**
  * Bug 1122766
  * Tests that the canvas actor correctly returns from recordAnimationFrame
  * in the scenario where a loop starts with rAF and has rAF in the beginning
  * of its loop, when the recording starts before the rAFs start.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(RAF_BEGIN_URL);
-  let { window, EVENTS, gFront, SnapshotsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(RAF_BEGIN_URL);
+  const { window, EVENTS, gFront, SnapshotsListView } = panel.panelWin;
   loadFrameScriptUtils();
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
   SnapshotsListView._onRecordButtonClick();
 
   // Wait until after the recording started to trigger the content.
   // Use the gFront method rather than the SNAPSHOT_RECORDING_STARTED event
   // which triggers before the underlying actor call
   await waitUntil(async function() {
     return !(await gFront.isRecording());
   });
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-reload-01.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-reload-01.js
@@ -1,21 +1,21 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that the frontend UI is properly reconfigured after reloading.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, $, EVENTS } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, $, EVENTS } = panel.panelWin;
 
-  let reset = once(window, EVENTS.UI_RESET);
-  let navigated = reload(target);
+  const reset = once(window, EVENTS.UI_RESET);
+  const navigated = reload(target);
 
   await reset;
   ok(true, "The UI was reset after the refresh button was clicked.");
 
   await navigated;
   ok(true, "The target finished reloading.");
 
   is($("#snapshots-pane").hasAttribute("hidden"), false,
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-reload-02.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-reload-02.js
@@ -1,37 +1,37 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that the frontend UI is properly reconfigured after reloading.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, $, $all, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
 
   is(SnapshotsListView.itemCount, 0,
     "There should be no snapshots initially displayed in the UI.");
   is(CallsListView.itemCount, 0,
     "There should be no function calls initially displayed in the UI.");
 
   is($("#screenshot-container").hidden, true,
     "The screenshot should not be initially displayed in the UI.");
   is($("#snapshot-filmstrip").hidden, true,
     "There should be no thumbnails initially displayed in the UI (1).");
   is($all(".filmstrip-thumbnail").length, 0,
     "There should be no thumbnails initially displayed in the UI (2).");
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
-  let thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
-  let screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
+  const thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
+  const screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
   SnapshotsListView._onRecordButtonClick();
   await Promise.all([
     recordingFinished,
     callListPopulated,
     thumbnailsDisplayed,
     screenshotDisplayed
   ]);
 
@@ -42,18 +42,18 @@ async function ifTestingSupported() {
 
   is($("#screenshot-container").hidden, false,
     "The screenshot should now be displayed in the UI.");
   is($("#snapshot-filmstrip").hidden, false,
     "All the thumbnails should now be displayed in the UI (1).");
   is($all(".filmstrip-thumbnail").length, 4,
     "All the thumbnails should now be displayed in the UI (2).");
 
-  let reset = once(window, EVENTS.UI_RESET);
-  let navigated = reload(target);
+  const reset = once(window, EVENTS.UI_RESET);
+  const navigated = reload(target);
 
   await reset;
   ok(true, "The UI was reset after the refresh button was clicked.");
 
   is(SnapshotsListView.itemCount, 0,
     "There should be no snapshots displayed in the UI after navigating.");
   is(CallsListView.itemCount, 0,
     "There should be no function calls displayed in the UI after navigating.");
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-snapshot-select-01.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-snapshot-select-01.js
@@ -2,18 +2,18 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if selecting snapshots in the frontend displays the appropriate data
  * respective to their recorded animation frame.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
 
   await reload(target);
 
   await recordAndWaitForFirstSnapshot();
   info("First snapshot recorded.");
 
   is(SnapshotsListView.selectedIndex, 0,
     "A snapshot should be automatically selected after first recording.");
@@ -23,69 +23,69 @@ async function ifTestingSupported() {
   await recordAndWaitForAnotherSnapshot();
   info("Second snapshot recorded.");
 
   is(SnapshotsListView.selectedIndex, 0,
     "A snapshot should not be automatically selected after another recording.");
   is(CallsListView.selectedIndex, -1,
     "There should still be no call item automatically selected in the snapshot.");
 
-  let secondSnapshotTarget = SnapshotsListView.getItemAtIndex(1).target;
+  const secondSnapshotTarget = SnapshotsListView.getItemAtIndex(1).target;
   let snapshotSelected = waitForSnapshotSelection();
   EventUtils.sendMouseEvent({ type: "mousedown" }, secondSnapshotTarget, window);
 
   await snapshotSelected;
   info("Second snapshot selected.");
 
   is(SnapshotsListView.selectedIndex, 1,
     "The second snapshot should now be selected.");
   is(CallsListView.selectedIndex, -1,
     "There should still be no call item automatically selected in the snapshot.");
 
-  let firstDrawCallContents = $(".call-item-contents", CallsListView.getItemAtIndex(2).target);
-  let screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
+  const firstDrawCallContents = $(".call-item-contents", CallsListView.getItemAtIndex(2).target);
+  const screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
   EventUtils.sendMouseEvent({ type: "mousedown" }, firstDrawCallContents, window);
 
   await screenshotDisplayed;
   info("First draw call in the second snapshot selected.");
 
   is(SnapshotsListView.selectedIndex, 1,
     "The second snapshot should still be selected.");
   is(CallsListView.selectedIndex, 2,
     "The first draw call should now be selected in the snapshot.");
 
-  let firstSnapshotTarget = SnapshotsListView.getItemAtIndex(0).target;
+  const firstSnapshotTarget = SnapshotsListView.getItemAtIndex(0).target;
   snapshotSelected = waitForSnapshotSelection();
   EventUtils.sendMouseEvent({ type: "mousedown" }, firstSnapshotTarget, window);
 
   await snapshotSelected;
   info("First snapshot re-selected.");
 
   is(SnapshotsListView.selectedIndex, 0,
     "The first snapshot should now be re-selected.");
   is(CallsListView.selectedIndex, -1,
     "There should still be no call item automatically selected in the snapshot.");
 
   function recordAndWaitForFirstSnapshot() {
-    let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-    let snapshotSelected = waitForSnapshotSelection();
+    const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+    const snapshotSelected = waitForSnapshotSelection();
     SnapshotsListView._onRecordButtonClick();
     return Promise.all([recordingFinished, snapshotSelected]);
   }
 
   function recordAndWaitForAnotherSnapshot() {
-    let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+    const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
     SnapshotsListView._onRecordButtonClick();
     return recordingFinished;
   }
 
   function waitForSnapshotSelection() {
-    let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
-    let thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
-    let screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
+    const callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
+    const thumbnailsDisplayed = once(window, EVENTS.THUMBNAILS_DISPLAYED);
+    const screenshotDisplayed = once(window, EVENTS.CALL_SCREENSHOT_DISPLAYED);
     return Promise.all([
       callListPopulated,
       thumbnailsDisplayed,
       screenshotDisplayed
     ]);
   }
 
   await teardown(panel);
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-snapshot-select-02.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-snapshot-select-02.js
@@ -2,29 +2,29 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if selecting snapshots in the frontend displays the appropriate data
  * respective to their recorded animation frame.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
 
   await reload(target);
 
   SnapshotsListView._onRecordButtonClick();
-  let snapshotTarget = SnapshotsListView.getItemAtIndex(0).target;
+  const snapshotTarget = SnapshotsListView.getItemAtIndex(0).target;
 
   EventUtils.sendMouseEvent({ type: "mousedown" }, snapshotTarget, window);
   EventUtils.sendMouseEvent({ type: "mousedown" }, snapshotTarget, window);
   EventUtils.sendMouseEvent({ type: "mousedown" }, snapshotTarget, window);
 
   ok(true, "clicking in-progress snapshot does not fail");
 
-  let finished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const finished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
   SnapshotsListView._onRecordButtonClick();
   await finished;
 
   await teardown(panel);
   finish();
 }
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-stepping.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-stepping.js
@@ -1,23 +1,23 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if the stepping buttons in the call list toolbar work as advertised.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
-  let { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(SIMPLE_CANVAS_URL);
+  const { window, $, EVENTS, SnapshotsListView, CallsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const callListPopulated = once(window, EVENTS.CALL_LIST_POPULATED);
   SnapshotsListView._onRecordButtonClick();
   await Promise.all([recordingFinished, callListPopulated]);
 
   checkSteppingButtons(1, 1, 1, 1);
   is(CallsListView.selectedIndex, -1,
     "There should be no selected item in the calls list view initially.");
 
   CallsListView._onResume();
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-stop-01.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-stop-01.js
@@ -1,31 +1,31 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that you can stop a recording that does not have a rAF cycle.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(NO_CANVAS_URL);
-  let { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(NO_CANVAS_URL);
+  const { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
+  const recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
   SnapshotsListView._onRecordButtonClick();
 
   await recordingStarted;
 
   is($("#empty-notice").hidden, true, "Empty notice not shown");
   is($("#waiting-notice").hidden, false, "Waiting notice shown");
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let recordingCancelled = once(window, EVENTS.SNAPSHOT_RECORDING_CANCELLED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const recordingCancelled = once(window, EVENTS.SNAPSHOT_RECORDING_CANCELLED);
   SnapshotsListView._onRecordButtonClick();
 
   await Promise.all([recordingFinished, recordingCancelled]);
 
   ok(true, "Recording stopped and was considered failed.");
 
   is(SnapshotsListView.itemCount, 0, "No snapshots in the list.");
   is($("#empty-notice").hidden, false, "Empty notice shown");
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-stop-02.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-stop-02.js
@@ -1,31 +1,31 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that a recording that does not have a rAF cycle fails after timeout.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(NO_CANVAS_URL);
-  let { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(NO_CANVAS_URL);
+  const { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
+  const recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
   SnapshotsListView._onRecordButtonClick();
 
   await recordingStarted;
 
   is($("#empty-notice").hidden, true, "Empty notice not shown");
   is($("#waiting-notice").hidden, false, "Waiting notice shown");
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let recordingCancelled = once(window, EVENTS.SNAPSHOT_RECORDING_CANCELLED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const recordingCancelled = once(window, EVENTS.SNAPSHOT_RECORDING_CANCELLED);
 
   await Promise.all([recordingFinished, recordingCancelled]);
 
   ok(true, "Recording stopped and was considered failed.");
 
   is(SnapshotsListView.itemCount, 0, "No snapshots in the list.");
   is($("#empty-notice").hidden, false, "Empty notice shown");
   is($("#waiting-notice").hidden, true, "Waiting notice not shown");
--- a/devtools/client/canvasdebugger/test/browser_canvas-frontend-stop-03.js
+++ b/devtools/client/canvasdebugger/test/browser_canvas-frontend-stop-03.js
@@ -2,31 +2,31 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that a recording that has a rAF cycle, but no draw calls, fails
  * after timeout.
  */
 
 async function ifTestingSupported() {
-  let { target, panel } = await initCanvasDebuggerFrontend(RAF_NO_CANVAS_URL);
-  let { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
+  const { target, panel } = await initCanvasDebuggerFrontend(RAF_NO_CANVAS_URL);
+  const { window, EVENTS, $, SnapshotsListView } = panel.panelWin;
 
   await reload(target);
 
-  let recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
+  const recordingStarted = once(window, EVENTS.SNAPSHOT_RECORDING_STARTED);
   SnapshotsListView._onRecordButtonClick();
 
   await recordingStarted;
 
   is($("#empty-notice").hidden, true, "Empty notice not shown");
   is($("#waiting-notice").hidden, false, "Waiting notice shown");
 
-  let recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
-  let recordingCancelled = once(window, EVENTS.SNAPSHOT_RECORDING_CANCELLED);
+  const recordingFinished = once(window, EVENTS.SNAPSHOT_RECORDING_FINISHED);
+  const recordingCancelled = once(window, EVENTS.SNAPSHOT_RECORDING_CANCELLED);
 
   await Promise.all([recordingFinished, recordingCancelled]);
 
   ok(true, "Recording stopped and was considered failed.");
 
   is(SnapshotsListView.itemCount, 0, "No snapshots in the list.");
   is($("#empty-notice").hidden, false, "Empty notice shown");
   is($("#waiting-notice").hidden, true, "Waiting notice not shown");
--- a/devtools/client/canvasdebugger/test/browser_profiling-canvas.js
+++ b/devtools/client/canvasdebugger/test/browser_profiling-canvas.js
@@ -2,36 +2,36 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if functions inside a single animation frame are recorded and stored
  * for a canvas context profiling.
  */
 
 async function ifTestingSupported() {
-  let currentTime = window.performance.now();
-  let { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_URL);
+  const currentTime = window.performance.now();
+  const { target, front } = await initCanvasDebuggerBackend(SIMPLE_CANVAS_URL);
 
-  let navigated = once(target, "navigate");
+  const navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
   await navigated;
   ok(true, "Target automatically navigated when the front was set up.");
 
-  let snapshotActor = await front.recordAnimationFrame();
+  const snapshotActor = await front.recordAnimationFrame();
   ok(snapshotActor,
     "A snapshot actor was sent after recording.");
 
-  let animationOverview = await snapshotActor.getOverview();
+  const animationOverview = await snapshotActor.getOverview();
   ok(animationOverview,
     "An animation overview could be retrieved after recording.");
 
-  let functionCalls = animationOverview.calls;
+  const functionCalls = animationOverview.calls;
   ok(functionCalls,
     "An array of function call actors was sent after recording.");
   is(functionCalls.length, 8,
     "The number of function call actors is correct.");
 
   info("Check the timestamps of function calls");
 
   for (let i = 0; i < functionCalls.length - 1; i += 2) {
--- a/devtools/client/canvasdebugger/test/browser_profiling-webgl.js
+++ b/devtools/client/canvasdebugger/test/browser_profiling-webgl.js
@@ -2,17 +2,17 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests if functions inside a single animation frame are recorded and stored
  * for a canvas context profiling.
  */
 
 async function ifTestingSupported() {
-  let currentTime = window.performance.now();
+  const currentTime = window.performance.now();
   info("Start to estimate WebGL drawArrays function.");
   var { target, front } = await initCanvasDebuggerBackend(WEBGL_DRAW_ARRAYS);
 
   let navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
@@ -37,17 +37,17 @@ async function ifTestingSupported() {
   is(animationOverview.primitive.tris, 5, "The count of triangles is correct.");
   is(animationOverview.primitive.vertices, 26, "The count of vertices is correct.");
   is(animationOverview.primitive.points, 4, "The count of points is correct.");
   is(animationOverview.primitive.lines, 8, "The count of lines is correct.");
 
   await removeTab(target.tab);
 
   info("Start to estimate WebGL drawElements function.");
-  let result = await initCanvasDebuggerBackend(WEBGL_DRAW_ELEMENTS);
+  const result = await initCanvasDebuggerBackend(WEBGL_DRAW_ELEMENTS);
   target = result.target;
   front = result.front;
 
   navigated = once(target, "navigate");
 
   await front.setup({ reload: true });
   ok(true, "The front was setup up successfully.");
 
--- a/devtools/client/canvasdebugger/test/head.js
+++ b/devtools/client/canvasdebugger/test/head.js
@@ -64,17 +64,17 @@ function ifTestingSupported() {
 }
 
 function ifTestingUnsupported() {
   todo(false, "Skipping test because some required functionality isn't supported.");
   finish();
 }
 
 async function test() {
-  let generator = isTestingSupported() ? ifTestingSupported : ifTestingUnsupported;
+  const generator = isTestingSupported() ? ifTestingSupported : ifTestingUnsupported;
   try {
     await generator();
   } catch (e) {
     handleError(e);
   }
 }
 
 function createCanvas() {
@@ -82,17 +82,17 @@ function createCanvas() {
 }
 
 function isTestingSupported() {
   if (!gRequiresWebGL) {
     info("This test does not require WebGL support.");
     return true;
   }
 
-  let supported = isWebGLSupported(document);
+  const supported = isWebGLSupported(document);
 
   info("This test requires WebGL support.");
   info("Apparently, WebGL is" + (supported ? "" : " not") + " supported.");
   return supported;
 }
 
 function navigateInHistory(aTarget, aDirection, aWaitForTargetEvent = "navigate") {
   executeSoon(() => content.history[aDirection]());
@@ -114,62 +114,62 @@ function initServer() {
   DebuggerServer.registerAllActors();
 }
 
 function initCallWatcherBackend(aUrl) {
   info("Initializing a call watcher front.");
   initServer();
 
   return (async function() {
-    let tab = await addTab(aUrl);
-    let target = TargetFactory.forTab(tab);
+    const tab = await addTab(aUrl);
+    const target = TargetFactory.forTab(tab);
 
     await target.makeRemote();
 
-    let front = new CallWatcherFront(target.client, target.form);
+    const front = new CallWatcherFront(target.client, target.form);
     return { target, front };
   })();
 }
 
 function initCanvasDebuggerBackend(aUrl) {
   info("Initializing a canvas debugger front.");
   initServer();
 
   return (async function() {
-    let tab = await addTab(aUrl);
-    let target = TargetFactory.forTab(tab);
+    const tab = await addTab(aUrl);
+    const target = TargetFactory.forTab(tab);
 
     await target.makeRemote();
 
-    let front = new CanvasFront(target.client, target.form);
+    const front = new CanvasFront(target.client, target.form);
     return { target, front };
   })();
 }
 
 function initCanvasDebuggerFrontend(aUrl) {
   info("Initializing a canvas debugger pane.");
 
   return (async function() {
-    let tab = await addTab(aUrl);
-    let target = TargetFactory.forTab(tab);
+    const tab = await addTab(aUrl);
+    const target = TargetFactory.forTab(tab);
 
     await target.makeRemote();
 
     Services.prefs.setBoolPref("devtools.canvasdebugger.enabled", true);
-    let toolbox = await gDevTools.showToolbox(target, "canvasdebugger");
-    let panel = toolbox.getCurrentPanel();
+    const toolbox = await gDevTools.showToolbox(target, "canvasdebugger");
+    const panel = toolbox.getCurrentPanel();
     return { target, panel };
   })();
 }
 
 function teardown({target}) {
   info("Destroying the specified canvas debugger.");
 
-  let {tab} = target;
+  const {tab} = target;
   return gDevTools.closeToolbox(target).then(() => {
     removeTab(tab);
   });
 }
 
 function getSourceActor(aSources, aURL) {
-  let item = aSources.getItemForAttachment(a => a.source.url === aURL);
+  const item = aSources.getItemForAttachment(a => a.source.url === aURL);
   return item ? item.value : null;
 }
--- a/devtools/client/definitions.js
+++ b/devtools/client/definitions.js
@@ -69,18 +69,18 @@ Tools.inspector = {
   accesskey: l10n("inspector.accesskey"),
   ordinal: 1,
   icon: "chrome://devtools/skin/images/tool-inspector.svg",
   url: "chrome://devtools/content/inspector/inspector.xhtml",
   label: l10n("inspector.label"),
   panelLabel: l10n("inspector.panelLabel"),
   get tooltip() {
     if (osString == "Darwin") {
-      let cmdShiftC = "Cmd+Shift+" + l10n("inspector.commandkey");
-      let cmdOptC = "Cmd+Opt+" + l10n("inspector.commandkey");
+      const cmdShiftC = "Cmd+Shift+" + l10n("inspector.commandkey");
+      const cmdOptC = "Cmd+Opt+" + l10n("inspector.commandkey");
       return l10n("inspector.mac.tooltip", cmdShiftC, cmdOptC);
     }
 
     return l10n("inspector.tooltip2", "Ctrl+Shift+") + l10n("inspector.commandkey");
   },
   inMenu: true,
   commands: [
     "devtools/client/responsive.html/commands",
@@ -546,18 +546,18 @@ exports.ToolboxButtons = [
       ScratchpadManager.openScratchpad();
     }
   },
   { id: "command-button-responsive",
     description: l10n("toolbox.buttons.responsive",
                       osString == "Darwin" ? "Cmd+Opt+M" : "Ctrl+Shift+M"),
     isTargetSupported: target => target.isLocalTab,
     onClick(event, toolbox) {
-      let tab = toolbox.target.tab;
-      let browserWindow = tab.ownerDocument.defaultView;
+      const tab = toolbox.target.tab;
+      const browserWindow = tab.ownerDocument.defaultView;
       ResponsiveUIManager.handleGcliCommand(browserWindow, tab,
         "resize toggle", null);
     },
     isChecked(toolbox) {
       if (!toolbox.target.tab) {
         return false;
       }
       return ResponsiveUIManager.isActiveForTab(toolbox.target.tab);
--- a/devtools/client/dom/content/components/DomTree.js
+++ b/devtools/client/dom/content/components/DomTree.js
@@ -52,31 +52,31 @@ class DomTree extends Component {
 
     return (object.name && object.name.indexOf(this.props.filter) > -1);
   }
 
   /**
    * Render DOM panel content
    */
   render() {
-    let {
+    const {
       dispatch,
       grips,
       object,
       openLink,
     } = this.props;
 
-    let columns = [{
+    const columns = [{
       "id": "value"
     }];
 
     // This is the integration point with Reps. The DomTree is using
     // Reps to render all values. The code also specifies default rep
     // used for data types that don't have its own specific template.
-    let renderValue = props => {
+    const renderValue = props => {
       return Rep(Object.assign({}, props, {
         defaultRep: Grip,
         cropLimit: 50,
       }));
     };
 
     return (
       TreeView({
--- a/devtools/client/dom/content/components/MainFrame.js
+++ b/devtools/client/dom/content/components/MainFrame.js
@@ -32,17 +32,17 @@ class MainFrame extends Component {
       object: PropTypes.any,
     };
   }
 
   /**
    * Render DOM panel content
    */
   render() {
-    let {
+    const {
       filter,
       object,
     } = this.props;
 
     return (
       div({className: "mainFrame"},
         MainToolbar({
           dispatch: this.props.dispatch,
--- a/devtools/client/dom/content/dom-decorator.js
+++ b/devtools/client/dom/content/dom-decorator.js
@@ -14,18 +14,18 @@ function DomDecorator() {
 
 /**
  * Decorator for DOM panel tree component. It's responsible for
  * appending an icon to read only properties.
  */
 DomDecorator.prototype = {
   getRowClass: function(object) {
     if (object instanceof Property) {
-      let value = object.value;
-      let names = [];
+      const value = object.value;
+      const names = [];
 
       if (value.enumerable) {
         names.push("enumerable");
       }
       if (value.writable) {
         names.push("writable");
       }
       if (value.configurable) {
--- a/devtools/client/dom/content/dom-view.js
+++ b/devtools/client/dom/content/dom-view.js
@@ -32,32 +32,32 @@ function DomView(localStore) {
     this.onMessage.bind(this), true);
 
   // Make it local so, tests can access it.
   this.store = localStore;
 }
 
 DomView.prototype = {
   initialize: function(rootGrip) {
-    let content = document.querySelector("#content");
-    let mainFrame = MainFrame({
+    const content = document.querySelector("#content");
+    const mainFrame = MainFrame({
       object: rootGrip,
     });
 
     // Render top level component
-    let provider = React.createElement(Provider, {
+    const provider = React.createElement(Provider, {
       store: this.store
     }, mainFrame);
 
     this.mainFrame = ReactDOM.render(provider, content);
   },
 
   onMessage: function(event) {
-    let data = event.data;
-    let method = data.type;
+    const data = event.data;
+    const method = data.type;
 
     if (typeof this[method] == "function") {
       this[method](data.args);
     }
   },
 };
 
 // Construct DOM panel view object and expose it to tests.
--- a/devtools/client/dom/content/grip-provider.js
+++ b/devtools/client/dom/content/grip-provider.js
@@ -28,56 +28,56 @@ GripProvider.prototype = {
     if (object instanceof Property) {
       grip = this.getValue(object);
     }
 
     if (!grip || !grip.actor) {
       return [];
     }
 
-    let props = this.grips.get(grip.actor);
+    const props = this.grips.get(grip.actor);
     if (!props) {
       // Fetch missing data from the backend. Returning a promise
       // from data provider causes the tree to show a spinner.
       return this.dispatch(fetchProperties(grip));
     }
 
     return props;
   },
 
   hasChildren: function(object) {
     if (object instanceof Property) {
-      let value = this.getValue(object);
+      const value = this.getValue(object);
       if (!value) {
         return false;
       }
 
       let hasChildren = value.ownPropertyLength > 0;
 
       if (value.preview) {
         hasChildren = hasChildren || value.preview.ownPropertiesLength > 0;
       }
 
       if (value.preview) {
-        let preview = value.preview;
-        let k = preview.kind;
-        let objectsWithProps = ["DOMNode", "ObjectWithURL"];
+        const preview = value.preview;
+        const k = preview.kind;
+        const objectsWithProps = ["DOMNode", "ObjectWithURL"];
         hasChildren = hasChildren || (objectsWithProps.includes(k));
         hasChildren = hasChildren || (k == "ArrayLike" && preview.length > 0);
       }
 
       return (value.type == "object" && hasChildren);
     }
 
     return null;
   },
 
   getValue: function(object) {
     if (object instanceof Property) {
-      let value = object.value;
+      const value = object.value;
       return (typeof value.value != "undefined") ? value.value :
         value.getterValue;
     }
 
     return object;
   },
 
   getLabel: function(object) {
--- a/devtools/client/dom/content/reducers/grips.js
+++ b/devtools/client/dom/content/reducers/grips.js
@@ -41,58 +41,58 @@ function grips(state = getInitialState()
 function onRequestProperties(state, action) {
   return state;
 }
 
 /**
  * Handle receiveProperties action
  */
 function onReceiveProperties(cache, action) {
-  let response = action.response;
-  let from = response.from;
-  let className = action.grip.class;
+  const response = action.response;
+  const from = response.from;
+  const className = action.grip.class;
 
   // Properly deal with getters.
   mergeProperties(response);
 
   // Compute list of requested children.
-  let previewProps = response.preview ? response.preview.ownProperties : null;
-  let ownProps = response.ownProperties || previewProps || [];
+  const previewProps = response.preview ? response.preview.ownProperties : null;
+  const ownProps = response.ownProperties || previewProps || [];
 
-  let props = Object.keys(ownProps).map(key => {
+  const props = Object.keys(ownProps).map(key => {
     // Array indexes as a special case. We convert any keys that are string
     // representations of integers to integers.
     if (className === "Array" && isInteger(key)) {
       key = parseInt(key, 10);
     }
     return new Property(key, ownProps[key], key);
   });
 
   props.sort(sortName);
 
   // Return new state/map.
-  let newCache = new Map(cache);
+  const newCache = new Map(cache);
   newCache.set(from, props);
 
   return newCache;
 }
 
 // Helpers
 
 function mergeProperties(response) {
-  let { ownProperties } = response;
+  const { ownProperties } = response;
 
   // 'safeGetterValues' is new and isn't necessary defined on old grips.
-  let safeGetterValues = response.safeGetterValues || {};
+  const safeGetterValues = response.safeGetterValues || {};
 
   // Merge the safe getter values into one object such that we can use it
   // in variablesView.
-  for (let name of Object.keys(safeGetterValues)) {
+  for (const name of Object.keys(safeGetterValues)) {
     if (name in ownProperties) {
-      let { getterValue, getterPrototypeLevel } = safeGetterValues[name];
+      const { getterValue, getterPrototypeLevel } = safeGetterValues[name];
       ownProperties[name].getterValue = getterValue;
       ownProperties[name].getterPrototypeLevel = getterPrototypeLevel;
     } else {
       ownProperties[name] = safeGetterValues[name];
     }
   }
 }
 
--- a/devtools/client/dom/content/utils.js
+++ b/devtools/client/dom/content/utils.js
@@ -6,17 +6,17 @@
 "use strict";
 
 /**
  * The default localization just returns the last part of the key
  * (all after the last dot).
  */
 const DefaultL10N = {
   getStr: function(key) {
-    let index = key.lastIndexOf(".");
+    const index = key.lastIndexOf(".");
     return key.substr(index + 1);
   }
 };
 
 /**
  * The 'l10n' object is set by main.js in case the DOM panel content
  * runs within a scope with chrome privileges.
  *
--- a/devtools/client/dom/dom-panel.js
+++ b/devtools/client/dom/dom-panel.js
@@ -35,17 +35,17 @@ DomPanel.prototype = {
    * @return object
    *         A promise that is resolved when the DOM panel completes opening.
    */
   async open() {
     if (this._opening) {
       return this._opening;
     }
 
-    let deferred = defer();
+    const deferred = defer();
     this._opening = deferred.promise;
 
     // Local monitoring needs to make the target remote.
     if (!this.target.isRemote) {
       await this.target.makeRemote();
     }
 
     this.initialize();
@@ -62,32 +62,32 @@ DomPanel.prototype = {
   initialize: function() {
     this.panelWin.addEventListener("devtools/content/message",
       this.onContentMessage, true);
 
     this.target.on("navigate", this.onTabNavigated);
     this._toolbox.on("select", this.onPanelVisibilityChange);
 
     // Export provider object with useful API for DOM panel.
-    let provider = {
+    const provider = {
       getPrototypeAndProperties: this.getPrototypeAndProperties.bind(this),
       openLink: this.openLink.bind(this),
     };
 
     exportIntoContentScope(this.panelWin, provider, "DomProvider");
 
     this.shouldRefresh = true;
   },
 
   async destroy() {
     if (this._destroying) {
       return this._destroying;
     }
 
-    let deferred = defer();
+    const deferred = defer();
     this._destroying = deferred.promise;
 
     this.target.off("navigate", this.onTabNavigated);
     this._toolbox.off("select", this.onPanelVisibilityChange);
 
     this.emit("destroyed");
 
     deferred.resolve();
@@ -137,110 +137,110 @@ DomPanel.prototype = {
   /**
    * Return true if the DOM panel is currently selected.
    */
   isPanelVisible: function() {
     return this._toolbox.currentToolId === "dom";
   },
 
   getPrototypeAndProperties: function(grip) {
-    let deferred = defer();
+    const deferred = defer();
 
     if (!grip.actor) {
       console.error("No actor!", grip);
       deferred.reject(new Error("Failed to get actor from grip."));
       return deferred.promise;
     }
 
     // Bail out if target doesn't exist (toolbox maybe closed already).
     if (!this.target) {
       return deferred.promise;
     }
 
     // If a request for the grips is already in progress
     // use the same promise.
-    let request = this.pendingRequests.get(grip.actor);
+    const request = this.pendingRequests.get(grip.actor);
     if (request) {
       return request;
     }
 
-    let client = new ObjectClient(this.target.client, grip);
+    const client = new ObjectClient(this.target.client, grip);
     client.getPrototypeAndProperties(response => {
       this.pendingRequests.delete(grip.actor, deferred.promise);
       deferred.resolve(response);
 
       // Fire an event about not having any pending requests.
       if (!this.pendingRequests.size) {
         this.emit("no-pending-requests");
       }
     });
 
     this.pendingRequests.set(grip.actor, deferred.promise);
 
     return deferred.promise;
   },
 
   openLink: function(url) {
-    let parentDoc = this._toolbox.doc;
-    let iframe = parentDoc.getElementById("this._toolbox");
-    let top = iframe.ownerDocument.defaultView.top;
+    const parentDoc = this._toolbox.doc;
+    const iframe = parentDoc.getElementById("this._toolbox");
+    const top = iframe.ownerDocument.defaultView.top;
     top.openWebLinkIn(url, "tab");
   },
 
   getRootGrip: function() {
-    let deferred = defer();
+    const deferred = defer();
 
     // Attach Console. It might involve RDP communication, so wait
     // asynchronously for the result
     this.target.activeConsole.evaluateJSAsync("window", res => {
       deferred.resolve(res.result);
     });
 
     return deferred.promise;
   },
 
   postContentMessage: function(type, args) {
-    let data = {
+    const data = {
       type: type,
       args: args,
     };
 
-    let event = new this.panelWin.MessageEvent("devtools/chrome/message", {
+    const event = new this.panelWin.MessageEvent("devtools/chrome/message", {
       bubbles: true,
       cancelable: true,
       data: data,
     });
 
     this.panelWin.dispatchEvent(event);
   },
 
   onContentMessage: function(event) {
-    let data = event.data;
-    let method = data.type;
+    const data = event.data;
+    const method = data.type;
     if (typeof this[method] == "function") {
       this[method](data.args);
     }
   },
 
   get target() {
     return this._toolbox.target;
   },
 };
 
 // Helpers
 
 function exportIntoContentScope(win, obj, defineAs) {
-  let clone = Cu.createObjectIn(win, {
+  const clone = Cu.createObjectIn(win, {
     defineAs: defineAs
   });
 
-  let props = Object.getOwnPropertyNames(obj);
+  const props = Object.getOwnPropertyNames(obj);
   for (let i = 0; i < props.length; i++) {
-    let propName = props[i];
-    let propValue = obj[propName];
+    const propName = props[i];
+    const propValue = obj[propName];
     if (typeof propValue == "function") {
       Cu.exportFunction(propValue, clone, {
         defineAs: propName
       });
     }
   }
 }
 
--- a/devtools/client/dom/test/browser_dom_array.js
+++ b/devtools/client/dom/test/browser_dom_array.js
@@ -12,29 +12,29 @@ const TEST_ARRAY = [
 ];
 
 /**
  * Basic test that checks content of the DOM panel.
  */
 add_task(async function() {
   info("Test DOM Panel Array Expansion started");
 
-  let { panel } = await addTestTab(TEST_PAGE_URL);
+  const { panel } = await addTestTab(TEST_PAGE_URL);
 
   // Expand specified row and wait till children are displayed.
   await expandRow(panel, "_a");
 
   // Verify that children is displayed now.
-  let childRows = getAllRowsForLabel(panel, "_a");
+  const childRows = getAllRowsForLabel(panel, "_a");
 
-  let item = childRows.pop();
+  const item = childRows.pop();
   is(item.name, "length", "length property is correct");
   is(item.value, 26, "length property value is 26");
 
   let i = 0;
-  for (let name in childRows) {
-    let row = childRows[name];
+  for (const name in childRows) {
+    const row = childRows[name];
 
     is(name, i++, `index ${name} is correct and sorted into the correct position`);
     ok(typeof row.name === "number", "array index is displayed as a number");
     is(TEST_ARRAY[name], row.value, `value for array[${name}] is ${row.value}`);
   }
 });
--- a/devtools/client/dom/test/browser_dom_basic.js
+++ b/devtools/client/dom/test/browser_dom_basic.js
@@ -8,17 +8,17 @@
 const TEST_PAGE_URL = URL_ROOT + "page_basic.html";
 
 /**
  * Basic test that checks content of the DOM panel.
  */
 add_task(async function() {
   info("Test DOM panel basic started");
 
-  let { panel } = await addTestTab(TEST_PAGE_URL);
+  const { panel } = await addTestTab(TEST_PAGE_URL);
 
   // Expand specified row and wait till children are displayed.
   await expandRow(panel, "_a");
 
   // Verify that child is displayed now.
-  let childRow = getRowByLabel(panel, "_data");
+  const childRow = getRowByLabel(panel, "_data");
   ok(childRow, "Child row must exist");
 });
--- a/devtools/client/dom/test/browser_dom_refresh.js
+++ b/devtools/client/dom/test/browser_dom_refresh.js
@@ -8,18 +8,18 @@
 const TEST_PAGE_URL = URL_ROOT + "page_basic.html";
 
 /**
  * Basic test that checks the Refresh action in DOM panel.
  */
 add_task(async function() {
   info("Test DOM panel basic started");
 
-  let { panel } = await addTestTab(TEST_PAGE_URL);
+  const { panel } = await addTestTab(TEST_PAGE_URL);
 
   // Create a new variable in the page scope and refresh the panel.
   await evaluateJSAsync(panel, "var _b = 10");
   await refreshPanel(panel);
 
   // Verify that the variable is displayed now.
-  let row = getRowByLabel(panel, "_b");
+  const row = getRowByLabel(panel, "_b");
   ok(row, "New variable must be displayed");
 });
--- a/devtools/client/dom/test/head.js
+++ b/devtools/client/dom/test/head.js
@@ -59,19 +59,19 @@ function addTestTab(url) {
  *
  * @param {Element} tab
  *        Optional tab element for which you want open the DOM panel.
  *        The default tab is taken from the global variable |tab|.
  * @return a promise that is resolved once the web console is open.
  */
 function initDOMPanel(tab) {
   return new Promise(resolve => {
-    let target = TargetFactory.forTab(tab || gBrowser.selectedTab);
+    const target = TargetFactory.forTab(tab || gBrowser.selectedTab);
     gDevTools.showToolbox(target, "dom").then(toolbox => {
-      let panel = toolbox.getCurrentPanel();
+      const panel = toolbox.getCurrentPanel();
       resolve(panel);
     });
   });
 }
 
 /**
  * Synthesize asynchronous click event (with clean stack trace).
  */
@@ -83,32 +83,32 @@ function synthesizeMouseClickSoon(panel,
     });
   });
 }
 
 /**
  * Returns tree row with specified label.
  */
 function getRowByLabel(panel, text) {
-  let doc = panel.panelWin.document;
-  let labels = [...doc.querySelectorAll(".treeLabel")];
-  let label = labels.find(node => node.textContent == text);
+  const doc = panel.panelWin.document;
+  const labels = [...doc.querySelectorAll(".treeLabel")];
+  const label = labels.find(node => node.textContent == text);
   return label ? label.closest(".treeRow") : null;
 }
 
 /**
  * Returns the children (tree row text) of the specified object name as an
  * array.
  */
 function getAllRowsForLabel(panel, text) {
   let rootObjectLevel;
   let node;
-  let result = [];
-  let doc = panel.panelWin.document;
-  let nodes = [...doc.querySelectorAll(".treeLabel")];
+  const result = [];
+  const doc = panel.panelWin.document;
+  const nodes = [...doc.querySelectorAll(".treeLabel")];
 
   // Find the label (object name) for which we want the children. We remove
   // nodes from the start of the array until we reach the property. The children
   // are then at the start of the array.
   while (true) {
     node = nodes.shift();
 
     if (!node || node.textContent === text) {
@@ -119,17 +119,17 @@ function getAllRowsForLabel(panel, text)
 
   // Return an empty array if the node is not found.
   if (!node) {
     return result;
   }
 
   // Now get the children.
   for (node of nodes) {
-    let level = node.getAttribute("data-level");
+    const level = node.getAttribute("data-level");
 
     if (level > rootObjectLevel) {
       result.push({
         name: normalizeTreeValue(node.textContent),
         value: normalizeTreeValue(node.parentNode.nextElementSibling.textContent)
       });
     } else {
       break;
@@ -162,35 +162,35 @@ function normalizeTreeValue(value) {
   return value;
 }
 
 /**
  * Expands elements with given label and waits till
  * children are received from the backend.
  */
 function expandRow(panel, labelText) {
-  let row = getRowByLabel(panel, labelText);
+  const row = getRowByLabel(panel, labelText);
   return synthesizeMouseClickSoon(panel, row).then(() => {
     // Wait till children (properties) are fetched
     // from the backend.
     return waitForDispatch(panel, "FETCH_PROPERTIES");
   });
 }
 
 function evaluateJSAsync(panel, expression) {
   return new Promise(resolve => {
     panel.target.activeConsole.evaluateJSAsync(expression, res => {
       resolve(res);
     });
   });
 }
 
 function refreshPanel(panel) {
-  let doc = panel.panelWin.document;
-  let button = doc.querySelector("#dom-refresh-button");
+  const doc = panel.panelWin.document;
+  const button = doc.querySelector("#dom-refresh-button");
   return synthesizeMouseClickSoon(panel, button).then(() => {
     // Wait till children (properties) are fetched
     // from the backend.
     return waitForDispatch(panel, "FETCH_PROPERTIES");
   });
 }
 
 // Redux related API, use from shared location
--- a/devtools/client/framework/ToolboxProcess.jsm
+++ b/devtools/client/framework/ToolboxProcess.jsm
@@ -35,17 +35,17 @@ var processes = new Set();
  * @param function onClose [optional]
  *        A function called when the process stops running.
  * @param function onRun [optional]
  *        A function called when the process starts running.
  * @param object options [optional]
  *        An object with properties for configuring BrowserToolboxProcess.
  */
 this.BrowserToolboxProcess = function BrowserToolboxProcess(onClose, onRun, options) {
-  let emitter = new EventEmitter();
+  const emitter = new EventEmitter();
   this.on = emitter.on.bind(emitter);
   this.off = emitter.off.bind(emitter);
   this.once = emitter.once.bind(emitter);
   // Forward any events to the shared emitter.
   this.emit = function(...args) {
     emitter.emit(...args);
     BrowserToolboxProcess.emit(...args);
   };
@@ -98,17 +98,17 @@ BrowserToolboxProcess.init = function(on
   return new BrowserToolboxProcess(onClose, onRun, options);
 };
 
 /**
  * Figure out if there are any open Browser Toolboxes that'll need to be restored.
  * @return bool
  */
 BrowserToolboxProcess.getBrowserToolboxSessionState = function() {
-  for (let process of processes.values()) {
+  for (const process of processes.values()) {
     // Don't worry about addon toolboxes, we only want to restore the Browser Toolbox.
     if (!process._options || !process._options.addonID) {
       return true;
     }
   }
   return false;
 };
 
@@ -117,19 +117,19 @@ BrowserToolboxProcess.getBrowserToolboxS
  *
  * @param id string
  *        The ID of the add-on to pass the options to
  * @param options object
  *        The options.
  * @return a promise that will be resolved when complete.
  */
 BrowserToolboxProcess.setAddonOptions = function(id, options) {
-  let promises = [];
+  const promises = [];
 
-  for (let process of processes.values()) {
+  for (const process of processes.values()) {
     promises.push(process.debuggerServer.setAddonOptions(id, options));
   }
 
   return promise.all(promises);
 };
 
 BrowserToolboxProcess.prototype = {
   /**
@@ -145,34 +145,34 @@ BrowserToolboxProcess.prototype = {
 
     // Create a separate loader instance, so that we can be sure to receive a
     // separate instance of the DebuggingServer from the rest of the devtools.
     // This allows us to safely use the tools against even the actors and
     // DebuggingServer itself, especially since we can mark this loader as
     // invisible to the debugger (unlike the usual loader settings).
     this.loader = new DevToolsLoader();
     this.loader.invisibleToDebugger = true;
-    let { DebuggerServer } = this.loader.require("devtools/server/main");
+    const { DebuggerServer } = this.loader.require("devtools/server/main");
     this.debuggerServer = DebuggerServer;
     dumpn("Created a separate loader instance for the DebuggerServer.");
 
     // Forward interesting events.
     this.debuggerServer.on("connectionchange", this._onConnectionChange);
 
     this.debuggerServer.init();
     // We mainly need a root actor and tab actors for opening a toolbox, even
     // against chrome/content/addon. But the "no auto hide" button uses the
     // preference actor, so also register the browser actors.
     this.debuggerServer.registerAllActors();
     this.debuggerServer.allowChromeProcess = true;
     dumpn("initialized and added the browser actors for the DebuggerServer.");
 
-    let chromeDebuggingWebSocket =
+    const chromeDebuggingWebSocket =
       Services.prefs.getBoolPref("devtools.debugger.chrome-debugging-websocket");
-    let listener = this.debuggerServer.createListener();
+    const listener = this.debuggerServer.createListener();
     listener.portOrPath = -1;
     listener.webSocket = chromeDebuggingWebSocket;
     listener.open();
     this.port = listener.port;
 
     if (!this.port) {
       throw new Error("No debugger server port");
     }
@@ -185,17 +185,17 @@ BrowserToolboxProcess.prototype = {
    * Initializes a profile for the remote debugger process.
    */
   _initProfile: function() {
     dumpn("Initializing the chrome toolbox user profile.");
 
     // We used to use `ProfLD` instead of `ProfD`, so migrate old profiles if they exist.
     this._migrateProfileDir();
 
-    let debuggingProfileDir = Services.dirsvc.get("ProfD", Ci.nsIFile);
+    const debuggingProfileDir = Services.dirsvc.get("ProfD", Ci.nsIFile);
     debuggingProfileDir.append(CHROME_DEBUGGER_PROFILE_NAME);
     try {
       debuggingProfileDir.create(Ci.nsIFile.DIRECTORY_TYPE, 0o755);
     } catch (ex) {
       // Don't re-copy over the prefs again if this profile already exists
       if (ex.result === Cr.NS_ERROR_FILE_ALREADY_EXISTS) {
         this._dbgProfilePath = debuggingProfileDir.path;
       } else {
@@ -203,17 +203,17 @@ BrowserToolboxProcess.prototype = {
         dumpn("Error: " + (ex.message || ex));
       }
       return;
     }
 
     this._dbgProfilePath = debuggingProfileDir.path;
 
     // We would like to copy prefs into this new profile...
-    let prefsFile = debuggingProfileDir.clone();
+    const prefsFile = debuggingProfileDir.clone();
     prefsFile.append("prefs.js");
     // ... but unfortunately, when we run tests, it seems the starting profile
     // clears out the prefs file before re-writing it, and in practice the
     // file is empty when we get here. So just copying doesn't work in that
     // case.
     // We could force a sync pref flush and then copy it... but if we're doing
     // that, we might as well just flush directly to the new profile, which
     // always works:
@@ -224,18 +224,18 @@ BrowserToolboxProcess.prototype = {
   },
 
   /**
    * Originally, the profile was placed in `ProfLD` instead of `ProfD`.  On some systems,
    * such as macOS, `ProfLD` is in the user's Caches directory, which is not an
    * appropriate place to store supposedly persistent profile data.
    */
   _migrateProfileDir() {
-    let oldDebuggingProfileDir = Services.dirsvc.get("ProfLD", Ci.nsIFile);
-    let newDebuggingProfileDir = Services.dirsvc.get("ProfD", Ci.nsIFile);
+    const oldDebuggingProfileDir = Services.dirsvc.get("ProfLD", Ci.nsIFile);
+    const newDebuggingProfileDir = Services.dirsvc.get("ProfD", Ci.nsIFile);
     if (oldDebuggingProfileDir.path == newDebuggingProfileDir.path) {
       // It's possible for these locations to be the same, such as running from
       // a custom profile directory specified via CLI.
       return;
     }
     oldDebuggingProfileDir.append(CHROME_DEBUGGER_PROFILE_NAME);
     if (!oldDebuggingProfileDir.exists()) {
       return;
@@ -244,40 +244,40 @@ BrowserToolboxProcess.prototype = {
     try {
       // Remove the directory from the target location, if it exists
       newDebuggingProfileDir.append(CHROME_DEBUGGER_PROFILE_NAME);
       if (newDebuggingProfileDir.exists()) {
         dumpn(`Removing folder at destination: ${newDebuggingProfileDir.path}`);
         newDebuggingProfileDir.remove(true);
       }
       // Move profile from old to new location
-      let newDebuggingProfileParent = Services.dirsvc.get("ProfD", Ci.nsIFile);
+      const newDebuggingProfileParent = Services.dirsvc.get("ProfD", Ci.nsIFile);
       oldDebuggingProfileDir.moveTo(newDebuggingProfileParent, null);
       dumpn("Debugging profile migrated successfully");
     } catch (e) {
       dumpn(`Debugging profile migration failed: ${e}`);
     }
   },
 
   /**
    * Creates and initializes the profile & process for the remote debugger.
    */
   _create: function() {
     dumpn("Initializing chrome debugging process.");
 
-    let command = Services.dirsvc.get("XREExeF", Ci.nsIFile).path;
+    const command = Services.dirsvc.get("XREExeF", Ci.nsIFile).path;
 
     dumpn("Running chrome debugging process.");
-    let args = [
+    const args = [
       "-no-remote",
       "-foreground",
       "-profile", this._dbgProfilePath,
       "-chrome", DBG_XUL
     ];
-    let environment = {
+    const environment = {
       // Disable safe mode for the new process in case this was opened via the
       // keyboard shortcut.
       MOZ_DISABLE_SAFE_MODE_KEY: "1",
       MOZ_BROWSER_TOOLBOX_PORT: String(this.port),
     };
     if (this._options.addonID) {
       environment.MOZ_BROWSER_TOOLBOX_ADDONID = String(this._options.addonID);
     }
@@ -303,17 +303,17 @@ BrowserToolboxProcess.prototype = {
       this._dbgProcess = proc;
 
       this._telemetry.toolOpened("jsbrowserdebugger");
 
       dumpn("Chrome toolbox is now running...");
       this.emit("run", this);
 
       proc.stdin.close();
-      let dumpPipe = async pipe => {
+      const dumpPipe = async pipe => {
         let data = await pipe.readString();
         while (data) {
           dump(data);
           data = await pipe.readString();
         }
       };
       dumpPipe(proc.stdout);
 
@@ -329,17 +329,17 @@ BrowserToolboxProcess.prototype = {
    * Called upon receiving the connectionchange event from a debuggerServer.
    *
    * @param {String} what
    *        Type of connection change (can be either 'opened' or 'closed').
    * @param {DebuggerServerConnection} connection
    *        The connection that was opened or closed.
    */
   _onConnectionChange: function(what, connection) {
-    let wrappedJSObject = { what, connection };
+    const wrappedJSObject = { what, connection };
     Services.obs.notifyObservers({ wrappedJSObject }, "toolbox-connection-change");
   },
 
   /**
    * Closes the remote debugging server and kills the toolbox process.
    */
   close: async function() {
     if (this.closed) {
@@ -392,12 +392,12 @@ var wantLogging = Services.prefs.getBool
 Services.prefs.addObserver("devtools.debugger.log", {
   observe: (...args) => {
     wantLogging = Services.prefs.getBoolPref(args.pop());
   }
 });
 
 Services.prefs.addObserver("toolbox-update-addon-options", {
   observe: (subject) => {
-    let {id, options} = subject.wrappedJSObject;
+    const {id, options} = subject.wrappedJSObject;
     BrowserToolboxProcess.setAddonOptions(id, options);
   }
 });
--- a/devtools/client/framework/attach-thread.js
+++ b/devtools/client/framework/attach-thread.js
@@ -32,38 +32,38 @@ function handleThreadState(toolbox, even
       toolbox.selectTool("jsdebugger", packet.why.type);
     }
   } else if (event === "resumed") {
     toolbox.unhighlightTool("jsdebugger");
   }
 }
 
 function attachThread(toolbox) {
-  let deferred = defer();
+  const deferred = defer();
 
-  let target = toolbox.target;
-  let { form: { chromeDebugger, actor } } = target;
+  const target = toolbox.target;
+  const { form: { chromeDebugger, actor } } = target;
 
   // Sourcemaps are always turned off when using the new debugger
   // frontend. This is because it does sourcemapping on the
   // client-side, so the server should not do it.
   let useSourceMaps = false;
   let autoBlackBox = false;
   let ignoreFrameEnvironment = false;
   const newDebuggerEnabled = Services.prefs.getBoolPref("devtools.debugger.new-debugger-frontend");
   if (!newDebuggerEnabled) {
     useSourceMaps = Services.prefs.getBoolPref("devtools.debugger.source-maps-enabled");
     autoBlackBox = Services.prefs.getBoolPref("devtools.debugger.auto-black-box");
   } else {
     ignoreFrameEnvironment = true;
   }
 
-  let threadOptions = { useSourceMaps, autoBlackBox, ignoreFrameEnvironment };
+  const threadOptions = { useSourceMaps, autoBlackBox, ignoreFrameEnvironment };
 
-  let handleResponse = (res, threadClient) => {
+  const handleResponse = (res, threadClient) => {
     if (res.error) {
       deferred.reject(new Error("Couldn't attach to thread: " + res.error));
       return;
     }
     threadClient.addListener("paused", handleThreadState.bind(null, toolbox));
     threadClient.addListener("resumed", handleThreadState.bind(null, toolbox));
 
     if (!threadClient.paused) {
--- a/devtools/client/framework/browser-menus.js
+++ b/devtools/client/framework/browser-menus.js
@@ -40,17 +40,17 @@ function l10n(key) {
  *        Access key of the menuitem, used as shortcut while opening the menu.
  * @param {Boolean} isCheckbox (optional)
  *        If true, the menuitem will act as a checkbox and have an optional
  *        tick on its left.
  *
  * @return XULMenuItemElement
  */
 function createMenuItem({ doc, id, label, accesskey, isCheckbox }) {
-  let menuitem = doc.createElement("menuitem");
+  const menuitem = doc.createElement("menuitem");
   menuitem.id = id;
   menuitem.setAttribute("label", label);
   if (accesskey) {
     menuitem.setAttribute("accesskey", accesskey);
   }
   if (isCheckbox) {
     menuitem.setAttribute("type", "checkbox");
     menuitem.setAttribute("autocheck", "false");
@@ -62,30 +62,30 @@ function createMenuItem({ doc, id, label
  * Add a menu entry for a tool definition
  *
  * @param {Object} toolDefinition
  *        Tool definition of the tool to add a menu entry.
  * @param {XULDocument} doc
  *        The document to which the tool menu item is to be added.
  */
 function createToolMenuElements(toolDefinition, doc) {
-  let id = toolDefinition.id;
-  let menuId = "menuitem_" + id;
+  const id = toolDefinition.id;
+  const menuId = "menuitem_" + id;
 
   // Prevent multiple entries for the same tool.
   if (doc.getElementById(menuId)) {
     return;
   }
 
-  let oncommand = function(id, event) {
-    let window = event.target.ownerDocument.defaultView;
+  const oncommand = function(id, event) {
+    const window = event.target.ownerDocument.defaultView;
     gDevToolsBrowser.selectToolCommand(window.gBrowser, id, Cu.now());
   }.bind(null, id);
 
-  let menuitem = createMenuItem({
+  const menuitem = createMenuItem({
     doc,
     id: "menuitem_" + id,
     label: toolDefinition.menuLabel || toolDefinition.label,
     accesskey: toolDefinition.accesskey
   });
   // Refer to the key in order to display the key shortcut at menu ends
   // This <key> element is being created by devtools/client/devtools-startup.js
   menuitem.setAttribute("key", "key_" + id);
@@ -103,21 +103,21 @@ function createToolMenuElements(toolDefi
  * @param {XULDocument} doc
  *        The document to which the tool is to be registered.
  * @param {Object} toolDefinition
  *        Tool definition of the tool to register.
  * @param {Object} prevDef
  *        The tool definition after which the tool menu item is to be added.
  */
 function insertToolMenuElements(doc, toolDefinition, prevDef) {
-  let { menuitem } = createToolMenuElements(toolDefinition, doc);
+  const { menuitem } = createToolMenuElements(toolDefinition, doc);
 
   let ref;
   if (prevDef) {
-    let menuitem = doc.getElementById("menuitem_" + prevDef.id);
+    const menuitem = doc.getElementById("menuitem_" + prevDef.id);
     ref = menuitem && menuitem.nextSibling ? menuitem.nextSibling : null;
   } else {
     ref = doc.getElementById("menu_devtools_separator");
   }
 
   if (ref) {
     ref.parentNode.insertBefore(menuitem, ref);
   }
@@ -128,127 +128,127 @@ exports.insertToolMenuElements = insertT
  * Remove a tool's menuitem from a window
  *
  * @param {string} toolId
  *        Id of the tool to add a menu entry for
  * @param {XULDocument} doc
  *        The document to which the tool menu item is to be removed from
  */
 function removeToolFromMenu(toolId, doc) {
-  let key = doc.getElementById("key_" + toolId);
+  const key = doc.getElementById("key_" + toolId);
   if (key) {
     key.remove();
   }
 
-  let menuitem = doc.getElementById("menuitem_" + toolId);
+  const menuitem = doc.getElementById("menuitem_" + toolId);
   if (menuitem) {
     menuitem.remove();
   }
 }
 exports.removeToolFromMenu = removeToolFromMenu;
 
 /**
  * Add all tools to the developer tools menu of a window.
  *
  * @param {XULDocument} doc
  *        The document to which the tool items are to be added.
  */
 function addAllToolsToMenu(doc) {
-  let fragKeys = doc.createDocumentFragment();
-  let fragMenuItems = doc.createDocumentFragment();
+  const fragKeys = doc.createDocumentFragment();
+  const fragMenuItems = doc.createDocumentFragment();
 
-  for (let toolDefinition of gDevTools.getToolDefinitionArray()) {
+  for (const toolDefinition of gDevTools.getToolDefinitionArray()) {
     if (!toolDefinition.inMenu) {
       continue;
     }
 
-    let elements = createToolMenuElements(toolDefinition, doc);
+    const elements = createToolMenuElements(toolDefinition, doc);
 
     if (!elements) {
       continue;
     }
 
     if (elements.key) {
       fragKeys.appendChild(elements.key);
     }
     fragMenuItems.appendChild(elements.menuitem);
   }
 
-  let mps = doc.getElementById("menu_devtools_separator");
+  const mps = doc.getElementById("menu_devtools_separator");
   if (mps) {
     mps.parentNode.insertBefore(fragMenuItems, mps);
   }
 }
 
 /**
  * Add global menus that are not panel specific.
  *
  * @param {XULDocument} doc
  *        The document to which menus are to be added.
  */
 function addTopLevelItems(doc) {
-  let menuItems = doc.createDocumentFragment();
+  const menuItems = doc.createDocumentFragment();
 
-  let { menuitems } = require("../menus");
-  for (let item of menuitems) {
+  const { menuitems } = require("../menus");
+  for (const item of menuitems) {
     if (item.separator) {
-      let separator = doc.createElement("menuseparator");
+      const separator = doc.createElement("menuseparator");
       separator.id = item.id;
       menuItems.appendChild(separator);
     } else {
-      let { id, l10nKey } = item;
+      const { id, l10nKey } = item;
 
       // Create a <menuitem>
-      let menuitem = createMenuItem({
+      const menuitem = createMenuItem({
         doc,
         id,
         label: l10n(l10nKey + ".label"),
         accesskey: l10n(l10nKey + ".accesskey"),
         isCheckbox: item.checkbox
       });
       menuitem.addEventListener("command", item.oncommand);
       menuItems.appendChild(menuitem);
 
       if (item.keyId) {
         menuitem.setAttribute("key", "key_" + item.keyId);
       }
     }
   }
 
   // Cache all nodes before insertion to be able to remove them on unload
-  let nodes = [];
-  for (let node of menuItems.children) {
+  const nodes = [];
+  for (const node of menuItems.children) {
     nodes.push(node);
   }
   FragmentsCache.set(doc, nodes);
 
-  let menu = doc.getElementById("menuWebDeveloperPopup");
+  const menu = doc.getElementById("menuWebDeveloperPopup");
   menu.appendChild(menuItems);
 
   // There is still "Page Source" menuitem hardcoded into browser.xul. Instead
   // of manually inserting everything around it, move it to the expected
   // position.
-  let pageSource = doc.getElementById("menu_pageSource");
-  let endSeparator = doc.getElementById("devToolsEndSeparator");
+  const pageSource = doc.getElementById("menu_pageSource");
+  const endSeparator = doc.getElementById("devToolsEndSeparator");
   menu.insertBefore(pageSource, endSeparator);
 }
 
 /**
  * Remove global menus that are not panel specific.
  *
  * @param {XULDocument} doc
  *        The document to which menus are to be added.
  */
 function removeTopLevelItems(doc) {
-  let nodes = FragmentsCache.get(doc);
+  const nodes = FragmentsCache.get(doc);
   if (!nodes) {
     return;
   }
   FragmentsCache.delete(doc);
-  for (let node of nodes) {
+  for (const node of nodes) {
     node.remove();
   }
 }
 
 /**
  * Add menus to a browser document
  *
  * @param {XULDocument} doc
--- a/devtools/client/framework/components/ToolboxController.js
+++ b/devtools/client/framework/components/ToolboxController.js
@@ -114,23 +114,23 @@ class ToolboxController extends Componen
     });
   }
 
   setCanRender() {
     this.setState({ canRender: true }, this.updateButtonIds);
   }
 
   highlightTool(highlightedTool) {
-    let { highlightedTools } = this.state;
+    const { highlightedTools } = this.state;
     highlightedTools.add(highlightedTool);
     this.setState({ highlightedTools });
   }
 
   unhighlightTool(id) {
-    let { highlightedTools } = this.state;
+    const { highlightedTools } = this.state;
     if (highlightedTools.has(id)) {
       highlightedTools.delete(id);
       this.setState({ highlightedTools });
     }
   }
 
   setDockOptionsEnabled(areDockOptionsEnabled) {
     this.setState({ areDockOptionsEnabled });
--- a/devtools/client/framework/components/ToolboxTabs.js
+++ b/devtools/client/framework/components/ToolboxTabs.js
@@ -95,90 +95,90 @@ class ToolboxTabs extends Component {
    * Return true if we should update the overflowed tabs.
    */
   shouldUpdateToolboxTabs(prevProps, nextProps) {
     if (prevProps.currentToolId !== nextProps.currentToolId ||
         prevProps.visibleToolboxButtonCount !== nextProps.visibleToolboxButtonCount) {
       return true;
     }
 
-    let prevPanels = prevProps.panelDefinitions.map(def => def.id);
-    let nextPanels = nextProps.panelDefinitions.map(def => def.id);
+    const prevPanels = prevProps.panelDefinitions.map(def => def.id);
+    const nextPanels = nextProps.panelDefinitions.map(def => def.id);
     return !this.equalToolIdArray(prevPanels, nextPanels);
   }
 
   /**
    * Update the Map of tool id and tool tab width.
    */
   updateCachedToolTabsWidthMap() {
-    let thisNode = findDOMNode(this);
-    let utils = window.QueryInterface(Ci.nsIInterfaceRequestor)
+    const thisNode = findDOMNode(this);
+    const utils = window.QueryInterface(Ci.nsIInterfaceRequestor)
         .getInterface(Ci.nsIDOMWindowUtils);
     // Force a reflow before calling getBoundingWithoutFlushing on each tab.
     thisNode.clientWidth;
 
-    for (let tab of thisNode.querySelectorAll(".devtools-tab")) {
-      let tabId = tab.id.replace("toolbox-tab-", "");
+    for (const tab of thisNode.querySelectorAll(".devtools-tab")) {
+      const tabId = tab.id.replace("toolbox-tab-", "");
       if (!this._cachedToolTabsWidthMap.has(tabId)) {
-        let rect = utils.getBoundsWithoutFlushing(tab);
+        const rect = utils.getBoundsWithoutFlushing(tab);
         this._cachedToolTabsWidthMap.set(tabId, rect.width);
       }
     }
   }
 
   /**
    * Update the overflowed tab array from currently displayed tool tab.
    * If calculated result is the same as the current overflowed tab array, this
    * function will not update state.
    */
   updateOverflowedTabs() {
-    let node = findDOMNode(this);
+    const node = findDOMNode(this);
     const toolboxWidth = parseInt(getComputedStyle(node).width, 10);
-    let { currentToolId } = this.props;
-    let enabledTabs = this.props.panelDefinitions.map(def => def.id);
+    const { currentToolId } = this.props;
+    const enabledTabs = this.props.panelDefinitions.map(def => def.id);
     let sumWidth = 0;
-    let visibleTabs = [];
+    const visibleTabs = [];
 
     for (const id of enabledTabs) {
-      let width = this._cachedToolTabsWidthMap.get(id);
+      const width = this._cachedToolTabsWidthMap.get(id);
       sumWidth += width;
       if (sumWidth <= toolboxWidth) {
         visibleTabs.push(id);
       } else {
         sumWidth = sumWidth - width + CHEVRON_BUTTON_WIDTH;
 
         // If toolbox can't display the Chevron, remove the last tool tab.
         if (sumWidth > toolboxWidth) {
-          let removeTabId = visibleTabs.pop();
+          const removeTabId = visibleTabs.pop();
           sumWidth -= this._cachedToolTabsWidthMap.get(removeTabId);
         }
         break;
       }
     }
 
     // If the selected tab is in overflowed tabs, insert it into a visible
     // toolbox.
     if (!visibleTabs.includes(currentToolId) &&
         enabledTabs.includes(currentToolId)) {
-      let selectedToolWidth = this._cachedToolTabsWidthMap.get(currentToolId);
+      const selectedToolWidth = this._cachedToolTabsWidthMap.get(currentToolId);
       while ((sumWidth + selectedToolWidth) > toolboxWidth &&
              visibleTabs.length > 0) {
-        let removingToolId  = visibleTabs.pop();
-        let removingToolWidth = this._cachedToolTabsWidthMap.get(removingToolId);
+        const removingToolId  = visibleTabs.pop();
+        const removingToolWidth = this._cachedToolTabsWidthMap.get(removingToolId);
         sumWidth -= removingToolWidth;
       }
 
       // If toolbox width is narrow, toolbox display only chevron menu.
       // i.e. All tool tabs will overflow.
       if ((sumWidth + selectedToolWidth) <= toolboxWidth) {
         visibleTabs.push(currentToolId);
       }
     }
 
-    let willOverflowTabs = enabledTabs.filter(id => !visibleTabs.includes(id));
+    const willOverflowTabs = enabledTabs.filter(id => !visibleTabs.includes(id));
     if (!this.equalToolIdArray(this.state.overflowedTabIds, willOverflowTabs)) {
       this.setState({ overflowedTabIds: willOverflowTabs });
     }
   }
 
   resizeHandler(evt) {
     window.cancelIdleCallback(this._resizeTimerId);
     this._resizeTimerId = window.requestIdleCallback(() => {
@@ -186,75 +186,75 @@ class ToolboxTabs extends Component {
     }, { timeout: 100 });
   }
 
   /**
    * Render a button to access overflowed tools, displayed only when the toolbar
    * presents an overflow.
    */
   renderToolsChevronButton() {
-    let {
+    const {
       panelDefinitions,
       selectTool,
       toolbox,
       L10N,
     } = this.props;
 
     return button({
       className: "devtools-button tools-chevron-menu",
       tabIndex: -1,
       title: L10N.getStr("toolbox.allToolsButton.tooltip"),
       id: "tools-chevron-menu-button",
       onClick: ({ target }) => {
-        let menu = new Menu({
+        const menu = new Menu({
           id: "tools-chevron-menupopup"
         });
 
         panelDefinitions.forEach(({id, label}) => {
           if (this.state.overflowedTabIds.includes(id)) {
             menu.append(new MenuItem({
               click: () => {
                 selectTool(id, "tab_switch");
               },
               id: "tools-chevron-menupopup-" + id,
               label,
               type: "checkbox",
             }));
           }
         });
 
-        let rect = target.getBoundingClientRect();
-        let screenX = target.ownerDocument.defaultView.mozInnerScreenX;
-        let screenY = target.ownerDocument.defaultView.mozInnerScreenY;
+        const rect = target.getBoundingClientRect();
+        const screenX = target.ownerDocument.defaultView.mozInnerScreenX;
+        const screenY = target.ownerDocument.defaultView.mozInnerScreenY;
 
         // Display the popup below the button.
         menu.popupWithZoom(rect.left + screenX, rect.bottom + screenY, toolbox);
         return menu;
       },
     });
   }
 
   /**
    * Render all of the tabs, based on the panel definitions and builds out
    * a toolbox tab for each of them. Will render the chevron button if the
    * container has an overflow.
    */
   render() {
-    let {
+    const {
       currentToolId,
       focusButton,
       focusedButton,
       highlightedTools,
       panelDefinitions,
       selectTool,
     } = this.props;
 
     this._tabsOrderManager.setCurrentPanelDefinitions(panelDefinitions);
 
-    let tabs = panelDefinitions.map(panelDefinition => {
+    const tabs = panelDefinitions.map(panelDefinition => {
       // Don't display overflowed tab.
       if (!this.state.overflowedTabIds.includes(panelDefinition.id)) {
         return ToolboxTab({
           key: panelDefinition.id,
           currentToolId,
           focusButton,
           focusedButton,
           highlightedTools,
--- a/devtools/client/framework/components/ToolboxToolbar.js
+++ b/devtools/client/framework/components/ToolboxToolbar.js
@@ -83,19 +83,19 @@ class ToolboxToolbar extends Component {
     };
   }
 
   /**
    * The render function is kept fairly short for maintainability. See the individual
    * render functions for how each of the sections is rendered.
    */
   render() {
-    let classnames = ["devtools-tabbar"];
-    let startButtons = renderToolboxButtonsStart(this.props);
-    let endButtons = renderToolboxButtonsEnd(this.props);
+    const classnames = ["devtools-tabbar"];
+    const startButtons = renderToolboxButtonsStart(this.props);
+    const endButtons = renderToolboxButtonsEnd(this.props);
 
     if (!startButtons) {
       classnames.push("devtools-tabbar-has-start");
     }
     if (!endButtons) {
       classnames.push("devtools-tabbar-has-end");
     }
 
@@ -190,17 +190,17 @@ function renderToolboxButtons({focusedBu
         tabIndex: id === focusedButton ? "0" : "-1",
         onKeyDown: (event) => {
           onKeyDown(event);
         }
       });
     });
 
   // Add the appropriate separator, if needed.
-  let children = renderedButtons;
+  const children = renderedButtons;
   if (renderedButtons.length) {
     if (isStart) {
       children.push(renderSeparator());
     // For the end group we add a separator *before* the RDM button if it
     // exists, but only if it is not the only button.
     } else if (rdmIndex !== -1 && visibleButtons.length > 1) {
       children.splice(
         children.length - 1,
--- a/devtools/client/framework/connect/connect.js
+++ b/devtools/client/framework/connect/connect.js
@@ -18,28 +18,28 @@ var L10N = new LocalizationHelper("devto
 var gClient;
 var gConnectionTimeout;
 
 /**
  * Once DOM is ready, we prefil the host/port inputs with
  * pref-stored values.
  */
 window.addEventListener("DOMContentLoaded", function() {
-  let host = Services.prefs.getCharPref("devtools.debugger.remote-host");
-  let port = Services.prefs.getIntPref("devtools.debugger.remote-port");
+  const host = Services.prefs.getCharPref("devtools.debugger.remote-host");
+  const port = Services.prefs.getIntPref("devtools.debugger.remote-port");
 
   if (host) {
     document.getElementById("host").value = host;
   }
 
   if (port) {
     document.getElementById("port").value = port;
   }
 
-  let form = document.querySelector("#connection-form form");
+  const form = document.querySelector("#connection-form form");
   form.addEventListener("submit", function() {
     window.submit().catch(e => {
       console.error(e);
       // Bug 921850: catch rare exception from DebuggerClient.socketConnect
       showError("unexpected");
     });
   });
 }, {capture: true, once: true});
@@ -47,143 +47,143 @@ window.addEventListener("DOMContentLoade
 /**
  * Called when the "connect" button is clicked.
  */
 /* exported submit */
 var submit = async function() {
   // Show the "connecting" screen
   document.body.classList.add("connecting");
 
-  let host = document.getElementById("host").value;
-  let port = document.getElementById("port").value;
+  const host = document.getElementById("host").value;
+  const port = document.getElementById("port").value;
 
   // Save the host/port values
   try {
     Services.prefs.setCharPref("devtools.debugger.remote-host", host);
     Services.prefs.setIntPref("devtools.debugger.remote-port", port);
   } catch (e) {
     // Fails in e10s mode, but not a critical feature.
   }
 
   // Initiate the connection
-  let transport = await DebuggerClient.socketConnect({ host, port });
+  const transport = await DebuggerClient.socketConnect({ host, port });
   gClient = new DebuggerClient(transport);
-  let delay = Services.prefs.getIntPref("devtools.debugger.remote-timeout");
+  const delay = Services.prefs.getIntPref("devtools.debugger.remote-timeout");
   gConnectionTimeout = setTimeout(handleConnectionTimeout, delay);
-  let response = await gClient.connect();
+  const response = await gClient.connect();
   await onConnectionReady(...response);
 };
 
 /**
  * Connection is ready. List actors and build buttons.
  */
 var onConnectionReady = async function([aType, aTraits]) {
   clearTimeout(gConnectionTimeout);
 
   let addons = [];
   try {
-    let response = await gClient.listAddons();
+    const response = await gClient.listAddons();
     if (!response.error && response.addons.length > 0) {
       addons = response.addons;
     }
   } catch (e) {
     // listAddons throws if the runtime doesn't support addons
   }
 
   let parent = document.getElementById("addonActors");
   if (addons.length > 0) {
     // Add one entry for each add-on.
-    for (let addon of addons) {
+    for (const addon of addons) {
       if (!addon.debuggable) {
         continue;
       }
       buildAddonLink(addon, parent);
     }
   } else {
     // Hide the section when there are no add-ons
     parent.previousElementSibling.remove();
     parent.remove();
   }
 
-  let response = await gClient.listTabs();
+  const response = await gClient.listTabs();
 
   parent = document.getElementById("tabActors");
 
   // Add Global Process debugging...
-  let globals = Cu.cloneInto(response, {});
+  const globals = Cu.cloneInto(response, {});
   delete globals.tabs;
   delete globals.selected;
   // ...only if there are appropriate actors (a 'from' property will always
   // be there).
 
   // Add one entry for each open tab.
   for (let i = 0; i < response.tabs.length; i++) {
     buildTabLink(response.tabs[i], parent, i == response.selected);
   }
 
-  let gParent = document.getElementById("globalActors");
+  const gParent = document.getElementById("globalActors");
 
   // Build the Remote Process button
   // If Fx<39, tab actors were used to be exposed on RootActor
   // but in Fx>=39, chrome is debuggable via getProcess() and ChromeActor
   if (globals.consoleActor || gClient.mainRoot.traits.allowChromeProcess) {
-    let a = document.createElement("a");
+    const a = document.createElement("a");
     a.onclick = function() {
       if (gClient.mainRoot.traits.allowChromeProcess) {
         gClient.getProcess()
                .then(aResponse => {
                  openToolbox(aResponse.form, true);
                });
       } else if (globals.consoleActor) {
         openToolbox(globals, true, "webconsole", false);
       }
     };
     a.title = a.textContent = L10N.getStr("mainProcess");
     a.className = "remote-process";
     a.href = "#";
     gParent.appendChild(a);
   }
   // Move the selected tab on top
-  let selectedLink = parent.querySelector("a.selected");
+  const selectedLink = parent.querySelector("a.selected");
   if (selectedLink) {
     parent.insertBefore(selectedLink, parent.firstChild);
   }
 
   document.body.classList.remove("connecting");
   document.body.classList.add("actors-mode");
 
   // Ensure the first link is focused
-  let firstLink = parent.querySelector("a:first-of-type");
+  const firstLink = parent.querySelector("a:first-of-type");
   if (firstLink) {
     firstLink.focus();
   }
 };
 
 /**
  * Build one button for an add-on actor.
  */
 function buildAddonLink(addon, parent) {
-  let a = document.createElement("a");
+  const a = document.createElement("a");
   a.onclick = async function() {
     const isTabActor = addon.isWebExtension;
     openToolbox(addon, true, "webconsole", isTabActor);
   };
 
   a.textContent = addon.name;
   a.title = addon.id;
   a.href = "#";
 
   parent.appendChild(a);
 }
 
 /**
  * Build one button for a tab actor.
  */
 function buildTabLink(tab, parent, selected) {
-  let a = document.createElement("a");
+  const a = document.createElement("a");
   a.onclick = function() {
     openToolbox(tab);
   };
 
   a.textContent = tab.title;
   a.title = tab.url;
   if (!a.textContent) {
     a.textContent = tab.url;
@@ -219,24 +219,24 @@ function handleConnectionTimeout() {
   showError("timeout");
 }
 
 /**
  * The user clicked on one of the buttons.
  * Opens the toolbox.
  */
 function openToolbox(form, chrome = false, tool = "webconsole", isTabActor) {
-  let options = {
+  const options = {
     form: form,
     client: gClient,
     chrome: chrome,
     isTabActor: isTabActor
   };
   TargetFactory.forRemoteTab(options).then((target) => {
-    let hostType = Toolbox.HostType.WINDOW;
+    const hostType = Toolbox.HostType.WINDOW;
     gDevTools.showToolbox(target, tool, hostType).then((toolbox) => {
       toolbox.once("destroyed", function() {
         gClient.close();
       });
     }, console.error);
     window.close();
   }, console.error);
 }
--- a/devtools/client/framework/devtools-browser.js
+++ b/devtools/client/framework/devtools-browser.js
@@ -54,64 +54,64 @@ var gDevToolsBrowser = exports.gDevTools
 
   /**
    * This function is for the benefit of Tools:DevToolbox in
    * browser/base/content/browser-sets.inc and should not be used outside
    * of there
    */
   // used by browser-sets.inc, command
   toggleToolboxCommand(gBrowser, startTime) {
-    let target = TargetFactory.forTab(gBrowser.selectedTab);
-    let toolbox = gDevTools.getToolbox(target);
+    const target = TargetFactory.forTab(gBrowser.selectedTab);
+    const toolbox = gDevTools.getToolbox(target);
 
     // If a toolbox exists, using toggle from the Main window :
     // - should close a docked toolbox
     // - should focus a windowed toolbox
-    let isDocked = toolbox && toolbox.hostType != Toolbox.HostType.WINDOW;
+    const isDocked = toolbox && toolbox.hostType != Toolbox.HostType.WINDOW;
     if (isDocked) {
       gDevTools.closeToolbox(target);
     } else {
       gDevTools.showToolbox(target, null, null, null, startTime);
     }
   },
 
   /**
    * This function ensures the right commands are enabled in a window,
    * depending on their relevant prefs. It gets run when a window is registered,
    * or when any of the devtools prefs change.
    */
   updateCommandAvailability(win) {
-    let doc = win.document;
+    const doc = win.document;
 
     function toggleMenuItem(id, isEnabled) {
-      let cmd = doc.getElementById(id);
+      const cmd = doc.getElementById(id);
       if (isEnabled) {
         cmd.removeAttribute("disabled");
         cmd.removeAttribute("hidden");
       } else {
         cmd.setAttribute("disabled", "true");
         cmd.setAttribute("hidden", "true");
       }
     }
 
     // Enable WebIDE?
-    let webIDEEnabled = Services.prefs.getBoolPref("devtools.webide.enabled");
+    const webIDEEnabled = Services.prefs.getBoolPref("devtools.webide.enabled");
     toggleMenuItem("menu_webide", webIDEEnabled);
 
     if (webIDEEnabled) {
       gDevToolsBrowser.installWebIDEWidget();
     } else {
       gDevToolsBrowser.uninstallWebIDEWidget();
     }
 
     // Enable Browser Toolbox?
-    let chromeEnabled = Services.prefs.getBoolPref("devtools.chrome.enabled");
-    let devtoolsRemoteEnabled = Services.prefs.getBoolPref(
+    const chromeEnabled = Services.prefs.getBoolPref("devtools.chrome.enabled");
+    const devtoolsRemoteEnabled = Services.prefs.getBoolPref(
       "devtools.debugger.remote-enabled");
-    let remoteEnabled = chromeEnabled && devtoolsRemoteEnabled;
+    const remoteEnabled = chromeEnabled && devtoolsRemoteEnabled;
     toggleMenuItem("menu_browserToolbox", remoteEnabled);
     toggleMenuItem("menu_browserContentToolbox",
       remoteEnabled && win.gMultiProcessBrowser);
 
     // Enable DevTools connection screen, if the preference allows this.
     toggleMenuItem("menu_devtools_connect", devtoolsRemoteEnabled);
   },
 
@@ -139,22 +139,22 @@ var gDevToolsBrowser = exports.gDevTools
 
   observe(subject, topic, prefName) {
     switch (topic) {
       case "browser-delayed-startup-finished":
         this._registerBrowserWindow(subject);
         break;
       case "nsPref:changed":
         if (prefName.endsWith("enabled")) {
-          for (let win of this._trackedBrowserWindows) {
+          for (const win of this._trackedBrowserWindows) {
             this.updateCommandAvailability(win);
           }
         }
         if (prefName === "devtools.theme") {
-          for (let win of this._trackedBrowserWindows) {
+          for (const win of this._trackedBrowserWindows) {
             this.updateDevtoolsThemeAttribute(win);
           }
         }
         break;
       case "quit-application":
         gDevToolsBrowser.destroy({ shuttingDown: true });
         break;
       case "devtools:loader:destroy":
@@ -188,19 +188,19 @@ var gDevToolsBrowser = exports.gDevTools
    * - if the toolbox is open, and the targeted tool is selected,
    *   and the host is NOT a window, we close the toolbox
    * - if the toolbox is open, and the targeted tool is selected,
    *   and the host is a window, we raise the toolbox window
    */
   // Used when: - registering a new tool
   //            - new xul window, to add menu items
   selectToolCommand(gBrowser, toolId, startTime) {
-    let target = TargetFactory.forTab(gBrowser.selectedTab);
-    let toolbox = gDevTools.getToolbox(target);
-    let toolDefinition = gDevTools.getToolDefinition(toolId);
+    const target = TargetFactory.forTab(gBrowser.selectedTab);
+    const toolbox = gDevTools.getToolbox(target);
+    const toolDefinition = gDevTools.getToolDefinition(toolId);
 
     if (toolbox &&
         (toolbox.currentToolId == toolId ||
           (toolId == "webconsole" && toolbox.splitConsole))) {
       toolbox.fireCustomKey(toolId);
 
       if (toolDefinition.preventClosingOnKey ||
           toolbox.hostType == Toolbox.HostType.WINDOW) {
@@ -247,17 +247,17 @@ var gDevToolsBrowser = exports.gDevTools
         break;
       case "webide":
         gDevToolsBrowser.openWebIDE();
         break;
       case "browserToolbox":
         BrowserToolboxProcess.init();
         break;
       case "browserConsole":
-        let {HUDService} = require("devtools/client/webconsole/hudservice");
+        const {HUDService} = require("devtools/client/webconsole/hudservice");
         HUDService.openBrowserConsoleOrFocus();
         break;
       case "responsiveDesignMode":
         ResponsiveUIManager.toggle(window, window.gBrowser.selectedTab, {
           trigger: "shortcut"
         });
         break;
       case "scratchpad":
@@ -269,17 +269,17 @@ var gDevToolsBrowser = exports.gDevTools
     }
   },
 
   /**
    * Open a tab on "about:debugging", optionally pre-select a given tab.
    */
    // Used by browser-sets.inc, command
   openAboutDebugging(gBrowser, hash) {
-    let url = "about:debugging" + (hash ? "#" + hash : "");
+    const url = "about:debugging" + (hash ? "#" + hash : "");
     gBrowser.selectedTab = gBrowser.addTab(url);
   },
 
   /**
    * Open a tab to allow connects to a remote browser
    */
    // Used by browser-sets.inc, command
   openConnectScreen(gBrowser) {
@@ -287,38 +287,38 @@ var gDevToolsBrowser = exports.gDevTools
   },
 
   /**
    * Open WebIDE
    */
    // Used by browser-sets.inc, command
    //         itself, webide widget
   openWebIDE() {
-    let win = Services.wm.getMostRecentWindow("devtools:webide");
+    const win = Services.wm.getMostRecentWindow("devtools:webide");
     if (win) {
       win.focus();
     } else {
       Services.ww.openWindow(null, "chrome://webide/content/", "webide", "chrome,centerscreen,resizable", null);
     }
   },
 
   _getContentProcessTarget(processId) {
     // Create a DebuggerServer in order to connect locally to it
     DebuggerServer.init();
     DebuggerServer.registerAllActors();
     DebuggerServer.allowChromeProcess = true;
 
-    let transport = DebuggerServer.connectPipe();
-    let client = new DebuggerClient(transport);
+    const transport = DebuggerServer.connectPipe();
+    const client = new DebuggerClient(transport);
 
-    let deferred = defer();
+    const deferred = defer();
     client.connect().then(() => {
       client.getProcess(processId)
             .then(response => {
-              let options = {
+              const options = {
                 form: response.form,
                 client: client,
                 chrome: true,
                 isTabActor: false
               };
               return TargetFactory.forRemoteTab(options);
             })
             .then(target => {
@@ -338,51 +338,51 @@ var gDevToolsBrowser = exports.gDevTools
   /**
    * Open the Browser Content Toolbox for the provided gBrowser instance.
    * Returns a promise that resolves with a toolbox instance. If no content process is
    * available, the promise will be rejected and a message will be displayed to the user.
    *
    * Used by menus.js
   */
   openContentProcessToolbox(gBrowser) {
-    let { childCount } = Services.ppmm;
+    const { childCount } = Services.ppmm;
     // Get the process message manager for the current tab
-    let mm = gBrowser.selectedBrowser.messageManager.processMessageManager;
+    const mm = gBrowser.selectedBrowser.messageManager.processMessageManager;
     let processId = null;
     for (let i = 1; i < childCount; i++) {
-      let child = Services.ppmm.getChildAt(i);
+      const child = Services.ppmm.getChildAt(i);
       if (child == mm) {
         processId = i;
         break;
       }
     }
     if (processId) {
       return this._getContentProcessTarget(processId)
           .then(target => {
             // Display a new toolbox in a new window
             return gDevTools.showToolbox(target, null, Toolbox.HostType.WINDOW);
           });
     }
 
-    let msg = L10N.getStr("toolbox.noContentProcessForTab.message");
+    const msg = L10N.getStr("toolbox.noContentProcessForTab.message");
     Services.prompt.alert(null, "", msg);
     return Promise.reject(msg);
   },
 
   /**
    * Open a window-hosted toolbox to debug the worker associated to the provided
    * worker actor.
    *
    * @param  {DebuggerClient} client
    * @param  {Object} workerActor
    *         worker actor form to debug
    */
   openWorkerToolbox(client, workerActor) {
     client.attachWorker(workerActor, (response, workerClient) => {
-      let workerTarget = TargetFactory.forWorker(workerClient);
+      const workerTarget = TargetFactory.forWorker(workerClient);
       gDevTools.showToolbox(workerTarget, null, Toolbox.HostType.WINDOW)
         .then(toolbox => {
           toolbox.once("destroy", () => workerClient.detach());
         });
     });
   },
 
   /**
@@ -401,35 +401,35 @@ var gDevToolsBrowser = exports.gDevTools
       tooltiptext: "devtools-webide-button2.tooltiptext",
       onCommand(event) {
         gDevToolsBrowser.openWebIDE();
       }
     });
   },
 
   isWebIDEWidgetInstalled() {
-    let widgetWrapper = CustomizableUI.getWidget("webide-button");
+    const widgetWrapper = CustomizableUI.getWidget("webide-button");
     return !!(widgetWrapper && widgetWrapper.provider == CustomizableUI.PROVIDER_API);
   },
 
   /**
    * Add the devtools-browser stylesheet to browser window's document. Returns a promise.
    *
    * @param  {Window} win
    *         The window on which the stylesheet should be added.
    * @return {Promise} promise that resolves when the stylesheet is loaded (or rejects
    *         if it fails to load).
    */
   loadBrowserStyleSheet: function(win) {
     if (this._browserStyleSheets.has(win)) {
       return Promise.resolve();
     }
 
-    let doc = win.document;
-    let {styleSheet, loadPromise} = appendStyleSheet(doc, BROWSER_STYLESHEET_URL);
+    const doc = win.document;
+    const {styleSheet, loadPromise} = appendStyleSheet(doc, BROWSER_STYLESHEET_URL);
     this._browserStyleSheets.set(win, styleSheet);
     return loadPromise;
   },
 
   /**
    * The deferred promise will be resolved by WebIDE's UI.init()
    */
   isWebIDEInitialized: defer(),
@@ -458,33 +458,33 @@ var gDevToolsBrowser = exports.gDevTools
 
     BrowserMenus.addMenus(win.document);
 
     this.updateCommandAvailability(win);
     this.updateDevtoolsThemeAttribute(win);
     this.ensurePrefObserver();
     win.addEventListener("unload", this);
 
-    let tabContainer = win.gBrowser.tabContainer;
+    const tabContainer = win.gBrowser.tabContainer;
     tabContainer.addEventListener("TabSelect", this);
   },
 
   /**
    * Hook the JS debugger tool to the "Debug Script" button of the slow script
    * dialog.
    */
   setSlowScriptDebugHandler() {
-    let debugService = Cc["@mozilla.org/dom/slow-script-debug;1"]
+    const debugService = Cc["@mozilla.org/dom/slow-script-debug;1"]
                          .getService(Ci.nsISlowScriptDebug);
 
     function slowScriptDebugHandler(tab, callback) {
-      let target = TargetFactory.forTab(tab);
+      const target = TargetFactory.forTab(tab);
 
       gDevTools.showToolbox(target, "jsdebugger").then(toolbox => {
-        let threadClient = toolbox.threadClient;
+        const threadClient = toolbox.threadClient;
 
         // Break in place, which means resuming the debuggee thread and pausing
         // right before the next step happens.
         switch (threadClient.state) {
           case "paused":
             // When the debugger is already paused.
             threadClient.resumeThenPause();
             callback();
@@ -508,57 +508,57 @@ var gDevToolsBrowser = exports.gDevTools
           default:
             throw Error("invalid thread client state in slow script debug handler: " +
                         threadClient.state);
         }
       });
     }
 
     debugService.activationHandler = function(window) {
-      let chromeWindow = window.QueryInterface(Ci.nsIInterfaceRequestor)
+      const chromeWindow = window.QueryInterface(Ci.nsIInterfaceRequestor)
                                 .getInterface(Ci.nsIWebNavigation)
                                 .QueryInterface(Ci.nsIDocShellTreeItem)
                                 .rootTreeItem
                                 .QueryInterface(Ci.nsIInterfaceRequestor)
                                 .getInterface(Ci.nsIDOMWindow)
                                 .QueryInterface(Ci.nsIDOMChromeWindow);
 
       let setupFinished = false;
       slowScriptDebugHandler(chromeWindow.gBrowser.selectedTab,
         () => {
           setupFinished = true;
         });
 
       // Don't return from the interrupt handler until the debugger is brought
       // up; no reason to continue executing the slow script.
-      let utils = window.QueryInterface(Ci.nsIInterfaceRequestor)
+      const utils = window.QueryInterface(Ci.nsIInterfaceRequestor)
                          .getInterface(Ci.nsIDOMWindowUtils);
       utils.enterModalState();
       Services.tm.spinEventLoopUntil(() => {
         return setupFinished;
       });
       utils.leaveModalState();
     };
 
     debugService.remoteActivationHandler = function(browser, callback) {
-      let chromeWindow = browser.ownerDocument.defaultView;
-      let tab = chromeWindow.gBrowser.getTabForBrowser(browser);
+      const chromeWindow = browser.ownerDocument.defaultView;
+      const tab = chromeWindow.gBrowser.getTabForBrowser(browser);
       chromeWindow.gBrowser.selected = tab;
 
       slowScriptDebugHandler(tab, function() {
         callback.finishDebuggerStartup();
       });
     };
   },
 
   /**
    * Unset the slow script debug handler.
    */
   unsetSlowScriptDebugHandler() {
-    let debugService = Cc["@mozilla.org/dom/slow-script-debug;1"]
+    const debugService = Cc["@mozilla.org/dom/slow-script-debug;1"]
                          .getService(Ci.nsISlowScriptDebug);
     debugService.activationHandler = undefined;
   },
 
   /**
    * Add the menuitem for a tool to all open browser windows.
    *
    * @param {object} toolDefinition
@@ -577,72 +577,72 @@ var gDevToolsBrowser = exports.gDevTools
         return;
       }
     } catch (e) {
       // Prevent breaking everything if the pref doesn't exists.
     }
 
     // We need to insert the new tool in the right place, which means knowing
     // the tool that comes before the tool that we're trying to add
-    let allDefs = gDevTools.getToolDefinitionArray();
+    const allDefs = gDevTools.getToolDefinitionArray();
     let prevDef;
-    for (let def of allDefs) {
+    for (const def of allDefs) {
       if (!def.inMenu) {
         continue;
       }
       if (def === toolDefinition) {
         break;
       }
       prevDef = def;
     }
 
-    for (let win of gDevToolsBrowser._trackedBrowserWindows) {
+    for (const win of gDevToolsBrowser._trackedBrowserWindows) {
       BrowserMenus.insertToolMenuElements(win.document, toolDefinition, prevDef);
     }
 
     if (toolDefinition.id === "jsdebugger") {
       gDevToolsBrowser.setSlowScriptDebugHandler();
     }
   },
 
   hasToolboxOpened(win) {
-    let tab = win.gBrowser.selectedTab;
-    for (let [target, ] of gDevTools._toolboxes) {
+    const tab = win.gBrowser.selectedTab;
+    for (const [target, ] of gDevTools._toolboxes) {
       if (target.tab == tab) {
         return true;
       }
     }
     return false;
   },
 
   /**
    * Update the "Toggle Tools" checkbox in the developer tools menu. This is
    * called when a toolbox is created or destroyed.
    */
   _updateMenuCheckbox() {
-    for (let win of gDevToolsBrowser._trackedBrowserWindows) {
-      let hasToolbox = gDevToolsBrowser.hasToolboxOpened(win);
+    for (const win of gDevToolsBrowser._trackedBrowserWindows) {
+      const hasToolbox = gDevToolsBrowser.hasToolboxOpened(win);
 
-      let menu = win.document.getElementById("menu_devToolbox");
+      const menu = win.document.getElementById("menu_devToolbox");
       if (hasToolbox) {
         menu.setAttribute("checked", "true");
       } else {
         menu.removeAttribute("checked");
       }
     }
   },
 
   /**
    * Remove the menuitem for a tool to all open browser windows.
    *
    * @param {string} toolId
    *        id of the tool to remove
    */
   _removeToolFromWindows(toolId) {
-    for (let win of gDevToolsBrowser._trackedBrowserWindows) {
+    for (const win of gDevToolsBrowser._trackedBrowserWindows) {
       BrowserMenus.removeToolFromMenu(toolId, win.document);
     }
 
     if (toolId === "jsdebugger") {
       gDevToolsBrowser.unsetSlowScriptDebugHandler();
     }
   },
 
@@ -658,29 +658,29 @@ var gDevToolsBrowser = exports.gDevTools
       return;
     }
     gDevToolsBrowser._trackedBrowserWindows.delete(win);
     win.removeEventListener("unload", this);
 
     BrowserMenus.removeMenus(win.document);
 
     // Destroy toolboxes for closed window
-    for (let [target, toolbox] of gDevTools._toolboxes) {
+    for (const [target, toolbox] of gDevTools._toolboxes) {
       if (target.tab && target.tab.ownerDocument.defaultView == win) {
         toolbox.destroy();
       }
     }
 
-    let styleSheet = this._browserStyleSheets.get(win);
+    const styleSheet = this._browserStyleSheets.get(win);
     if (styleSheet) {
       styleSheet.remove();
       this._browserStyleSheets.delete(win);
     }
 
-    let tabContainer = win.gBrowser.tabContainer;
+    const tabContainer = win.gBrowser.tabContainer;
     tabContainer.removeEventListener("TabSelect", this);
   },
 
   handleEvent(event) {
     switch (event.type) {
       case "TabSelect":
         gDevToolsBrowser._updateMenuCheckbox();
         break;
@@ -701,33 +701,33 @@ var gDevToolsBrowser = exports.gDevTools
    *        cleaned up in order to be able to load devtools again.
    */
   destroy({ shuttingDown }) {
     Services.prefs.removeObserver("devtools.", gDevToolsBrowser);
     Services.obs.removeObserver(gDevToolsBrowser, "browser-delayed-startup-finished");
     Services.obs.removeObserver(gDevToolsBrowser, "quit-application");
     Services.obs.removeObserver(gDevToolsBrowser, "devtools:loader:destroy");
 
-    for (let win of gDevToolsBrowser._trackedBrowserWindows) {
+    for (const win of gDevToolsBrowser._trackedBrowserWindows) {
       gDevToolsBrowser._forgetBrowserWindow(win);
     }
 
     // Remove scripts loaded in content process to support the Browser Content Toolbox.
     DebuggerServer.removeContentServerScript();
 
     gDevTools.destroy({ shuttingDown });
   },
 };
 
 // Handle all already registered tools,
 gDevTools.getToolDefinitionArray()
          .forEach(def => gDevToolsBrowser._addToolToWindows(def));
 // and the new ones.
 gDevTools.on("tool-registered", function(toolId) {
-  let toolDefinition = gDevTools._tools.get(toolId);
+  const toolDefinition = gDevTools._tools.get(toolId);
   // If the tool has been registered globally, add to all the
   // available windows.
   if (toolDefinition) {
     gDevToolsBrowser._addToolToWindows(toolDefinition);
   }
 });
 
 gDevTools.on("tool-unregistered", function(toolId) {
@@ -739,15 +739,15 @@ gDevTools.on("toolbox-destroyed", gDevTo
 
 Services.obs.addObserver(gDevToolsBrowser, "quit-application");
 Services.obs.addObserver(gDevToolsBrowser, "browser-delayed-startup-finished");
 // Watch for module loader unload. Fires when the tools are reloaded.
 Services.obs.addObserver(gDevToolsBrowser, "devtools:loader:destroy");
 
 // Fake end of browser window load event for all already opened windows
 // that is already fully loaded.
-let enumerator = Services.wm.getEnumerator(gDevTools.chromeWindowType);
+const enumerator = Services.wm.getEnumerator(gDevTools.chromeWindowType);
 while (enumerator.hasMoreElements()) {
-  let win = enumerator.getNext();
+  const win = enumerator.getNext();
   if (win.gBrowserInit && win.gBrowserInit.delayedStartupFinished) {
     gDevToolsBrowser._registerBrowserWindow(win);
   }
 }
--- a/devtools/client/framework/devtools.js
+++ b/devtools/client/framework/devtools.js
@@ -66,20 +66,20 @@ DevTools.prototype = {
   registerDefaults() {
     // Ensure registering items in the sorted order (getDefault* functions
     // return sorted lists)
     this.getDefaultTools().forEach(definition => this.registerTool(definition));
     this.getDefaultThemes().forEach(definition => this.registerTheme(definition));
   },
 
   unregisterDefaults() {
-    for (let definition of this.getToolDefinitionArray()) {
+    for (const definition of this.getToolDefinitionArray()) {
       this.unregisterTool(definition.id);
     }
-    for (let definition of this.getThemeDefinitionArray()) {
+    for (const definition of this.getThemeDefinitionArray()) {
       this.unregisterTheme(definition.id);
     }
   },
 
   /**
    * Register a new developer tool.
    *
    * A definition is a light object that holds different information about a
@@ -102,17 +102,17 @@ DevTools.prototype = {
    * - hideInOptions: Boolean indicating whether or not this tool should be
                       shown in toolbox options or not. Defaults to false.
    *                  (boolean)
    * - build: Function that takes an iframe, which has been populated with the
    *          markup from |url|, and also the toolbox containing the panel.
    *          And returns an instance of ToolPanel (function|required)
    */
   registerTool(toolDefinition) {
-    let toolId = toolDefinition.id;
+    const toolId = toolDefinition.id;
 
     if (!toolId || FORBIDDEN_IDS.has(toolId)) {
       throw new Error("Invalid definition.id");
     }
 
     // Make sure that additional tools will always be able to be hidden.
     // When being called from main.js, defaultTools has not yet been exported.
     // But, we can assume that in this case, it is a default tool.
@@ -137,45 +137,45 @@ DevTools.prototype = {
    *        cause a cascade of costly events
    */
   unregisterTool(tool, isQuitApplication) {
     let toolId = null;
     if (typeof tool == "string") {
       toolId = tool;
       tool = this._tools.get(tool);
     } else {
-      let {Deprecated} = require("resource://gre/modules/Deprecated.jsm");
+      const {Deprecated} = require("resource://gre/modules/Deprecated.jsm");
       Deprecated.warning("Deprecation WARNING: gDevTools.unregisterTool(tool) is " +
         "deprecated. You should unregister a tool using its toolId: " +
         "gDevTools.unregisterTool(toolId).");
       toolId = tool.id;
     }
     this._tools.delete(toolId);
 
     if (!isQuitApplication) {
       this.emit("tool-unregistered", toolId);
     }
   },
 
   /**
    * Sorting function used for sorting tools based on their ordinals.
    */
   ordinalSort(d1, d2) {
-    let o1 = (typeof d1.ordinal == "number") ? d1.ordinal : MAX_ORDINAL;
-    let o2 = (typeof d2.ordinal == "number") ? d2.ordinal : MAX_ORDINAL;
+    const o1 = (typeof d1.ordinal == "number") ? d1.ordinal : MAX_ORDINAL;
+    const o2 = (typeof d2.ordinal == "number") ? d2.ordinal : MAX_ORDINAL;
     return o1 - o2;
   },
 
   getDefaultTools() {
     return DefaultTools.sort(this.ordinalSort);
   },
 
   getAdditionalTools() {
-    let tools = [];
-    for (let [, value] of this._tools) {
+    const tools = [];
+    for (const [, value] of this._tools) {
       if (!DefaultTools.includes(value)) {
         tools.push(value);
       }
     }
     return tools.sort(this.ordinalSort);
   },
 
   getDefaultThemes() {
@@ -187,39 +187,39 @@ DevTools.prototype = {
    *
    * @param {string} toolId
    *        The id of the tool to show
    *
    * @return {ToolDefinition|null} tool
    *         The ToolDefinition for the id or null.
    */
   getToolDefinition(toolId) {
-    let tool = this._tools.get(toolId);
+    const tool = this._tools.get(toolId);
     if (!tool) {
       return null;
     } else if (!tool.visibilityswitch) {
       return tool;
     }
 
-    let enabled = Services.prefs.getBoolPref(tool.visibilityswitch, true);
+    const enabled = Services.prefs.getBoolPref(tool.visibilityswitch, true);
 
     return enabled ? tool : null;
   },
 
   /**
    * Allow ToolBoxes to get at the list of tools that they should populate
    * themselves with.
    *
    * @return {Map} tools
    *         A map of the the tool definitions registered in this instance
    */
   getToolDefinitionMap() {
-    let tools = new Map();
+    const tools = new Map();
 
-    for (let [id, definition] of this._tools) {
+    for (const [id, definition] of this._tools) {
       if (this.getToolDefinition(id)) {
         tools.set(id, definition);
       }
     }
 
     return tools;
   },
 
@@ -227,19 +227,19 @@ DevTools.prototype = {
    * Tools have an inherent ordering that can't be represented in a Map so
    * getToolDefinitionArray provides an alternative representation of the
    * definitions sorted by ordinal value.
    *
    * @return {Array} tools
    *         A sorted array of the tool definitions registered in this instance
    */
   getToolDefinitionArray() {
-    let definitions = [];
+    const definitions = [];
 
-    for (let [id, definition] of this._tools) {
+    for (const [id, definition] of this._tools) {
       if (this.getToolDefinition(id)) {
         definitions.push(definition);
       }
     }
 
     return definitions.sort(this.ordinalSort);
   },
 
@@ -278,17 +278,17 @@ DevTools.prototype = {
    * - onApply: Function that is executed by the framework when the theme
    *            is applied. The function takes the current iframe window
    *            and the previous theme id as arguments (function)
    * - onUnapply: Function that is executed by the framework when the theme
    *            is unapplied. The function takes the current iframe window
    *            and the new theme id as arguments (function)
    */
   registerTheme(themeDefinition) {
-    let themeId = themeDefinition.id;
+    const themeId = themeDefinition.id;
 
     if (!themeId) {
       throw new Error("Invalid theme id");
     }
 
     if (this._themes.get(themeId)) {
       throw new Error("Theme with the same id is already registered");
     }
@@ -309,22 +309,22 @@ DevTools.prototype = {
     let themeId = null;
     if (typeof theme == "string") {
       themeId = theme;
       theme = this._themes.get(theme);
     } else {
       themeId = theme.id;
     }
 
-    let currTheme = getTheme();
+    const currTheme = getTheme();
 
     // Note that we can't check if `theme` is an item
     // of `DefaultThemes` as we end up reloading definitions
     // module and end up with different theme objects
-    let isCoreTheme = DefaultThemes.some(t => t.id === themeId);
+    const isCoreTheme = DefaultThemes.some(t => t.id === themeId);
 
     // Reset the theme if an extension theme that's currently applied
     // is being removed.
     // Ignore shutdown since addons get disabled during that time.
     if (!Services.startup.shuttingDown &&
         !isCoreTheme &&
         theme.id == currTheme) {
       setTheme("light");
@@ -340,51 +340,51 @@ DevTools.prototype = {
    *
    * @param {string} themeId
    *        The id of the theme
    *
    * @return {ThemeDefinition|null} theme
    *         The ThemeDefinition for the id or null.
    */
   getThemeDefinition(themeId) {
-    let theme = this._themes.get(themeId);
+    const theme = this._themes.get(themeId);
     if (!theme) {
       return null;
     }
     return theme;
   },
 
   /**
    * Get map of registered themes.
    *
    * @return {Map} themes
    *         A map of the the theme definitions registered in this instance
    */
   getThemeDefinitionMap() {
-    let themes = new Map();
+    const themes = new Map();
 
-    for (let [id, definition] of this._themes) {
+    for (const [id, definition] of this._themes) {
       if (this.getThemeDefinition(id)) {
         themes.set(id, definition);
       }
     }
 
     return themes;
   },
 
   /**
    * Get registered themes definitions sorted by ordinal value.
    *
    * @return {Array} themes
    *         A sorted array of the theme definitions registered in this instance
    */
   getThemeDefinitionArray() {
-    let definitions = [];
+    const definitions = [];
 
-    for (let [id, definition] of this._themes) {
+    for (const [id, definition] of this._themes) {
       if (this.getThemeDefinition(id)) {
         definitions.push(definition);
       }
     }
 
     return definitions.sort(this.ordinalSort);
   },
 
@@ -462,32 +462,32 @@ DevTools.prototype = {
         await toolbox.selectTool(toolId, "toolbox_show");
       }
 
       toolbox.raise();
     } else {
       // As toolbox object creation is async, we have to be careful about races
       // Check for possible already in process of loading toolboxes before
       // actually trying to create a new one.
-      let promise = this._creatingToolboxes.get(target);
+      const promise = this._creatingToolboxes.get(target);
       if (promise) {
         return promise;
       }
-      let toolboxPromise = this.createToolbox(target, toolId, hostType, hostOptions);
+      const toolboxPromise = this.createToolbox(target, toolId, hostType, hostOptions);
       this._creatingToolboxes.set(target, toolboxPromise);
       toolbox = await toolboxPromise;
       this._creatingToolboxes.delete(target);
 
       if (startTime) {
         this.logToolboxOpenTime(toolbox.currentToolId, startTime);
       }
       this._firstShowToolbox = false;
     }
 
-    let width = Math.ceil(toolbox.win.outerWidth / 50) * 50;
+    const width = Math.ceil(toolbox.win.outerWidth / 50) * 50;
     this._telemetry.addEventProperty(
       "devtools.main", "open", "tools", null, "width", width);
 
     return toolbox;
   },
 
   /**
    * Log telemetry related to toolbox opening.
@@ -498,19 +498,19 @@ DevTools.prototype = {
    *
    * @param {String} toolId
    *        The id of the opened tool.
    * @param {Number} startTime
    *        Indicates the time at which the user event related to the toolbox
    *        opening started. This is a `Cu.now()` timing.
    */
   logToolboxOpenTime(toolId, startTime) {
-    let delay = Cu.now() - startTime;
+    const delay = Cu.now() - startTime;
 
-    let telemetryKey = this._firstShowToolbox ?
+    const telemetryKey = this._firstShowToolbox ?
       "DEVTOOLS_COLD_TOOLBOX_OPEN_DELAY_MS" : "DEVTOOLS_WARM_TOOLBOX_OPEN_DELAY_MS";
     this._telemetry.getKeyedHistogramById(telemetryKey).add(toolId, delay);
 
     this._telemetry.addEventProperty(
       "devtools.main", "open", "tools", null, "first_panel",
       this.makeToolIdHumanReadable(toolId));
   },
 
@@ -530,19 +530,19 @@ DevTools.prototype = {
     if (matches && matches.length === 2) {
       return matches[1];
     }
 
     return toolId;
   },
 
   async createToolbox(target, toolId, hostType, hostOptions) {
-    let manager = new ToolboxHostManager(target, hostType, hostOptions);
+    const manager = new ToolboxHostManager(target, hostType, hostOptions);
 
-    let toolbox = await manager.create(toolId);
+    const toolbox = await manager.create(toolId);
 
     this._toolboxes.set(target, toolbox);
 
     this.emit("toolbox-created", toolbox);
 
     toolbox.once("destroy", () => {
       this.emit("toolbox-destroy", target);
     });
@@ -622,45 +622,45 @@ DevTools.prototype = {
     return new WebExtensionInspectedWindowFront(tabTarget.client, tabTarget.form);
   },
 
   /**
    * Compatibility layer for web-extensions. Used by DevToolsShim for
    * toolkit/components/extensions/ext-c-toolkit.js
    */
   openBrowserConsole: function() {
-    let {HUDService} = require("devtools/client/webconsole/hudservice");
+    const {HUDService} = require("devtools/client/webconsole/hudservice");
     HUDService.openBrowserConsoleOrFocus();
   },
 
   /**
    * Evaluate the cross iframes query selectors
    * @oaram {Object} walker
    * @param {Array} selectors
    *        An array of CSS selectors to find the target accessible object.
    *        Several selectors can be needed if the element is nested in frames
    *        and not directly in the root document.
    * @return {Promise} a promise that resolves when the node front is found for
    *                   selection using inspector tools.
    */
   async findNodeFront(walker, nodeSelectors) {
     async function querySelectors(nodeFront) {
-      let selector = nodeSelectors.shift();
+      const selector = nodeSelectors.shift();
       if (!selector) {
         return nodeFront;
       }
       nodeFront = await walker.querySelector(nodeFront, selector);
       if (nodeSelectors.length > 0) {
-        let { nodes } = await walker.children(nodeFront);
+        const { nodes } = await walker.children(nodeFront);
         // This is the NodeFront for the document node inside the iframe
         nodeFront = nodes[0];
       }
       return querySelectors(nodeFront);
     }
-    let nodeFront = await walker.getRootNode();
+    const nodeFront = await walker.getRootNode();
     return querySelectors(nodeFront);
   },
 
   /**
    * Called from the DevToolsShim, used by nsContextMenu.js.
    *
    * @param {XULTab} tab
    *        The browser tab on which inspect node was used.
@@ -671,30 +671,30 @@ DevTools.prototype = {
    *        ending with the deepest nested frame.
    * @param {Number} startTime
    *        Optional, indicates the time at which the user event related to this node
    *        inspection started. This is a `Cu.now()` timing.
    * @return {Promise} a promise that resolves when the node is selected in the inspector
    *         markup view.
    */
   async inspectNode(tab, nodeSelectors, startTime) {
-    let target = TargetFactory.forTab(tab);
+    const target = TargetFactory.forTab(tab);
 
-    let toolbox = await gDevTools.showToolbox(target, "inspector", null, null, startTime);
-    let inspector = toolbox.getCurrentPanel();
+    const toolbox = await gDevTools.showToolbox(target, "inspector", null, null, startTime);
+    const inspector = toolbox.getCurrentPanel();
 
     // If the toolbox has been switched into a nested frame, we should first remove
     // selectors according to the frame depth.
     nodeSelectors.splice(0, toolbox.selectedFrameDepth);
 
     // new-node-front tells us when the node has been selected, whether the
     // browser is remote or not.
-    let onNewNode = inspector.selection.once("new-node-front");
+    const onNewNode = inspector.selection.once("new-node-front");
 
-    let nodeFront = await this.findNodeFront(inspector.walker, nodeSelectors);
+    const nodeFront = await this.findNodeFront(inspector.walker, nodeSelectors);
     // Select the final node
     inspector.selection.setNodeFront(nodeFront, { reason: "browser-context-menu" });
 
     await onNewNode;
     // Now that the node has been selected, wait until the inspector is
     // fully updated.
     await inspector.once("inspector-updated");
   },
@@ -710,45 +710,45 @@ DevTools.prototype = {
    *        and not directly in the root document.
    * @param {Number} startTime
    *        Optional, indicates the time at which the user event related to this
    *        node inspection started. This is a `Cu.now()` timing.
    * @return {Promise} a promise that resolves when the accessible object is
    *         selected in the accessibility inspector.
    */
   async inspectA11Y(tab, nodeSelectors, startTime) {
-    let target = TargetFactory.forTab(tab);
+    const target = TargetFactory.forTab(tab);
 
-    let toolbox = await gDevTools.showToolbox(
+    const toolbox = await gDevTools.showToolbox(
       target, "accessibility", null, null, startTime);
-    let nodeFront = await this.findNodeFront(toolbox.walker, nodeSelectors);
+    const nodeFront = await this.findNodeFront(toolbox.walker, nodeSelectors);
     // Select the accessible object in the panel and wait for the event that
     // tells us it has been done.
-    let a11yPanel = toolbox.getCurrentPanel();
-    let onSelected = a11yPanel.once("new-accessible-front-selected");
+    const a11yPanel = toolbox.getCurrentPanel();
+    const onSelected = a11yPanel.once("new-accessible-front-selected");
     a11yPanel.selectAccessibleForNode(nodeFront, "browser-context-menu");
     await onSelected;
   },
 
   /**
    * Either the DevTools Loader has been destroyed or firefox is shutting down.
    * @param {boolean} shuttingDown
    *        True if firefox is currently shutting down. We may prevent doing
    *        some cleanups to speed it up. Otherwise everything need to be
    *        cleaned up in order to be able to load devtools again.
    */
   destroy({ shuttingDown }) {
     // Do not cleanup everything during firefox shutdown.
     if (!shuttingDown) {
-      for (let [, toolbox] of this._toolboxes) {
+      for (const [, toolbox] of this._toolboxes) {
         toolbox.destroy();
       }
     }
 
-    for (let [key, ] of this.getToolDefinitionMap()) {
+    for (const [key, ] of this.getToolDefinitionMap()) {
       this.unregisterTool(key, true);
     }
 
     gDevTools.unregisterDefaults();
 
     removeThemeObserver(this._onThemeChanged);
 
     // Do not unregister devtools from the DevToolsShim if the destroy is caused by an
--- a/devtools/client/framework/gDevTools.jsm
+++ b/devtools/client/framework/gDevTools.jsm
@@ -18,17 +18,17 @@ this.EXPORTED_SYMBOLS = [ "gDevTools", "
 /**
  * Do not directly map to the commonjs modules so that callsites of
  * gDevTools.jsm do not have to do anything to access to the very last version
  * of the module. The `devtools` and `browser` getter are always going to
  * retrieve the very last version of the modules.
  */
 Object.defineProperty(this, "require", {
   get() {
-    let { require } = ChromeUtils.import("resource://devtools/shared/Loader.jsm", {});
+    const { require } = ChromeUtils.import("resource://devtools/shared/Loader.jsm", {});
     return require;
   }
 });
 Object.defineProperty(this, "devtools", {
   get() {
     return require("devtools/client/framework/devtools").gDevTools;
   }
 });
@@ -39,17 +39,17 @@ Object.defineProperty(this, "browser", {
 });
 
 /**
  * gDevTools is a singleton that controls the Firefox Developer Tools.
  *
  * It is an instance of a DevTools class that holds a set of tools. It has the
  * same lifetime as the browser.
  */
-let gDevToolsMethods = [
+const gDevToolsMethods = [
   // Used by: - b2g desktop.js
   //          - nsContextMenu
   //          - /devtools code
   "showToolbox",
 
   // Used by Addon SDK and /devtools
   "closeToolbox",
   "getToolbox",
@@ -97,17 +97,17 @@ gDevToolsMethods.forEach(name => {
     return devtools[name].apply(devtools, args);
   };
 });
 
 /**
  * gDevToolsBrowser exposes functions to connect the gDevTools instance with a
  * Firefox instance.
  */
-let gDevToolsBrowserMethods = [
+const gDevToolsBrowserMethods = [
   // used by browser-sets.inc, command
   "toggleToolboxCommand",
 
   // Used by browser.js itself, by setting a oncommand string...
   "selectToolCommand",
 
   // Used by browser-sets.inc, command
   "openAboutDebugging",
--- a/devtools/client/framework/menu.js
+++ b/devtools/client/framework/menu.js
@@ -77,18 +77,18 @@ Menu.prototype.popupWithZoom = function(
  *   - positioningItem Number - (optional) OS X
  *
  * @param {int} screenX
  * @param {int} screenY
  * @param Toolbox toolbox (non standard)
  *        Needed so we in which window to inject XUL
  */
 Menu.prototype.popup = function(screenX, screenY, toolbox) {
-  let doc = toolbox.doc;
-  let popupset = doc.querySelector("popupset");
+  const doc = toolbox.doc;
+  const popupset = doc.querySelector("popupset");
   // See bug 1285229, on Windows, opening the same popup multiple times in a
   // row ends up duplicating the popup. The newly inserted popup doesn't
   // dismiss the old one. So remove any previously displayed popup before
   // opening a new one.
   let popup = popupset.querySelector("menupopup[menu-api=\"true\"]");
   if (popup) {
     popup.hidePopup();
   }
@@ -116,47 +116,47 @@ Menu.prototype.popup = function(screenX,
     }
   });
 
   popupset.appendChild(popup);
   popup.openPopupAtScreen(screenX, screenY, true);
 };
 
 Menu.prototype._createMenuItems = function(parent) {
-  let doc = parent.ownerDocument;
+  const doc = parent.ownerDocument;
   this.menuitems.forEach(item => {
     if (!item.visible) {
       return;
     }
 
     if (item.submenu) {
-      let menupopup = doc.createElement("menupopup");
+      const menupopup = doc.createElement("menupopup");
       item.submenu._createMenuItems(menupopup);
 
-      let menu = doc.createElement("menu");
+      const menu = doc.createElement("menu");
       menu.appendChild(menupopup);
       menu.setAttribute("label", item.label);
       if (item.disabled) {
         menu.setAttribute("disabled", "true");
       }
       if (item.accelerator) {
         menu.setAttribute("acceltext", item.accelerator);
       }
       if (item.accesskey) {
         menu.setAttribute("accesskey", item.accesskey);
       }
       if (item.id) {
         menu.id = item.id;
       }
       parent.appendChild(menu);
     } else if (item.type === "separator") {
-      let menusep = doc.createElement("menuseparator");
+      const menusep = doc.createElement("menuseparator");
       parent.appendChild(menusep);
     } else {
-      let menuitem = doc.createElement("menuitem");
+      const menuitem = doc.createElement("menuitem");
       menuitem.setAttribute("label", item.label);
       menuitem.addEventListener("command", () => {
         item.click();
       });
       menuitem.addEventListener("DOMMenuItemActive", () => {
         item.hover();
       });
 
--- a/devtools/client/framework/selection.js
+++ b/devtools/client/framework/selection.js
@@ -72,17 +72,17 @@ Selection.prototype = {
   _walker: null,
 
   _onMutations: function(mutations) {
     let attributeChange = false;
     let pseudoChange = false;
     let detached = false;
     let parentNode = null;
 
-    for (let m of mutations) {
+    for (const m of mutations) {
       if (!attributeChange && m.type == "attributes") {
         attributeChange = true;
       }
       if (m.type == "childList") {
         if (!detached && !this.isConnected()) {
           if (this.isNode()) {
             parentNode = m.target;
           }
@@ -130,17 +130,17 @@ Selection.prototype = {
    *          the "new-node-front" event.
    *        - {Boolean} isSlotted: Is the selection representing the slotted version of
    *          the node.
    */
   setNodeFront: function(nodeFront, { reason = "unknown", isSlotted = false} = {}) {
     this.reason = reason;
 
     // If an inlineTextChild text node is being set, then set it's parent instead.
-    let parentNode = nodeFront && nodeFront.parentNode();
+    const parentNode = nodeFront && nodeFront.parentNode();
     if (nodeFront && parentNode && parentNode.inlineTextChild === nodeFront) {
       nodeFront = parentNode;
     }
 
     this._isSlotted = isSlotted;
     this._nodeFront = nodeFront;
     this.emit("new-node-front", nodeFront, this.reason);
   },
@@ -174,17 +174,17 @@ Selection.prototype = {
         return true;
       }
       node = node.parentNode();
     }
     return false;
   },
 
   isHTMLNode: function() {
-    let xhtmlNs = "http://www.w3.org/1999/xhtml";
+    const xhtmlNs = "http://www.w3.org/1999/xhtml";
     return this.isNode() && this.nodeFront.namespaceURI == xhtmlNs;
   },
 
   // Node type
 
   isElementNode: function() {
     return this.isNode() && this.nodeFront.nodeType == nodeConstants.ELEMENT_NODE;
   },
--- a/devtools/client/framework/sidebar.js
+++ b/devtools/client/framework/sidebar.js
@@ -63,17 +63,17 @@ function ToolSidebar(tabbox, panel, uid,
   this._uid = uid;
   this._panelDoc = this._tabbox.ownerDocument;
   this._toolPanel = panel;
   this._options = options;
 
   this._onTabBoxOverflow = this._onTabBoxOverflow.bind(this);
   this._onTabBoxUnderflow = this._onTabBoxUnderflow.bind(this);
 
-  let width = Services.prefs.getIntPref("devtools.toolsidebar-width." + this._uid, undefined);
+  const width = Services.prefs.getIntPref("devtools.toolsidebar-width." + this._uid, undefined);
   if (width) {
     this._width = width;
   }
 
   if (!options.disableTelemetry) {
     this._telemetry = new Telemetry();
   }
 
@@ -110,20 +110,20 @@ ToolSidebar.prototype = {
    * true, this is already done automatically. If not, you may call this
    * function at any time to add the menu.
    */
   addAllTabsMenu: function() {
     if (this._allTabsBtn) {
       return;
     }
 
-    let tabs = this._tabbox.tabs;
+    const tabs = this._tabbox.tabs;
 
     // Create a container and insert it first in the tabbox
-    let allTabsContainer = this._panelDoc.createElementNS(XULNS, "stack");
+    const allTabsContainer = this._panelDoc.createElementNS(XULNS, "stack");
     this._tabbox.insertBefore(allTabsContainer, tabs);
 
     // Move the tabs inside and make them flex
     allTabsContainer.appendChild(tabs);
     tabs.setAttribute("flex", "1");
 
     // Create the dropdown menu next to the tabs
     this._allTabsBtn = this._panelDoc.createElementNS(XULNS, "toolbarbutton");
@@ -132,41 +132,41 @@ ToolSidebar.prototype = {
     this._allTabsBtn.setAttribute("top", "0");
     this._allTabsBtn.setAttribute("width", "15");
     this._allTabsBtn.setAttribute("type", "menu");
     this._allTabsBtn.setAttribute("tooltiptext",
       L10N.getStr("sidebar.showAllTabs.tooltip"));
     this._allTabsBtn.setAttribute("hidden", "true");
     allTabsContainer.appendChild(this._allTabsBtn);
 
-    let menuPopup = this._panelDoc.createElementNS(XULNS, "menupopup");
+    const menuPopup = this._panelDoc.createElementNS(XULNS, "menupopup");
     this._allTabsBtn.appendChild(menuPopup);
 
     // Listening to tabs overflow event to toggle the alltabs button
     tabs.addEventListener("overflow", this._onTabBoxOverflow);
     tabs.addEventListener("underflow", this._onTabBoxUnderflow);
 
     // Add menuitems to the alltabs menu if there are already tabs in the
     // sidebar
-    for (let [id, tab] of this._tabs) {
-      let item = this._addItemToAllTabsMenu(id, tab, {
+    for (const [id, tab] of this._tabs) {
+      const item = this._addItemToAllTabsMenu(id, tab, {
         selected: tab.hasAttribute("selected")
       });
       if (tab.hidden) {
         item.hidden = true;
       }
     }
   },
 
   removeAllTabsMenu: function() {
     if (!this._allTabsBtn) {
       return;
     }
 
-    let tabs = this._tabbox.tabs;
+    const tabs = this._tabbox.tabs;
 
     tabs.removeEventListener("overflow", this._onTabBoxOverflow);
     tabs.removeEventListener("underflow", this._onTabBoxUnderflow);
 
     // Moving back the tabs as a first child of the tabbox
     this._tabbox.insertBefore(tabs, this._tabbox.tabpanels);
     this._tabbox.querySelector("stack").remove();
 
@@ -184,31 +184,31 @@ ToolSidebar.prototype = {
   /**
    * Add an item in the allTabs menu for a given tab.
    */
   _addItemToAllTabsMenu: function(id, tab, options) {
     if (!this._allTabsBtn) {
       return;
     }
 
-    let item = this._panelDoc.createElementNS(XULNS, "menuitem");
-    let idPrefix = "sidebar-alltabs-item-";
+    const item = this._panelDoc.createElementNS(XULNS, "menuitem");
+    const idPrefix = "sidebar-alltabs-item-";
     item.setAttribute("id", idPrefix + id);
     item.setAttribute("label", tab.getAttribute("label"));
     item.setAttribute("type", "checkbox");
     if (options.selected) {
       item.setAttribute("checked", true);
     }
     // The auto-checking of menuitems in this menu doesn't work, so let's do
     // it manually
     item.setAttribute("autocheck", false);
 
-    let menu = this._allTabsBtn.querySelector("menupopup");
+    const menu = this._allTabsBtn.querySelector("menupopup");
     if (options.insertBefore) {
-      let referenceItem = menu.querySelector(`#${idPrefix}${options.insertBefore}`);
+      const referenceItem = menu.querySelector(`#${idPrefix}${options.insertBefore}`);
       menu.insertBefore(item, referenceItem);
     } else {
       menu.appendChild(item);
     }
 
     item.addEventListener("click", () => {
       this._tabbox.selectedTab = tab;
     });
@@ -225,64 +225,64 @@ ToolSidebar.prototype = {
    * @param {string} id The unique id for this tab.
    * @param {string} url The URL of the document to load in this new tab.
    * @param {Object} options A set of options for this new tab:
    * - {Boolean} selected Set to true to make this new tab selected by default.
    * - {String} insertBefore By default, the new tab is appended at the end of the
    * tabbox, pass the ID of an existing tab to insert it before that tab instead.
    */
   addTab: function(id, url, options = {}) {
-    let iframe = this._panelDoc.createElementNS(XULNS, "iframe");
+    const iframe = this._panelDoc.createElementNS(XULNS, "iframe");
     iframe.className = "iframe-" + id;
     iframe.setAttribute("flex", "1");
     iframe.setAttribute("src", url);
     iframe.tooltip = "aHTMLTooltip";
 
     // Creating the tab and adding it to the tabbox
-    let tab = this._panelDoc.createElementNS(XULNS, "tab");
+    const tab = this._panelDoc.createElementNS(XULNS, "tab");
 
     tab.setAttribute("id", this.TAB_ID_PREFIX + id);
     tab.setAttribute("crop", "end");
     // Avoid showing "undefined" while the tab is loading
     tab.setAttribute("label", "");
 
     if (options.insertBefore) {
-      let referenceTab = this.getTab(options.insertBefore);