--- a/.eslintignore
+++ b/.eslintignore
@@ -111,44 +111,41 @@ devtools/client/shared/components/test/m
 devtools/client/shared/shim/test/test_*.html
 devtools/client/shared/test/browser_toolbar_webconsole_errors_count.html
 devtools/client/storage/test/*.html
 !devtools/client/storage/test/storage-cookies.html
 !devtools/client/storage/test/storage-overflow.html
 !devtools/client/storage/test/storage-search.html
 !devtools/client/storage/test/storage-unsecured-iframe.html
 !devtools/client/storage/test/storage-unsecured-iframe-usercontextid.html
-devtools/client/webaudioeditor/**
-devtools/client/webconsole/old/net/**
-!devtools/client/webconsole/test/mochitest/**
-devtools/client/webconsole/old/test/**
-devtools/client/webconsole/old/webconsole.js
-devtools/client/webide/**
-!devtools/client/webide/components/webideCli.js
 devtools/server/tests/browser/storage-*.html
 !devtools/server/tests/browser/storage-unsecured-iframe.html
 devtools/server/tests/browser/stylesheets-nested-iframes.html
-devtools/server/tests/unit/xpcshell_debugging_script.js
 devtools/client/shared/webpack/shims/test/test_clipboard.html
 devtools/shared/qrcode/tests/mochitest/test_decode.html
 devtools/shared/tests/mochitest/*.html
 devtools/shared/webconsole/test/test_*.html
 
 # Soon to be removed
 devtools/client/commandline/**
 # Soon to be removed, the new/ directory is explicitly excluded below due to
 # also being an imported repository.
 devtools/client/debugger/**
+# Soon to be removed
+devtools/client/webconsole/old/net/**
+devtools/client/webconsole/old/test/**
+devtools/client/webconsole/old/webconsole.js
 
 # Ignore devtools imported repositories
 devtools/client/debugger/new/**
 devtools/client/shared/components/reps/**
 
 # Ignore devtools preferences files
 devtools/client/preferences/**
+devtools/client/webide/preferences/**
 devtools/shared/preferences/**
 devtools/startup/preferences/devtools-startup.js
 
 # Ignore devtools third-party libs
 devtools/shared/jsbeautify/*
 devtools/shared/acorn/*
 devtools/shared/gcli/source/*
 devtools/shared/node-properties/*
@@ -175,16 +172,19 @@ devtools/client/framework/test/code_*
 devtools/client/inspector/markup/test/events_bundle.js
 devtools/client/netmonitor/test/xhr_bundle.js
 devtools/client/webconsole/test/mochitest/code_bundle_nosource.js
 devtools/client/webconsole/test/mochitest/code_bundle_invalidmap.js
 devtools/server/tests/unit/babel_and_browserify_script_with_source_map.js
 devtools/server/tests/unit/setBreakpoint*
 devtools/server/tests/unit/sourcemapped.js
 
+# devtools specific format test file
+devtools/server/tests/unit/xpcshell_debugging_script.js
+
 # dom/ exclusions
 dom/abort/**
 dom/animation/**
 dom/archivereader/**
 dom/asmjscache/**
 dom/audiochannel/**
 dom/base/**
 dom/battery/**
@@ -338,17 +338,16 @@ security/nss/**
 # Uses `#filter substitution`
 services/sync/modules/constants.js
 services/sync/services-sync.js
 
 # Servo is imported.
 servo/**
 
 # Remote protocol exclusions
-testing/marionette/test_*.js
 testing/marionette/atom.js
 testing/marionette/legacyaction.js
 testing/marionette/client
 testing/marionette/doc
 testing/marionette/harness
 
 # other testing/ exclusions
 testing/mochitest/**

--- a/browser/base/content/browser.js
+++ b/browser/base/content/browser.js
@@ -494,18 +494,17 @@ const gSessionHistoryObserver = {
     gURLBar.editor.transactionManager.clear();
   }
 };
 
 const gStoragePressureObserver = {
   _lastNotificationTime: -1,
 
   observe(subject, topic, data) {
-    if (topic != "QuotaManager::StoragePressure" ||
-        !Services.prefs.getBoolPref("browser.storageManager.enabled")) {
+    if (topic != "QuotaManager::StoragePressure") {
       return;
     }
 
     const NOTIFICATION_VALUE = "storage-pressure-notification";
     let notificationBox = document.getElementById("high-priority-global-notificationbox");
     if (notificationBox.getNotificationWithValue(NOTIFICATION_VALUE)) {
       // Do not display the 2nd notification when there is already one
       return;

--- a/browser/base/content/test/general/browser_storagePressure_notification.js
+++ b/browser/base/content/test/general/browser_storagePressure_notification.js
@@ -18,17 +18,16 @@ function openAboutPrefPromise() {
     TestUtils.topicObserved("privacy-pane-loaded", () => true)
   ];
   return Promise.all(promises);
 }
 
 // Test only displaying notification once within the given interval
 add_task(async function() {
   const TEST_NOTIFICATION_INTERVAL_MS = 2000;
-  await SpecialPowers.pushPrefEnv({set: [["browser.storageManager.enabled", true]]});
   await SpecialPowers.pushPrefEnv({set: [["browser.storageManager.pressureNotification.minIntervalMS", TEST_NOTIFICATION_INTERVAL_MS]]});
   // Commenting this to see if we really need it
   // await SpecialPowers.pushPrefEnv({set: [["privacy.reduceTimerPrecision", false]]});
 
   await notifyStoragePressure();
   let notificationbox = document.getElementById("high-priority-global-notificationbox");
   let notification = notificationbox.getNotificationWithValue("storage-pressure-notification");
   ok(notification instanceof XULElement, "Should display storage pressure notification");
@@ -42,17 +41,16 @@ add_task(async function() {
   await notifyStoragePressure();
   notification = notificationbox.getNotificationWithValue("storage-pressure-notification");
   ok(notification instanceof XULElement, "Should display storage pressure notification after the given interval");
   notification.close();
 });
 
 // Test guiding user to the about:preferences when usage exceeds the given threshold
 add_task(async function() {
-  await SpecialPowers.pushPrefEnv({ set: [["browser.storageManager.enabled", true]] });
   await SpecialPowers.pushPrefEnv({ set: [["browser.storageManager.pressureNotification.minIntervalMS", 0]] });
   let tab = await BrowserTestUtils.openNewForegroundTab(gBrowser, "https://example.com");
 
   const BYTES_IN_GIGABYTE = 1073741824;
   const USAGE_THRESHOLD_BYTES = BYTES_IN_GIGABYTE *
     Services.prefs.getIntPref("browser.storageManager.pressureNotification.usageThresholdGB");
   await notifyStoragePressure(USAGE_THRESHOLD_BYTES);
   let notificationbox = document.getElementById("high-priority-global-notificationbox");
@@ -69,17 +67,16 @@ add_task(async function() {
   is_element_visible(siteDataGroup, "Should open to the siteDataGroup section in about:preferences");
   BrowserTestUtils.removeTab(aboutPrefTab);
   BrowserTestUtils.removeTab(tab);
 });
 
 // Test not displaying the 2nd notification if one is already being displayed
 add_task(async function() {
   const TEST_NOTIFICATION_INTERVAL_MS = 0;
-  await SpecialPowers.pushPrefEnv({set: [["browser.storageManager.enabled", true]]});
   await SpecialPowers.pushPrefEnv({set: [["browser.storageManager.pressureNotification.minIntervalMS", TEST_NOTIFICATION_INTERVAL_MS]]});
 
   await notifyStoragePressure();
   await notifyStoragePressure();
   let notificationbox = document.getElementById("high-priority-global-notificationbox");
   let allNotifications = notificationbox.allNotifications;
   let pressureNotificationCount = 0;
   allNotifications.forEach(notification => {

--- a/browser/components/customizableui/CustomizableWidgets.jsm
+++ b/browser/components/customizableui/CustomizableWidgets.jsm
@@ -739,17 +739,19 @@ if (Services.prefs.getBoolPref("identity
       item.setAttribute("class", "subviewbutton");
       item.setAttribute("targetURI", tabInfo.url);
       item.setAttribute("label", tabInfo.title != "" ? tabInfo.title : tabInfo.url);
       item.setAttribute("image", tabInfo.icon);
       item.setAttribute("tooltiptext", tooltipText);
       // We need to use "click" instead of "command" here so openUILink
       // respects different buttons (eg, to open in a new tab).
       item.addEventListener("click", e => {
-        doc.defaultView.openWebLinkIn(tabInfo.url, e);
+        doc.defaultView.openUILink(tabInfo.url, e, {
+          triggeringPrincipal: Services.scriptSecurityManager.createNullPrincipal({})
+        });
         if (doc.defaultView.whereToOpenLink(e) != "current") {
           e.preventDefault();
           e.stopPropagation();
         } else {
           CustomizableUI.hidePanelForNode(item);
         }
         BrowserUITelemetry.countSyncedTabEvent("open", "toolbarbutton-subview");
       });

--- a/browser/components/customizableui/test/browser_synced_tabs_menu.js
+++ b/browser/components/customizableui/test/browser_synced_tabs_menu.js
@@ -14,16 +14,18 @@ ChromeUtils.defineModuleGetter(this, "UI
 
 // These are available on the widget implementation, but it seems impossible
 // to grab that impl at runtime.
 const DECKINDEX_TABS = 0;
 const DECKINDEX_TABSDISABLED = 1;
 const DECKINDEX_FETCHING = 2;
 const DECKINDEX_NOCLIENTS = 3;
 
+const SAMPLE_TAB_URL = "https://example.com/";
+
 var initialLocation = gBrowser.currentURI.spec;
 var newTab = null;
 
 // A helper to notify there are new tabs. Returns a promise that is resolved
 // once the UI has been updated.
 function updateTabsPanel() {
   let promiseTabsUpdated = promiseObserverNotified("synced-tabs-menu:test:tabs-updated");
   Services.obs.notifyObservers(null, SyncedTabs.TOPIC_TABS_CHANGED);
@@ -330,24 +332,25 @@ add_task(async function() {
         name: "My Desktop",
         lastModified: 1492201200,
         tabs: function() {
           let allTabsDesktop = [];
           // We choose 77 tabs, because TABS_PER_PAGE is 25, which means
           // on the second to last page we should have 22 items shown
           // (because we have to show at least NEXT_PAGE_MIN_TABS=5 tabs on the last page)
           for (let i = 1; i <= 77; i++) {
-            allTabsDesktop.push({ title: "Tab #" + i });
+            allTabsDesktop.push({ title: "Tab #" + i, url: SAMPLE_TAB_URL });
           }
           return allTabsDesktop;
         }(),
       }
     ]);
   };
 
+
   gSync.updateAllUI({ status: UIState.STATUS_SIGNED_IN, lastSync: new Date(),
                       email: "foo@bar.com" });
 
   await document.getElementById("nav-bar").overflowable.show();
   let tabsUpdatedPromise = promiseObserverNotified("synced-tabs-menu:test:tabs-updated");
   let syncPanel = document.getElementById("PanelUI-remotetabs");
   let viewShownPromise = BrowserTestUtils.waitForEvent(syncPanel, "ViewShown");
   let syncButton = document.getElementById("sync-button");
@@ -365,29 +368,38 @@ add_task(async function() {
     let tabList = document.getElementById("PanelUI-remotetabs-tabslist");
     let node = tabList.firstChild;
     is(node.getAttribute("itemtype"), "client", "node is a client entry");
     is(node.textContent, "My Desktop", "correct client");
     for (let i = 0; i < tabsShownCount; i++) {
       node = node.nextSibling;
       is(node.getAttribute("itemtype"), "tab", "node is a tab");
       is(node.getAttribute("label"), "Tab #" + (i + 1), "the tab is the correct one");
+      is(node.getAttribute("targetURI"), SAMPLE_TAB_URL, "url is the correct one");
     }
     let showMoreButton;
     if (showMoreLabel) {
       node = showMoreButton = node.nextSibling;
       is(node.getAttribute("itemtype"), "showmorebutton", "node is a show more button");
       is(node.getAttribute("label"), showMoreLabel);
     }
     node = node.nextSibling;
     is(node, null, "no more entries");
 
     return showMoreButton;
   }
 
+  async function checkCanOpenURL() {
+    let tabList = document.getElementById("PanelUI-remotetabs-tabslist");
+    let node = tabList.firstChild.nextSibling;
+    let promiseTabOpened = BrowserTestUtils.waitForLocationChange(gBrowser, SAMPLE_TAB_URL);
+    node.click();
+    await promiseTabOpened;
+  }
+
   let showMoreButton;
   function clickShowMoreButton() {
     let promise = promiseObserverNotified("synced-tabs-menu:test:tabs-updated");
     showMoreButton.click();
     return promise;
   }
 
   showMoreButton = checkTabsPage(25, "Show More");
@@ -395,11 +407,11 @@ add_task(async function() {
 
   showMoreButton = checkTabsPage(50, "Show More");
   await clickShowMoreButton();
 
   showMoreButton = checkTabsPage(72, "Show All");
   await clickShowMoreButton();
 
   checkTabsPage(77, null);
-
-  await hideOverflow();
+  /* calling this will close the overflow menu */
+  await checkCanOpenURL();
 });

--- a/browser/components/extensions/ExtensionPopups.jsm
+++ b/browser/components/extensions/ExtensionPopups.jsm
@@ -363,17 +363,17 @@ class BasePopup {
     // of the extension content. Passing `null` should be treated the same as no argument,
     // which is why we can't use default parameters here.
     if (!background) {
       background = "#fff";
     }
     this.panel.style.setProperty("--arrowpanel-background", background);
     if (background == "#fff") {
       // Set a usable default color that work with the default background-color.
-      this.panel.style.setProperty("--arrowpanel-border-color", "hsla(210,4%,10%,.05)");
+      this.panel.style.setProperty("--arrowpanel-border-color", "hsla(210,4%,10%,.15)");
     }
     this.background = background;
   }
 }
 
 /**
  * A map of active popups for a given browser window.
  *

--- a/browser/components/nsBrowserGlue.js
+++ b/browser/components/nsBrowserGlue.js
@@ -2762,19 +2762,17 @@ const ContentPermissionIntegration = {
     switch (type) {
       case "geolocation": {
         return new PermissionUI.GeolocationPermissionPrompt(request);
       }
       case "desktop-notification": {
         return new PermissionUI.DesktopNotificationPermissionPrompt(request);
       }
       case "persistent-storage": {
-        if (Services.prefs.getBoolPref("browser.storageManager.enabled")) {
-          return new PermissionUI.PersistentStoragePermissionPrompt(request);
-        }
+        return new PermissionUI.PersistentStoragePermissionPrompt(request);
       }
       case "midi": {
         return new PermissionUI.MIDIPermissionPrompt(request);
       }
     }
     return undefined;
   },
 };

--- a/browser/components/preferences/in-content/privacy.js
+++ b/browser/components/preferences/in-content/privacy.js
@@ -332,35 +332,31 @@ var gPrivacyPane = {
       document.l10n.setAttributes(checkbox, "permissions-notification-pause");
       if (AlertsServiceDND.manualDoNotDisturb) {
         let notificationsDoNotDisturb =
           document.getElementById("notificationsDoNotDisturb");
         notificationsDoNotDisturb.setAttribute("checked", true);
       }
     }
 
-    if (Services.prefs.getBoolPref("browser.storageManager.enabled")) {
-      Services.obs.addObserver(this, "sitedatamanager:sites-updated");
-      Services.obs.addObserver(this, "sitedatamanager:updating-sites");
-      let unload = () => {
-        window.removeEventListener("unload", unload);
-        Services.obs.removeObserver(this, "sitedatamanager:sites-updated");
-        Services.obs.removeObserver(this, "sitedatamanager:updating-sites");
-      };
-      window.addEventListener("unload", unload);
-      SiteDataManager.updateSites();
-      setEventListener("clearSiteDataButton", "command",
-        gPrivacyPane.clearSiteData);
-      setEventListener("siteDataSettings", "command",
-        gPrivacyPane.showSiteDataSettings);
-      let url = Services.urlFormatter.formatURLPref("app.support.baseURL") + "storage-permissions";
-      document.getElementById("siteDataLearnMoreLink").setAttribute("href", url);
-      let siteDataGroup = document.getElementById("siteDataGroup");
-      siteDataGroup.removeAttribute("data-hidden-from-search");
-    }
+    Services.obs.addObserver(this, "sitedatamanager:sites-updated");
+    Services.obs.addObserver(this, "sitedatamanager:updating-sites");
+    let unload = () => {
+      window.removeEventListener("unload", unload);
+      Services.obs.removeObserver(this, "sitedatamanager:sites-updated");
+      Services.obs.removeObserver(this, "sitedatamanager:updating-sites");
+    };
+    window.addEventListener("unload", unload);
+    SiteDataManager.updateSites();
+    setEventListener("clearSiteDataButton", "command",
+      gPrivacyPane.clearSiteData);
+    setEventListener("siteDataSettings", "command",
+      gPrivacyPane.showSiteDataSettings);
+    let url = Services.urlFormatter.formatURLPref("app.support.baseURL") + "storage-permissions";
+    document.getElementById("siteDataLearnMoreLink").setAttribute("href", url);
 
     let notificationInfoURL =
       Services.urlFormatter.formatURLPref("app.support.baseURL") + "push";
     document.getElementById("notificationPermissionsLearnMore").setAttribute("href",
       notificationInfoURL);
     let drmInfoURL =
       Services.urlFormatter.formatURLPref("app.support.baseURL") + "drm-content";
     document.getElementById("playDRMContentLink").setAttribute("href", drmInfoURL);

--- a/browser/components/preferences/in-content/privacy.xul
+++ b/browser/components/preferences/in-content/privacy.xul
@@ -155,17 +155,17 @@
               class="accessory-button"
               icon="clear"
               data-l10n-id="history-clear-button"/>
     </vbox>
   </hbox>
 </groupbox>
 
 <!-- Site Data -->
-<groupbox id="siteDataGroup" hidden="true" data-category="panePrivacy" data-hidden-from-search="true">
+<groupbox id="siteDataGroup" data-category="panePrivacy">
   <caption><label data-l10n-id="sitedata-header"/></caption>
 
   <hbox data-subcategory="sitedata" align="baseline">
     <vbox flex="1">
       <description class="description-with-side-element" flex="1">
         <html:span id="totalSiteDataSize" class="tail-with-learn-more"></html:span>
         <label id="siteDataLearnMoreLink"
           class="learnMore text-link" data-l10n-id="sitedata-learn-more"/>

--- a/browser/components/preferences/in-content/tests/browser_bug731866.js
+++ b/browser/components/preferences/in-content/tests/browser_bug731866.js
@@ -1,15 +1,14 @@
 /* Any copyright is dedicated to the Public Domain.
  * http://creativecommons.org/publicdomain/zero/1.0/ */
 
 ChromeUtils.import("resource://gre/modules/PlacesUtils.jsm");
 ChromeUtils.import("resource://gre/modules/NetUtil.jsm");
 
-const storageManagerDisabled = !SpecialPowers.getBoolPref("browser.storageManager.enabled");
 const browserContainersGroupDisabled = !SpecialPowers.getBoolPref("privacy.userContext.ui.enabled");
 
 function test() {
   waitForExplicitFinish();
   open_preferences(runTest);
 }
 
 var gElements;
@@ -17,24 +16,17 @@ var gElements;
 function checkElements(expectedPane) {
   for (let element of gElements) {
     // keyset elements fail is_element_visible checks because they are never visible.
     // special-case the drmGroup item because its visibility depends on pref + OS version
     if (element.nodeName == "keyset" ||
         element.id === "drmGroup") {
       continue;
     }
-    // The siteDataGroup in the Storage Management project is currently only pref-on on Nightly for testing purpose.
-    // During the test and the transition period, we have to check the pref to see if the siteDataGroup
-    // should be hidden always. This would be a bit bothersome, same as the offlineGroup as below.
-    // However, this checking is necessary to make sure we don't leak the siteDataGroup into beta/release build
-    if (element.id == "siteDataGroup" && storageManagerDisabled) {
-      is_element_hidden(element, "Disabled siteDataGroup should be hidden");
-      continue;
-    }
+
     // The browserContainersGroup is still only pref-on on Nightly
     if (element.id == "browserContainersGroup" && browserContainersGroupDisabled) {
       is_element_hidden(element, "Disabled browserContainersGroup should be hidden");
       continue;
     }
 
     let attributeValue = element.getAttribute("data-category");
     let suffix = " (id=" + element.id + ")";

--- a/browser/components/preferences/in-content/tests/browser_search_subdialogs_within_preferences_3.js
+++ b/browser/components/preferences/in-content/tests/browser_search_subdialogs_within_preferences_3.js
@@ -1,17 +1,16 @@
 /*
 * This file contains tests for the Preferences search bar.
 */
 
 // Enabling Searching functionatily. Will display search bar form this testcase forward.
 add_task(async function() {
   await SpecialPowers.pushPrefEnv({"set": [
-    ["browser.preferences.search", true],
-    ["browser.storageManager.enabled", true]
+    ["browser.preferences.search", true]
   ]});
 });
 
 /**
  * Test for searching for the "Allowed Sites - Add-ons Installation" subdialog.
  */
 add_task(async function() {
   await openPreferencesViaOpenPreferencesAPI("paneGeneral", {leaveOpen: true});

--- a/browser/components/preferences/in-content/tests/browser_search_subdialogs_within_preferences_7.js
+++ b/browser/components/preferences/in-content/tests/browser_search_subdialogs_within_preferences_7.js
@@ -2,18 +2,17 @@
 * This file contains tests for the Preferences search bar.
 */
 
 requestLongerTimeout(2);
 
 // Enabling Searching functionatily. Will display search bar form this testcase forward.
 add_task(async function() {
   await SpecialPowers.pushPrefEnv({"set": [
-    ["browser.preferences.search", true],
-    ["browser.storageManager.enabled", true]
+    ["browser.preferences.search", true]
   ]});
 });
 
 /**
  * Test for searching for the "Device Manager" subdialog.
  */
 add_task(async function() {
   await openPreferencesViaOpenPreferencesAPI("paneGeneral", {leaveOpen: true});

--- a/browser/components/preferences/in-content/tests/browser_search_within_preferences_1.js
+++ b/browser/components/preferences/in-content/tests/browser_search_within_preferences_1.js
@@ -208,59 +208,16 @@ add_task(async function exiting_search_r
 
   // Checks if back to normal
   is_element_visible(generalPane, "Should be in generalPane");
 
   BrowserTestUtils.removeTab(gBrowser.selectedTab);
 });
 
 /**
- * Test for "Site Data" case, verifying elements with data-hidden-from-search = true
- * are hidden in search result.
- */
-add_task(async function verify_hidden_from_search_elements_dont_show_up() {
-  await SpecialPowers.pushPrefEnv({ "set": [["browser.storageManager.enabled", false]] });
-  await openPreferencesViaOpenPreferencesAPI("privacy", { leaveOpen: true });
-  let generalPane = gBrowser.contentDocument.getElementById("generalCategory");
-
-  is_element_hidden(generalPane, "Should not be in general");
-
-  // Performs search
-  let searchInput = gBrowser.contentDocument.getElementById("searchInput");
-
-  is(searchInput, gBrowser.contentDocument.activeElement.closest("#searchInput"),
-    "Search input should be focused when visiting preferences");
-
-  let query = "site data";
-  let searchCompletedPromise = BrowserTestUtils.waitForEvent(
-    gBrowser.contentWindow, "PreferencesSearchCompleted", evt => evt.detail == query);
-  EventUtils.sendString(query);
-  await searchCompletedPromise;
-
-  let mainPrefTag = gBrowser.contentDocument.getElementById("mainPrefPane");
-
-  let child = mainPrefTag.querySelector("#siteDataGroup");
-  is_element_hidden(child, "Should be hidden in search results");
-
-  // Takes search off
-  searchCompletedPromise = BrowserTestUtils.waitForEvent(
-    gBrowser.contentWindow, "PreferencesSearchCompleted", evt => evt.detail == "");
-  let count = query.length;
-  while (count--) {
-    EventUtils.sendKey("BACK_SPACE");
-  }
-  await searchCompletedPromise;
-
-  // Checks if back to normal
-  is_element_visible(generalPane, "Should be in generalPane");
-
-  BrowserTestUtils.removeTab(gBrowser.selectedTab);
-});
-
-/**
  * Test for if we go to another tab after searching
  */
 add_task(async function changing_tabs_after_searching() {
   await openPreferencesViaOpenPreferencesAPI("paneGeneral", { leaveOpen: true });
   let searchInput = gBrowser.contentDocument.getElementById("searchInput");
 
   is(searchInput, gBrowser.contentDocument.activeElement.closest("#searchInput"),
     "Search input should be focused when visiting preferences");

--- a/browser/components/preferences/in-content/tests/browser_search_within_preferences_command.js
+++ b/browser/components/preferences/in-content/tests/browser_search_within_preferences_command.js
@@ -1,15 +1,14 @@
 "use strict";
 
 /**
  * Test for "command" event on search input (when user clicks the x button)
  */
 add_task(async function() {
-  await SpecialPowers.pushPrefEnv({"set": [["browser.storageManager.enabled", false]]});
   await openPreferencesViaOpenPreferencesAPI("privacy", {leaveOpen: true});
   let generalPane = gBrowser.contentDocument.getElementById("generalCategory");
 
   is_element_hidden(generalPane, "Should not be in general");
 
   // Performs search
   let searchInput = gBrowser.contentDocument.getElementById("searchInput");
   is(searchInput, gBrowser.contentDocument.activeElement.closest("#searchInput"),

--- a/browser/modules/SitePermissions.jsm
+++ b/browser/modules/SitePermissions.jsm
@@ -679,22 +679,16 @@ var gPermissionObject = {
     exactHostMatch: true
   },
 
   "midi-sysex": {
     exactHostMatch: true
   }
 };
 
-// Delete this entry while being pre-off
-// or the persistent-storage permission would appear in Page info's Permission section
-if (!Services.prefs.getBoolPref("browser.storageManager.enabled")) {
-  delete gPermissionObject["persistent-storage"];
-}
-
 if (!Services.prefs.getBoolPref("dom.webmidi.enabled")) {
   // ESLint gets angry about array versus dot notation here, but some permission
   // names use hyphens. Disabling rule for line to keep things consistent.
   // eslint-disable-next-line dot-notation
   delete gPermissionObject["midi"];
   delete gPermissionObject["midi-sysex"];
 }
 

--- a/browser/modules/test/unit/test_SitePermissions.js
+++ b/browser/modules/test/unit/test_SitePermissions.js
@@ -1,29 +1,23 @@
 /* Any copyright is dedicated to the Public Domain.
  * http://creativecommons.org/publicdomain/zero/1.0/
  */
 "use strict";
 
 ChromeUtils.import("resource:///modules/SitePermissions.jsm");
 ChromeUtils.import("resource://gre/modules/Services.jsm");
 
-const STORAGE_MANAGER_ENABLED = Services.prefs.getBoolPref("browser.storageManager.enabled");
 const RESIST_FINGERPRINTING_ENABLED = Services.prefs.getBoolPref("privacy.resistFingerprinting");
 const MIDI_ENABLED = Services.prefs.getBoolPref("dom.webmidi.enabled");
 
 add_task(async function testPermissionsListing() {
   let expectedPermissions = ["camera", "cookie", "desktop-notification", "focus-tab-by-prompt",
-     "geo", "image", "install", "microphone", "plugin:flash", "popup", "screen", "shortcuts"];
-  if (STORAGE_MANAGER_ENABLED) {
-    // The persistent-storage permission is still only pref-on on Nightly
-    // so we add it only when it's pref-on.
-    // Should remove this checking and add it as default after it is fully pref-on.
-    expectedPermissions.push("persistent-storage");
-  }
+     "geo", "image", "install", "microphone", "plugin:flash", "popup", "screen", "shortcuts",
+     "persistent-storage"];
   if (RESIST_FINGERPRINTING_ENABLED) {
     // Canvas permission should be hidden unless privacy.resistFingerprinting
     // is true.
     expectedPermissions.push("canvas");
   }
   if (MIDI_ENABLED) {
     // Should remove this checking and add it as default after it is fully pref'd-on.
     expectedPermissions.push("midi");
@@ -108,23 +102,17 @@ add_task(async function testGetAvailable
                      SitePermissions.BLOCK ]);
 });
 
 add_task(async function testExactHostMatch() {
   let uri = Services.io.newURI("https://example.com");
   let subUri = Services.io.newURI("https://test1.example.com");
 
   let exactHostMatched = ["desktop-notification", "focus-tab-by-prompt", "camera",
-                          "microphone", "screen", "geo"];
-  if (STORAGE_MANAGER_ENABLED) {
-    // The persistent-storage permission is still only pref-on on Nightly
-    // so we add it only when it's pref-on.
-    // Should remove this checking and add it as default after it is fully pref-on.
-    exactHostMatched.push("persistent-storage");
-  }
+                          "microphone", "screen", "geo", "persistent-storage"];
   if (RESIST_FINGERPRINTING_ENABLED) {
     // Canvas permission should be hidden unless privacy.resistFingerprinting
     // is true.
     exactHostMatched.push("canvas");
   }
   if (MIDI_ENABLED) {
     // WebMIDI is only pref'd on in nightly.
     // Should remove this checking and add it as default after it is fully pref-on.

--- a/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/PermissionPrompts.jsm
+++ b/browser/tools/mozscreenshots/mozscreenshots/extension/configurations/PermissionPrompts.jsm
@@ -11,17 +11,16 @@ ChromeUtils.import("resource://gre/modul
 ChromeUtils.import("resource://testing-common/ContentTask.jsm");
 ChromeUtils.import("resource://testing-common/BrowserTestUtils.jsm");
 
 const URL = "https://test1.example.com/browser/browser/tools/mozscreenshots/mozscreenshots/extension/mozscreenshots/browser/chrome/mozscreenshots/lib/permissionPrompts.html";
 let lastTab = null;
 
 var PermissionPrompts = {
   init(libDir) {
-    Services.prefs.setBoolPref("browser.storageManager.enabled", true);
     Services.prefs.setBoolPref("media.navigator.permission.fake", true);
     Services.prefs.setBoolPref("extensions.install.requireBuiltInCerts", false);
     Services.prefs.setBoolPref("signon.rememberSignons", true);
   },
 
   configurations: {
     shareDevices: {
       selectors: ["#notification-popup"],

--- a/devtools/.eslintrc.js
+++ b/devtools/.eslintrc.js
@@ -42,35 +42,38 @@ module.exports = {
       "camelcase": "off",
     }
   }, {
     "files": [
       "client/framework/**",
       "client/scratchpad/**",
       "client/shared/*.jsm",
       "client/shared/widgets/*.jsm",
+      "client/webide/**",
     ],
     "rules": {
       "consistent-return": "off",
     }
   }, {
     "files": [
       "client/framework/**",
       "client/scratchpad/**",
       "client/shared/AppCacheUtils.jsm",
+      "client/webide/**",
     ],
     "rules": {
       "max-nested-callbacks": "off",
     }
   }, {
     "files": [
       "client/framework/**",
       "client/scratchpad/**",
       "client/shared/*.jsm",
       "client/shared/widgets/*.jsm",
+      "client/webide/**",
     ],
     "rules": {
       "max-len": "off",
     }
   }, {
     "files": [
       "client/scratchpad/test/browser_scratchpad_inspect.js",
       "client/scratchpad/test/browser_scratchpad_inspect_primitives.js",
@@ -79,16 +82,17 @@ module.exports = {
       "no-labels": "off",
     }
   }, {
     "files": [
       "client/framework/**",
       "client/scratchpad/**",
       "client/shared/*.jsm",
       "client/shared/widgets/*.jsm",
+      "client/webide/**",
     ],
     "rules": {
       "mozilla/no-aArgs": "off",
     }
   }, {
     "files": [
       "client/framework/test/**",
       "client/scratchpad/**",
@@ -97,46 +101,53 @@ module.exports = {
       "mozilla/var-only-at-top-level": "off",
     }
   }, {
     "files": [
       "client/framework/**",
       "client/scratchpad/**",
       "client/shared/AppCacheUtils.jsm",
       "client/shared/widgets/*.jsm",
+      "client/webide/**",
     ],
     "rules": {
       "no-shadow": "off",
     }
   }, {
     "files": [
       "client/framework/**",
       "client/scratchpad/**",
+      "client/webide/**",
     ],
     "rules": {
       "strict": "off",
     }
   }, {
     "files": [
       // Note: Bug 1403938 may be removing canvasdebugger, check before
       // doing more work on enabling these rules.
       "client/canvasdebugger/**",
       // Note: Bug 1342237 may be removing shadereditor, check before
       // doing more work on enabling these rules.
       "client/shadereditor/**",
+      // Note: Bug 1403944 may be removing webaudioeditor, check before
+      // doing more work on enabling these rules.
+      "client/webaudioeditor/**",
     ],
     "rules": {
       "consistent-return": "off",
       "max-len": "off",
       "mozilla/no-aArgs": "off",
       "mozilla/var-only-at-top-level": "off",
+      "no-redeclare": "off",
       "no-return-assign": "off",
       "no-shadow": "off",
       "no-undef": "off",
       "no-unused-vars": "off",
+      "no-useless-call": "off",
       "strict": "off",
     }
   }, {
     // For all head*.js files, turn off no-unused-vars at a global level
     "files": [
       "**/head*.js",
     ],
     "rules": {

--- a/devtools/client/aboutdebugging/test/head.js
+++ b/devtools/client/aboutdebugging/test/head.js
@@ -10,21 +10,16 @@
 // Load the shared-head file first.
 Services.scriptloader.loadSubScript(
   "chrome://mochitests/content/browser/devtools/client/shared/test/shared-head.js",
   this);
 
 const { AddonManager } = ChromeUtils.import("resource://gre/modules/AddonManager.jsm", {});
 const { Management } = ChromeUtils.import("resource://gre/modules/Extension.jsm", {});
 
-flags.testing = true;
-registerCleanupFunction(() => {
-  flags.testing = false;
-});
-
 async function openAboutDebugging(page, win) {
   info("opening about:debugging");
   let url = "about:debugging";
   if (page) {
     url += "#" + page;
   }
 
   let tab = await addTab(url, { window: win });

--- a/devtools/client/commandline/test/head.js
+++ b/devtools/client/commandline/test/head.js
@@ -14,21 +14,16 @@ var { require } = ChromeUtils.import("re
 var flags = require("devtools/shared/flags");
 var { Task } = require("devtools/shared/task");
 
 // Import the GCLI test helper
 var testDir = gTestPath.substr(0, gTestPath.lastIndexOf("/"));
 Services.scriptloader.loadSubScript(testDir + "/helpers.js", this);
 Services.scriptloader.loadSubScript(testDir + "/mockCommands.js", this, "UTF-8");
 
-flags.testing = true;
-SimpleTest.registerCleanupFunction(() => {
-  flags.testing = false;
-});
-
 function whenDelayedStartupFinished(aWindow, aCallback) {
   Services.obs.addObserver(function observer(aSubject, aTopic) {
     if (aWindow == aSubject) {
       Services.obs.removeObserver(observer, aTopic);
       executeSoon(aCallback);
     }
   }, "browser-delayed-startup-finished");
 }

--- a/devtools/client/framework/test/browser_ignore_toolbox_network_requests.js
+++ b/devtools/client/framework/test/browser_ignore_toolbox_network_requests.js
@@ -7,28 +7,26 @@
 
 // Test that network requests originating from the toolbox don't get recorded in
 // the network panel.
 
 add_task(async function() {
   // TODO: This test tries to verify the normal behavior of the netmonitor and
   // therefore needs to avoid the explicit check for tests. Bug 1167188 will
   // allow us to remove this workaround.
-  let isTesting = flags.testing;
-  flags.testing = false;
+  await pushPref("devtools.testing", false);
 
   let tab = await addTab(URL_ROOT + "doc_viewsource.html");
   let target = TargetFactory.forTab(tab);
   let toolbox = await gDevTools.showToolbox(target, "styleeditor");
   let panel = toolbox.getPanel("styleeditor");
 
   is(panel.UI.editors.length, 1, "correct number of editors opened");
 
   let monitor = await toolbox.selectTool("netmonitor");
   let { store, windowRequire } = monitor.panelWin;
 
   is(store.getState().requests.requests.size, 0, "No network requests appear in the network panel");
 
   await gDevTools.closeToolbox(target);
   tab = target = toolbox = panel = null;
   gBrowser.removeCurrentTab();
-  flags.testing = isTesting;
 });

--- a/devtools/client/framework/toolbox.js
+++ b/devtools/client/framework/toolbox.js
@@ -18,16 +18,17 @@ const HTML_NS = "http://www.w3.org/1999/
 var {Ci, Cc} = require("chrome");
 var promise = require("promise");
 var defer = require("devtools/shared/defer");
 var Services = require("Services");
 var ChromeUtils = require("ChromeUtils");
 var {gDevTools} = require("devtools/client/framework/devtools");
 var EventEmitter = require("devtools/shared/event-emitter");
 var Telemetry = require("devtools/client/shared/telemetry");
+const { getUnicodeUrl } = require("devtools/client/shared/unicode-url");
 var { attachThread, detachThread } = require("./attach-thread");
 var Menu = require("devtools/client/framework/menu");
 var MenuItem = require("devtools/client/framework/menu-item");
 var { DOMHelpers } = require("resource://devtools/client/shared/DOMHelpers.jsm");
 const { KeyCodes } = require("devtools/client/shared/keycodes");
 var Startup = Cc["@mozilla.org/devtools/startup-clh;1"].getService(Ci.nsISupports)
   .wrappedJSObject;
 
@@ -2052,21 +2053,23 @@ Toolbox.prototype = {
 
   /**
    * Refresh the host's title.
    */
   _refreshHostTitle: function() {
     let title;
     if (this.target.name && this.target.name != this.target.url) {
       const url = this.target.isWebExtension ?
-                  this.target.getExtensionPathName(this.target.url) : this.target.url;
+                    this.target.getExtensionPathName(this.target.url) :
+                    getUnicodeUrl(this.target.url);
       title = L10N.getFormatStr("toolbox.titleTemplate2", this.target.name,
                                                           url);
     } else {
-      title = L10N.getFormatStr("toolbox.titleTemplate1", this.target.url);
+      title = L10N.getFormatStr("toolbox.titleTemplate1",
+                                getUnicodeUrl(this.target.url));
     }
     this.postMessage({
       name: "set-host-title",
       title
     });
   },
 
   // Returns an instance of the preference actor
@@ -2143,21 +2146,22 @@ Toolbox.prototype = {
         await this.target.actorHasMethod("domwalker", "getNodeActorFromWindowID");
     }
 
     // Generate list of menu items from the list of frames.
     this.frameMap.forEach(frame => {
       // A frame is checked if it's the selected one.
       let checked = frame.id == this.selectedFrameId;
 
-      let label = frame.url;
-
+      let label;
       if (this.target.isWebExtension) {
         // Show a shorter url for extensions page.
         label = this.target.getExtensionPathName(frame.url);
+      } else {
+        label = getUnicodeUrl(frame.url);
       }
 
       // Create menu item.
       menu.append(new MenuItem({
         label,
         type: "radio",
         checked,
         click: () => {

--- a/devtools/client/inspector/markup/test/head.js
+++ b/devtools/client/inspector/markup/test/head.js
@@ -14,22 +14,16 @@ Services.scriptloader.loadSubScript(
 var {getInplaceEditorForSpan: inplaceEditor} = require("devtools/client/shared/inplace-editor");
 var clipboard = require("devtools/shared/platform/clipboard");
 var {ActorRegistryFront} = require("devtools/shared/fronts/actor-registry");
 
 // If a test times out we want to see the complete log and not just the last few
 // lines.
 SimpleTest.requestCompleteLog();
 
-// Set the testing flag on DevToolsUtils and reset it when the test ends
-flags.testing = true;
-registerCleanupFunction(() => {
-  flags.testing = false;
-});
-
 // Toggle this pref on to see all DevTools event communication. This is hugely
 // useful for fixing race conditions.
 // Services.prefs.setBoolPref("devtools.dump.emit", true);
 
 // Clear preferences that may be set during the course of tests.
 registerCleanupFunction(() => {
   Services.prefs.clearUserPref("devtools.dump.emit");
   Services.prefs.clearUserPref("devtools.inspector.htmlPanelOpen");

--- a/devtools/client/inspector/test/head.js
+++ b/devtools/client/inspector/test/head.js
@@ -27,21 +27,16 @@ Services.scriptloader.loadSubScript(
 Services.scriptloader.loadSubScript(
   "chrome://mochitests/content/browser/devtools/client/inspector/test/shared-head.js",
   this);
 
 const {LocalizationHelper} = require("devtools/shared/l10n");
 const INSPECTOR_L10N =
       new LocalizationHelper("devtools/client/locales/inspector.properties");
 
-flags.testing = true;
-registerCleanupFunction(() => {
-  flags.testing = false;
-});
-
 registerCleanupFunction(() => {
   Services.prefs.clearUserPref("devtools.inspector.activeSidebar");
 });
 
 registerCleanupFunction(function() {
   // Move the mouse outside inspector. If the test happened fake a mouse event
   // somewhere over inspector the pointer is considered to be there when the
   // next test begins. This might cause unexpected events to be emitted when

--- a/devtools/client/memory/test/chrome/head.js
+++ b/devtools/client/memory/test/chrome/head.js
@@ -18,18 +18,16 @@ SimpleTest.registerCleanupFunction(funct
     ok(false, "Should have had the expected number of DevToolsUtils.assert() failures." +
       "Expected " + EXPECTED_DTU_ASSERT_FAILURE_COUNT +
       ", got " + DevToolsUtils.assertionFailureCount);
   }
 });
 
 var DevToolsUtils = require("devtools/shared/DevToolsUtils");
 var { immutableUpdate } = DevToolsUtils;
-var flags = require("devtools/shared/flags");
-flags.testing = true;
 
 var constants = require("devtools/client/memory/constants");
 var {
   censusDisplays,
   diffingState,
   labelDisplays,
   dominatorTreeState,
   snapshotState,

--- a/devtools/client/memory/test/unit/head.js
+++ b/devtools/client/memory/test/unit/head.js
@@ -5,20 +5,23 @@
 
 // via xpcshell.ini
 /* import-globals-from ../../../shared/test/shared-redux-head.js */
 
 var { require } = ChromeUtils.import("resource://devtools/shared/Loader.jsm", {});
 
 var Services = require("Services");
 var DevToolsUtils = require("devtools/shared/DevToolsUtils");
-var flags = require("devtools/shared/flags");
-flags.testing = true;
-flags.wantLogging = true;
-flags.wantVerbose = false;
+
+Services.prefs.setBoolPref("devtools.testing", true);
+Services.prefs.setBoolPref("devtools.debugger.log", true);
+registerCleanupFunction(() => {
+  Services.prefs.clearUserPref("devtools.testing");
+  Services.prefs.clearUserPref("devtools.debugger.log");
+});
 
 var { OS } = require("resource://gre/modules/osfile.jsm");
 var { FileUtils } = require("resource://gre/modules/FileUtils.jsm");
 var { TargetFactory } = require("devtools/client/framework/target");
 var promise = require("promise");
 var defer = require("devtools/shared/defer");
 var { expectState } = require("devtools/server/actors/common");
 var HeapSnapshotFileUtils = require("devtools/shared/heapsnapshot/HeapSnapshotFileUtils");

--- a/devtools/client/netmonitor/src/utils/firefox/open-request-in-tab.js
+++ b/devtools/client/netmonitor/src/utils/firefox/open-request-in-tab.js
@@ -1,13 +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/. */
 /* eslint-disable mozilla/reject-some-requires */
 
+// This file is a chrome-API-dependent version of the module
+// devtools/client/netmonitor/src/utils/open-request-in-tab.js, so that it can
+// take advantage of utilizing chrome APIs. But because of this, it isn't
+// intended to be used in Chrome-API-free applications, such as the Launchpad.
+//
+// Please keep in mind that if the feature in this file has changed, don't
+// forget to also change that accordingly in
+// devtools/client/netmonitor/src/utils/open-request-in-tab.js.
+
 "use strict";
 
 let { Cc, Ci } = require("chrome");
 const Services = require("Services");
 const { gDevTools } = require("devtools/client/framework/devtools");
 
 /**
  * Opens given request in a new tab.

--- a/devtools/client/netmonitor/src/utils/open-request-in-tab.js
+++ b/devtools/client/netmonitor/src/utils/open-request-in-tab.js
@@ -1,12 +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/. */
 
+// This file is a chrome-API-free version of the module
+// devtools/client/netmonitor/src/utils/firefox/open-request-in-tab.js, so that
+// it can be used in Chrome-API-free applications, such as the Launchpad. But
+// because of this, it cannot take advantage of utilizing chrome APIs and should
+// implement the similar functionalities on its own.
+//
+// Please keep in mind that if the feature in this file has changed, don't
+// forget to also change that accordingly in
+// devtools/client/netmonitor/src/utils/firefox/open-request-in-tab.js.
+
 "use strict";
 
 const Services = require("Services");
 const { gDevTools } = require("devtools/client/framework/devtools");
 
 /**
  * Opens given request in a new tab.
  */

--- a/devtools/client/netmonitor/src/utils/request-utils.js
+++ b/devtools/client/netmonitor/src/utils/request-utils.js
@@ -1,16 +1,19 @@
 /* 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/. */
 
 /* eslint-disable mozilla/reject-some-requires */
 
 "use strict";
 
+const { getUnicodeUrl, getUnicodeUrlPath, getUnicodeHostname } =
+  require("devtools/client/shared/unicode-url");
+
 const {
   UPDATE_PROPS,
 } = require("devtools/client/netmonitor/src/constants");
 
 const CONTENT_MIME_TYPE_ABBREVIATIONS = {
   "ecmascript": "js",
   "javascript": "js",
   "x-javascript": "js"
@@ -116,32 +119,16 @@ function formDataURI(mimeType, encoding,
  * @param {array} headers - array of headers info { name, value }
  * @return {string} list of headers in text format
  */
 function writeHeaderText(headers) {
   return headers.map(({name, value}) => name + ": " + value).join("\n");
 }
 
 /**
- * Convert a string into unicode if string is valid.
- * If there is a malformed URI sequence, it returns input string.
- *
- * @param {string} url - a string
- * @return {string} unicode string
- */
-function decodeUnicodeUrl(string) {
-  try {
-    return decodeURIComponent(string);
-  } catch (err) {
-    // Ignore error and return input string directly.
-  }
-  return string;
-}
-
-/**
  * Decode base64 string.
  *
  * @param {string} url - a string
  * @return {string} decoded string
  */
 function decodeUnicodeBase64(string) {
   try {
     return decodeURIComponent(atob(string));
@@ -170,17 +157,17 @@ function getAbbreviatedMimeType(mimeType
  * For example helper returns "basename" from http://domain.com/path/basename
  * If basename portion is empty, it returns the url pathname.
  *
  * @param {string} url - url string
  * @return {string} unicode basename of a url
  */
 function getUrlBaseName(url) {
   const pathname = (new URL(url)).pathname;
-  return decodeUnicodeUrl(
+  return getUnicodeUrlPath(
     pathname.replace(/\S*\//, "") || pathname || "/");
 }
 
 /**
  * Helpers for getting the query portion of a url.
  *
  * @param {string} url - url string
  * @return {string} unicode query of a url
@@ -191,37 +178,37 @@ function getUrlQuery(url) {
 
 /**
  * Helpers for getting unicode name and query portions of a url.
  *
  * @param {string} url - url string
  * @return {string} unicode basename and query portions of a url
  */
 function getUrlBaseNameWithQuery(url) {
-  return getUrlBaseName(url) + decodeUnicodeUrl((new URL(url)).search);
+  return getUrlBaseName(url) + getUnicodeUrlPath((new URL(url)).search);
 }
 
 /**
- * Helpers for getting unicode hostname portion of an URL.
+ * Helpers for getting hostname portion of an URL.
  *
  * @param {string} url - url string
  * @return {string} unicode hostname of a url
  */
 function getUrlHostName(url) {
-  return decodeUnicodeUrl((new URL(url)).hostname);
+  return new URL(url).hostname;
 }
 
 /**
- * Helpers for getting unicode host portion of an URL.
+ * Helpers for getting host portion of an URL.
  *
  * @param {string} url - url string
  * @return {string} unicode host of a url
  */
 function getUrlHost(url) {
-  return decodeUnicodeUrl((new URL(url)).host);
+  return new URL(url).host;
 }
 
 /**
  * Helpers for getting the shceme portion of a url.
  * For example helper returns "http" from http://domain.com/path/basename
  *
  * @param {string} url - url string
  * @return {string} string scheme of a url
@@ -232,19 +219,32 @@ function getUrlScheme(url) {
 
 /**
  * Extract several details fields from a URL at once.
  */
 function getUrlDetails(url) {
   let baseNameWithQuery = getUrlBaseNameWithQuery(url);
   let host = getUrlHost(url);
   let hostname = getUrlHostName(url);
-  let unicodeUrl = decodeUnicodeUrl(url);
+  let unicodeUrl = getUnicodeUrl(url);
   let scheme = getUrlScheme(url);
 
+  // If the hostname contains unreadable ASCII characters, we need to do the
+  // following two steps:
+  // 1. Converting the unreadable hostname to a readable Unicode domain name.
+  //    For example, converting xn--g6w.xn--8pv into a Unicode domain name.
+  // 2. Replacing the unreadable hostname portion in the `host` with the
+  //    readable hostname.
+  //    For example, replacing xn--g6w.xn--8pv:8000 with [Unicode domain]:8000
+  // After finishing the two steps, we get a readable `host`.
+  const unicodeHostname = getUnicodeHostname(hostname);
+  if (unicodeHostname !== hostname) {
+    host = host.replace(hostname, unicodeHostname);
+  }
+
   // Mark local hosts specially, where "local" is  as defined in the W3C
   // spec for secure contexts.
   // http://www.w3.org/TR/powerful-features/
   //
   //  * If the name falls under 'localhost'
   //  * If the name is an IPv4 address within 127.0.0.0/8
   //  * If the name is an IPv6 address within ::1/128
   //
@@ -272,18 +272,18 @@ function getUrlDetails(url) {
 function parseQueryString(query) {
   if (!query) {
     return null;
   }
 
   return query.replace(/^[?&]/, "").split("&").map(e => {
     let param = e.split("=");
     return {
-      name: param[0] ? decodeUnicodeUrl(param[0]) : "",
-      value: param[1] ? decodeUnicodeUrl(param[1]) : "",
+      name: param[0] ? getUnicodeUrlPath(param[0]) : "",
+      value: param[1] ? getUnicodeUrlPath(param[1]) : "",
     };
   });
 }
 
 /**
  * Parse a string of formdata sections into its components
  *
  * @param {string} sections - sections of formdata joined by &
@@ -292,18 +292,18 @@ function parseQueryString(query) {
 function parseFormData(sections) {
   if (!sections) {
     return null;
   }
 
   return sections.replace(/^&/, "").split("&").map(e => {
     let param = e.split("=");
     return {
-      name: param[0] ? decodeUnicodeUrl(param[0]) : "",
-      value: param[1] ? decodeUnicodeUrl(param[1]) : "",
+      name: param[0] ? getUnicodeUrlPath(param[0]) : "",
+      value: param[1] ? getUnicodeUrlPath(param[1]) : "",
     };
   });
 }
 
 /**
  * Reduces an IP address into a number for easier sorting
  *
  * @param {string} ip - IP address to reduce
@@ -486,17 +486,16 @@ function processNetworkUpdates(request =
 
 module.exports = {
   decodeUnicodeBase64,
   getFormDataSections,
   fetchHeaders,
   fetchNetworkUpdatePacket,
   formDataURI,
   writeHeaderText,
-  decodeUnicodeUrl,
   getAbbreviatedMimeType,
   getEndTime,
   getFormattedProtocol,
   getResponseHeader,
   getResponseTime,
   getStartTime,
   getUrlBaseName,
   getUrlBaseNameWithQuery,

--- a/devtools/client/netmonitor/test/head.js
+++ b/devtools/client/netmonitor/test/head.js
@@ -13,18 +13,18 @@
 Services.scriptloader.loadSubScript(
   "chrome://mochitests/content/browser/devtools/client/shared/test/shared-head.js",
   this);
 
 const {
   getFormattedIPAndPort,
   getFormattedTime,
 } = require("devtools/client/netmonitor/src/utils/format-utils");
+const { getUnicodeUrl } = require("devtools/client/shared/unicode-url");
 const {
-  decodeUnicodeUrl,
   getFormattedProtocol,
   getUrlBaseName,
   getUrlHost,
   getUrlQuery,
   getUrlScheme,
 } = require("devtools/client/netmonitor/src/utils/request-utils");
 const { EVENTS } = require("devtools/client/netmonitor/src/constants");
 
@@ -405,17 +405,17 @@ function verifyRequestItemTarget(documen
 
   info("Visible index of item: " + visibleIndex);
 
   let { fuzzyUrl, status, statusText, cause, type, fullMimeType,
         transferred, size, time, displayedStatus } = data;
 
   let target = document.querySelectorAll(".request-list-item")[visibleIndex];
   // Bug 1414981 - Request URL should not show #hash
-  let unicodeUrl = decodeUnicodeUrl(url).split("#")[0];
+  let unicodeUrl = getUnicodeUrl(url.split("#")[0]);
   let name = getUrlBaseName(url);
   let query = getUrlQuery(url);
   let host = getUrlHost(url);
   let scheme = getUrlScheme(url);
   let {
     remoteAddress,
     remotePort,
     totalTime,

--- a/devtools/client/netmonitor/webpack.config.js
+++ b/devtools/client/netmonitor/webpack.config.js
@@ -83,16 +83,17 @@ let webpackConfig = {
       "devtools/client/shared/vendor/jszip": "jszip",
 
       "devtools/client/sourceeditor/editor": "devtools-source-editor/src/source-editor",
 
       "devtools/shared/event-emitter": "devtools-modules/src/utils/event-emitter",
       "devtools/shared/fronts/timeline": path.join(__dirname, "../../client/shared/webpack/shims/fronts-timeline-shim"),
       "devtools/shared/platform/clipboard": path.join(__dirname, "../../client/shared/webpack/shims/platform-clipboard-stub"),
       "devtools/client/netmonitor/src/utils/firefox/open-request-in-tab": path.join(__dirname, "src/utils/open-request-in-tab"),
+      "devtools/client/shared/unicode-url": path.join(__dirname, "../../client/shared/webpack/shims/unicode-url-stub"),
 
       // Locales need to be explicitly mapped to the en-US subfolder
       "devtools/client/locales": path.join(__dirname, "../../client/locales/en-US"),
       "devtools/shared/locales": path.join(__dirname, "../../shared/locales/en-US"),
       "devtools/startup/locales": path.join(__dirname, "../../shared/locales/en-US"),
       "toolkit/locales": path.join(__dirname, "../../../toolkit/locales/en-US"),
 
       // Unless a path explicitly needs to be rewritten or shimmed, all devtools paths can

--- a/devtools/client/performance-new/test/chrome/head.js
+++ b/devtools/client/performance-new/test/chrome/head.js
@@ -10,19 +10,17 @@ const { BrowserLoader } = ChromeUtils.im
 var { require } = BrowserLoader({
   baseURI: "resource://devtools/client/performance-new/",
   window
 });
 
 const EventEmitter = require("devtools/shared/event-emitter");
 const { perfDescription } = require("devtools/shared/specs/perf");
 const DevToolsUtils = require("devtools/shared/DevToolsUtils");
-const flags = require("devtools/shared/flags");
 
-flags.testing = true;
 let EXPECTED_DTU_ASSERT_FAILURE_COUNT = 0;
 SimpleTest.registerCleanupFunction(function() {
   if (DevToolsUtils.assertionFailureCount !== EXPECTED_DTU_ASSERT_FAILURE_COUNT) {
     ok(false, "Should have had the expected number of DevToolsUtils.assert() failures." +
       "Expected " + EXPECTED_DTU_ASSERT_FAILURE_COUNT +
       ", got " + DevToolsUtils.assertionFailureCount);
   }
 });

--- a/devtools/client/performance/components/test/head.js
+++ b/devtools/client/performance/components/test/head.js
@@ -9,17 +9,16 @@
 let { require } = ChromeUtils.import("resource://devtools/shared/Loader.jsm", {});
 let { Assert } = require("resource://testing-common/Assert.jsm");
 let { BrowserLoader } = ChromeUtils.import("resource://devtools/client/shared/browser-loader.js", {});
 let defer = require("devtools/shared/defer");
 let flags = require("devtools/shared/flags");
 let { TargetFactory } = require("devtools/client/framework/target");
 let { Toolbox } = require("devtools/client/framework/toolbox");
 
-flags.testing = true;
 let { require: browserRequire } = BrowserLoader({
   baseURI: "resource://devtools/client/performance/",
   window
 });
 
 let $ = (selector, scope = document) => scope.querySelector(selector);
 let $$ = (selector, scope = document) => scope.querySelectorAll(selector);
 

--- a/devtools/client/performance/test/head.js
+++ b/devtools/client/performance/test/head.js
@@ -47,36 +47,32 @@ const rightMousedown = (node, win = wind
 
 // Shortcut for firing a key event, like "VK_UP", "VK_DOWN", etc.
 const key = (id, win = window) => {
   EventUtils.synthesizeKey(id, {}, win);
 };
 
 // Don't pollute global scope.
 (() => {
-  const flags = require("devtools/shared/flags");
   const PrefUtils = require("devtools/client/performance/test/helpers/prefs");
 
-  flags.testing = true;
-
   // Make sure all the prefs are reverted to their defaults once tests finish.
   let stopObservingPrefs = PrefUtils.whenUnknownPrefChanged("devtools.performance",
     pref => {
       ok(false, `Unknown pref changed: ${pref}. Please add it to test/helpers/prefs.js ` +
         "to make sure it's reverted to its default value when the tests finishes, " +
         "and avoid interfering with future tests.\n");
     });
 
   // By default, enable memory flame graphs for tests for now.
   // TODO: remove when we have flame charts via bug 1148663.
   Services.prefs.setBoolPref(PrefUtils.UI_ENABLE_MEMORY_FLAME_CHART, true);
 
   registerCleanupFunction(() => {
     info("finish() was called, cleaning up...");
-    flags.testing = false;
 
     PrefUtils.rollbackPrefsToDefault();
     stopObservingPrefs();
 
     // Manually stop the profiler module at the end of all tests, to hopefully
     // avoid at least some leaks on OSX. Theoretically the module should never
     // be active at this point. We shouldn't have to do this, but rather
     // find and fix the leak in the module itself. Bug 1257439.

--- a/devtools/client/responsive.html/test/browser/head.js
+++ b/devtools/client/responsive.html/test/browser/head.js
@@ -43,24 +43,22 @@ const { addDevice, removeDevice, removeL
 SimpleTest.requestCompleteLog();
 SimpleTest.waitForExplicitFinish();
 
 // Toggling the RDM UI involves several docShell swap operations, which are somewhat slow
 // on debug builds. Usually we are just barely over the limit, so a blanket factor of 2
 // should be enough.
 requestLongerTimeout(2);
 
-flags.testing = true;
 Services.prefs.setCharPref("devtools.devices.url", TEST_URI_ROOT + "devices.json");
 // The appearance of this notification causes intermittent behavior in some tests that
 // send mouse events, since it causes the content to shift when it appears.
 Services.prefs.setBoolPref("devtools.responsive.reloadNotification.enabled", false);
 
 registerCleanupFunction(async () => {
-  flags.testing = false;
   Services.prefs.clearUserPref("devtools.devices.url");
   Services.prefs.clearUserPref("devtools.responsive.reloadNotification.enabled");
   Services.prefs.clearUserPref("devtools.responsive.html.displayedDeviceList");
   Services.prefs.clearUserPref("devtools.responsive.reloadConditions.touchSimulation");
   Services.prefs.clearUserPref("devtools.responsive.reloadConditions.userAgent");
   await asyncStorage.removeItem("devtools.devices.url_cache");
   await removeLocalDevices();
 });

--- a/devtools/client/responsive.html/test/unit/head.js
+++ b/devtools/client/responsive.html/test/unit/head.js
@@ -3,17 +3,17 @@
 
 "use strict";
 
 /* eslint no-unused-vars: [2, {"vars": "local"}] */
 
 const { require } = ChromeUtils.import("resource://devtools/shared/Loader.jsm", {});
 
 const promise = require("promise");
+const Services = require("Services");
 const Store = require("devtools/client/responsive.html/store");
 
 const DevToolsUtils = require("devtools/shared/DevToolsUtils");
 
-const flags = require("devtools/shared/flags");
-flags.testing = true;
+Services.prefs.setBoolPref("devtools.testing", true);
 registerCleanupFunction(() => {
-  flags.testing = false;
+  Services.prefs.clearUserPref("devtools.testing");
 });

--- a/devtools/client/scratchpad/test/head.js
+++ b/devtools/client/scratchpad/test/head.js
@@ -6,27 +6,21 @@
 
 const {NetUtil} = ChromeUtils.import("resource://gre/modules/NetUtil.jsm", {});
 const {FileUtils} = ChromeUtils.import("resource://gre/modules/FileUtils.jsm", {});
 const {ScratchpadManager} = ChromeUtils.import("resource://devtools/client/scratchpad/scratchpad-manager.jsm", {});
 const {require} = ChromeUtils.import("resource://devtools/shared/Loader.jsm", {});
 const {gDevTools} = require("devtools/client/framework/devtools");
 const Services = require("Services");
 const DevToolsUtils = require("devtools/shared/DevToolsUtils");
-const flags = require("devtools/shared/flags");
 const promise = require("promise");
 const defer = require("devtools/shared/defer");
 
 var gScratchpadWindow; // Reference to the Scratchpad chrome window object
 
-flags.testing = true;
-registerCleanupFunction(() => {
-  flags.testing = false;
-});
-
 /**
  * Open a Scratchpad window.
  *
  * @param function aReadyCallback
  *        Optional. The function you want invoked when the Scratchpad instance
  *        is ready.
  * @param object aOptions
  *        Optional. Options for opening the scratchpad:

--- a/devtools/client/shared/components/Frame.js
+++ b/devtools/client/shared/components/Frame.js
@@ -2,16 +2,18 @@
  * 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 dom = require("devtools/client/shared/vendor/react-dom-factories");
 const PropTypes = require("devtools/client/shared/vendor/react-prop-types");
+const { getUnicodeUrl, getUnicodeUrlPath, getUnicodeHostname } =
+  require("devtools/client/shared/unicode-url");
 const { getSourceNames, parseURL, isScratchpadScheme, getSourceMappedFile } =
   require("devtools/client/shared/source-utils");
 const { LocalizationHelper } = require("devtools/shared/l10n");
 
 const l10n = new LocalizationHelper("devtools/client/locales/components.properties");
 const webl10n = new LocalizationHelper("devtools/client/locales/webconsole.properties");
 
 class Frame extends Component {
@@ -128,28 +130,32 @@ class Frame extends Component {
     // What's needed is only the last part after " -> ".
     let source = frame.source
       ? String(frame.source).split(" -> ").pop()
       : "";
     let line = frame.line != void 0 ? Number(frame.line) : null;
     let column = frame.column != void 0 ? Number(frame.column) : null;
 
     const { short, long, host } = getSourceNames(source);
+    const unicodeShort = getUnicodeUrlPath(short);
+    const unicodeLong  = getUnicodeUrl(long);
+    const unicodeHost  = host ? getUnicodeHostname(host) : "";
+
     // Reparse the URL to determine if we should link this; `getSourceNames`
     // has already cached this indirectly. We don't want to attempt to
     // link to "self-hosted" and "(unknown)". However, we do want to link
     // to Scratchpad URIs.
     // Source mapped sources might not necessary linkable, but they
     // are still valid in the debugger.
     const isLinkable = !!(isScratchpadScheme(source) || parseURL(source))
       || isSourceMapped;
     const elements = [];
     const sourceElements = [];
     let sourceEl;
-    let tooltip = long;
+    let tooltip = unicodeLong;
 
     // Exclude all falsy values, including `0`, as line numbers start with 1.
     if (line) {
       tooltip += `:${line}`;
       // Intentionally exclude 0
       if (column) {
         tooltip += `:${column}`;
       }
@@ -172,17 +178,17 @@ class Frame extends Component {
             key: "function-display-name",
             className: "frame-link-function-display-name",
           }, functionDisplayName),
           " "
         );
       }
     }
 
-    let displaySource = showFullSourceUrl ? long : short;
+    let displaySource = showFullSourceUrl ? unicodeLong : unicodeShort;
     if (isSourceMapped) {
       displaySource = getSourceMappedFile(displaySource);
     } else if (showEmptyPathAsHost && (displaySource === "" || displaySource === "/")) {
       displaySource = host;
     }
 
     sourceElements.push(dom.span({
       key: "filename",
@@ -233,21 +239,21 @@ class Frame extends Component {
     } else {
       sourceEl = dom.span({
         key: "source",
         className: "frame-link-source",
       }, sourceInnerEl);
     }
     elements.push(sourceEl);
 
-    if (showHost && host) {
+    if (showHost && unicodeHost) {
       elements.push(" ");
       elements.push(dom.span({
         key: "host",
         className: "frame-link-host",
-      }, host));
+      }, unicodeHost));
     }
 
     return dom.span(attributes, ...elements);
   }
 }
 
 module.exports = Frame;

--- a/devtools/client/shared/components/test/mochitest/head.js
+++ b/devtools/client/shared/components/test/mochitest/head.js
@@ -10,21 +10,19 @@ var { Assert } = require("resource://tes
 var { gDevTools } = require("devtools/client/framework/devtools");
 var { BrowserLoader } = ChromeUtils.import("resource://devtools/client/shared/browser-loader.js", {});
 var promise = require("promise");
 var defer = require("devtools/shared/defer");
 var Services = require("Services");
 var { DebuggerServer } = require("devtools/server/main");
 var { DebuggerClient } = require("devtools/shared/client/debugger-client");
 var DevToolsUtils = require("devtools/shared/DevToolsUtils");
-var flags = require("devtools/shared/flags");
 var { TargetFactory } = require("devtools/client/framework/target");
 var { Toolbox } = require("devtools/client/framework/toolbox");
 
-flags.testing = true;
 var { require: browserRequire } = BrowserLoader({
   baseURI: "resource://devtools/client/shared/",
   window
 });
 
 const React = browserRequire("devtools/client/shared/vendor/react");
 const ReactDOM = browserRequire("devtools/client/shared/vendor/react-dom");
 const dom = browserRequire("devtools/client/shared/vendor/react-dom-factories");

--- a/devtools/client/shared/moz.build
+++ b/devtools/client/shared/moz.build
@@ -48,16 +48,17 @@ DevToolsModules(
     'scroll.js',
     'source-utils.js',
     'SplitView.jsm',
     'stylesheet-utils.js',
     'suggestion-picker.js',
     'telemetry.js',
     'theme.js',
     'undo.js',
+    'unicode-url.js',
     'view-source.js',
     'webgl-utils.js',
     'zoom-keys.js',
 )
 
 with Files('**'):
     BUG_COMPONENT = ('Firefox', 'Developer Tools')
 

--- a/devtools/client/shared/redux/middleware/test/head.js
+++ b/devtools/client/shared/redux/middleware/test/head.js
@@ -2,19 +2,16 @@
  * 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/. */
 
 /* exported waitUntilState */
 
 "use strict";
 
 const { require } = ChromeUtils.import("resource://devtools/shared/Loader.jsm", {});
-const flags = require("devtools/shared/flags");
-
-flags.testing = true;
 
 function waitUntilState(store, predicate) {
   return new Promise(resolve => {
     let unsubscribe = store.subscribe(check);
     function check() {
       if (predicate(store.getState())) {
         unsubscribe();
         resolve();

--- a/devtools/client/shared/test/browser_telemetry_button_responsive.js
+++ b/devtools/client/shared/test/browser_telemetry_button_responsive.js
@@ -12,23 +12,23 @@ const TOOL_DELAY = 200;
 
 const asyncStorage = require("devtools/shared/async-storage");
 
 // Toggling the RDM UI involves several docShell swap operations, which are somewhat slow
 // on debug builds. Usually we are just barely over the limit, so a blanket factor of 2
 // should be enough.
 requestLongerTimeout(2);
 
-flags.testing = true;
+Services.prefs.setBoolPref("devtools.testing", true);
 Services.prefs.clearUserPref("devtools.responsive.html.displayedDeviceList");
 Services.prefs.setCharPref("devtools.devices.url",
   "http://example.com/browser/devtools/client/responsive.html/test/browser/devices.json");
 
 registerCleanupFunction(() => {
-  flags.testing = false;
+  Services.prefs.clearUserPref("devtools.testing");
   Services.prefs.clearUserPref("devtools.devices.url");
   Services.prefs.clearUserPref("devtools.responsive.html.displayedDeviceList");
   asyncStorage.removeItem("devtools.devices.url_cache");
   asyncStorage.removeItem("devtools.devices.local");
 });
 
 loader.lazyRequireGetter(this, "ResponsiveUIManager", "devtools/client/responsive.html/manager", true);
 

--- a/devtools/client/shared/test/shared-head.js
+++ b/devtools/client/shared/test/shared-head.js
@@ -20,17 +20,16 @@ function scopedCuImport(path) {
 }
 
 const {ScratchpadManager} = scopedCuImport("resource://devtools/client/scratchpad/scratchpad-manager.jsm");
 const {loader, require} = scopedCuImport("resource://devtools/shared/Loader.jsm");
 
 const {gDevTools} = require("devtools/client/framework/devtools");
 const {TargetFactory} = require("devtools/client/framework/target");
 const DevToolsUtils = require("devtools/shared/DevToolsUtils");
-const flags = require("devtools/shared/flags");
 let promise = require("promise");
 let defer = require("devtools/shared/defer");
 const Services = require("Services");
 const KeyShortcuts = require("devtools/client/shared/key-shortcuts");
 
 const TEST_DIR = gTestPath.substr(0, gTestPath.lastIndexOf("/"));
 const CHROME_URL_ROOT = TEST_DIR + "/";
 const URL_ROOT = CHROME_URL_ROOT.replace("chrome://mochitests/content/",
@@ -104,19 +103,17 @@ function loadFrameScriptUtils(browser = 
   info("Loading the helper frame script " + frameURL);
   mm.loadFrameScript(frameURL, false);
   SimpleTest.registerCleanupFunction(() => {
     mm = null;
   });
   return mm;
 }
 
-flags.testing = true;
 registerCleanupFunction(() => {
-  flags.testing = false;
   Services.prefs.clearUserPref("devtools.dump.emit");
   Services.prefs.clearUserPref("devtools.toolbox.host");
   Services.prefs.clearUserPref("devtools.toolbox.previousHost");
   Services.prefs.clearUserPref("devtools.toolbox.splitconsoleEnabled");
   Services.prefs.clearUserPref("devtools.toolbox.splitconsoleHeight");
 });
 
 registerCleanupFunction(async function cleanup() {

new file mode 100644
--- /dev/null
+++ b/devtools/client/shared/test/unit/test_unicode-url.js
@@ -0,0 +1,240 @@
+/* Any copyright is dedicated to the Public Domain.
+   http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+/**
+ * Tests utility functions contained in `unicode-url.js`
+ */
+
+const { require } = ChromeUtils.import("resource://devtools/shared/Loader.jsm", {});
+const { getUnicodeUrl, getUnicodeUrlPath, getUnicodeHostname } =
+  require("devtools/client/shared/unicode-url");
+
+// List of URLs used to test Unicode URL conversion
+const TEST_URLS = [
+  // Type:     Readable ASCII URLs
+  // Expected: All of Unicode versions should equal to the raw.
+  {
+    raw: "https://example.org",
+    expectedUnicode: "https://example.org",
+  },
+  {
+    raw: "http://example.org",
+    expectedUnicode: "http://example.org",
+  },
+  {
+    raw: "ftp://example.org",
+    expectedUnicode: "ftp://example.org",
+  },
+  {
+    raw: "https://example.org.",
+    expectedUnicode: "https://example.org.",
+  },
+  {
+    raw: "https://example.org/",
+    expectedUnicode: "https://example.org/",
+  },
+  {
+    raw: "https://example.org/test",
+    expectedUnicode: "https://example.org/test",
+  },
+  {
+    raw: "https://example.org/test.html",
+    expectedUnicode: "https://example.org/test.html",
+  },
+  {
+    raw: "https://example.org/test.html?one=1&two=2",
+    expectedUnicode: "https://example.org/test.html?one=1&two=2",
+  },
+  {
+    raw: "https://example.org/test.html#here",
+    expectedUnicode: "https://example.org/test.html#here",
+  },
+  {
+    raw: "https://example.org/test.html?one=1&two=2#here",
+    expectedUnicode: "https://example.org/test.html?one=1&two=2#here",
+  },
+  // Type:     Unreadable URLs with either Punycode domain names or URI-encoded
+  //           paths
+  // Expected: Unreadable domain names and URI-encoded paths should be converted
+  //           to readable Unicode.
+  {
+    raw: "https://xn--g6w.xn--8pv/test.html",
+    // Do not type Unicode characters directly, because this test file isn't
+    // specified with a known encoding.
+    expectedUnicode: "https://\u6e2c.\u672c/test.html",
+  },
+  {
+    raw: "https://example.org/%E6%B8%AC%E8%A9%A6.html",
+    // Do not type Unicode characters directly, because this test file isn't
+    // specified with a known encoding.
+    expectedUnicode: "https://example.org/\u6e2c\u8a66.html",
+  },
+  {
+    raw: "https://example.org/test.html?One=%E4%B8%80",
+    // Do not type Unicode characters directly, because this test file isn't
+    // specified with a known encoding.
+    expectedUnicode: "https://example.org/test.html?One=\u4e00",
+  },
+  {
+    raw: "https://example.org/test.html?%E4%B8%80=1",
+    // Do not type Unicode characters directly, because this test file isn't
+    // specified with a known encoding.
+    expectedUnicode: "https://example.org/test.html?\u4e00=1",
+  },
+  {
+    raw: "https://xn--g6w.xn--8pv/%E6%B8%AC%E8%A9%A6.html" +
+         "?%E4%B8%80=%E4%B8%80" +
+         "#%E6%AD%A4",
+    // Do not type Unicode characters directly, because this test file isn't
+    // specified with a known encoding.
+    expectedUnicode: "https://\u6e2c.\u672c/\u6e2c\u8a66.html" +
+                     "?\u4e00=\u4e00" +
+                     "#\u6b64",
+  },
+  // Type:     data: URIs
+  // Expected: All should not be converted.
+  {
+    raw: "data:text/plain;charset=UTF-8;Hello%20world",
+    expectedUnicode: "data:text/plain;charset=UTF-8;Hello%20world",
+  },
+  {
+    raw: "data:text/plain;charset=UTF-8;%E6%B8%AC%20%E8%A9%A6",
+    expectedUnicode: "data:text/plain;charset=UTF-8;%E6%B8%AC%20%E8%A9%A6",
+  },
+  {
+    raw: "data:image/png;base64,iVBORw0KGgoAAA" +
+         "ANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4" +
+         "//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU" +
+         "5ErkJggg==",
+    expectedUnicode: "data:image/png;base64,iVBORw0KGgoAAA" +
+                     "ANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4" +
+                     "//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU" +
+                     "5ErkJggg==",
+  },
+  // Type:     Malformed URLs
+  // Expected: All should not be converted.
+  {
+    raw: "://example.org/test",
+    expectedUnicode: "://example.org/test",
+  },
+  {
+    raw: "://xn--g6w.xn--8pv/%E6%B8%AC%E8%A9%A6.html" +
+         "?%E4%B8%80=%E4%B8%80",
+    expectedUnicode: "://xn--g6w.xn--8pv/%E6%B8%AC%E8%A9%A6.html" +
+                     "?%E4%B8%80=%E4%B8%80",
+  },
+  {
+    // %E8%A9 isn't a valid UTF-8 code, so this URL is malformed.
+    raw: "https://xn--g6w.xn--8pv/%E6%B8%AC%E8%A9",
+    expectedUnicode: "https://xn--g6w.xn--8pv/%E6%B8%AC%E8%A9",
+  },
+];
+
+// List of hostanmes used to test Unicode hostname conversion
+const TEST_HOSTNAMES = [
+  // Type:     Readable ASCII hostnames
+  // Expected: All of Unicode versions should equal to the raw.
+  {
+    raw: "example",
+    expectedUnicode: "example",
+  },
+  {
+    raw: "example.org",
+    expectedUnicode: "example.org",
+  },
+  // Type:     Unreadable Punycode hostnames
+  // Expected: Punycode should be converted to readable Unicode.
+  {
+    raw: "xn--g6w",
+    // Do not type Unicode characters directly, because this test file isn't
+    // specified with a known encoding.
+    expectedUnicode: "\u6e2c",
+  },
+  {
+    raw: "xn--g6w.xn--8pv",
+    // Do not type Unicode characters directly, because this test file isn't
+    // specified with a known encoding.
+    expectedUnicode: "\u6e2c.\u672c",
+  },
+];
+
+// List of URL paths used to test Unicode URL path conversion
+const TEST_URL_PATHS = [
+  // Type:     Readable ASCII URL paths
+  // Expected: All of Unicode versions should equal to the raw.
+  {
+    raw: "test",
+    expectedUnicode: "test",
+  },
+  {
+    raw: "/",
+    expectedUnicode: "/",
+  },
+  {
+    raw: "/test",
+    expectedUnicode: "/test",
+  },
+  {
+    raw: "/test.html?one=1&two=2#here",
+    expectedUnicode: "/test.html?one=1&two=2#here",
+  },
+  // Type:     Unreadable URI-encoded URL paths
+  // Expected: URL paths should be converted to readable Unicode.
+  {
+    raw: "/%E6%B8%AC%E8%A9%A6",
+    // Do not type Unicode characters directly, because this test file isn't
+    // specified with a known encoding.
+    expectedUnicode: "/\u6e2c\u8a66",
+  },
+  {
+    raw: "/%E6%B8%AC%E8%A9%A6.html",
+    // Do not type Unicode characters directly, because this test file isn't
+    // specified with a known encoding.
+    expectedUnicode: "/\u6e2c\u8a66.html",
+  },
+  {
+    raw: "/%E6%B8%AC%E8%A9%A6.html" +
+         "?%E4%B8%80=%E4%B8%80&%E4%BA%8C=%E4%BA%8C" +
+         "#%E6%AD%A4",
+    // Do not type Unicode characters directly, because this test file isn't
+    // specified with a known encoding.
+    expectedUnicode: "/\u6e2c\u8a66.html" +
+                     "?\u4e00=\u4e00&\u4e8c=\u4e8c" +
+                     "#\u6b64",
+  },
+  // Type:     Malformed URL paths
+  // Expected: All should not be converted.
+  {
+    // %E8%A9 isn't a valid UTF-8 code, so this URL is malformed.
+    raw: "/%E6%B8%AC%E8%A9",
+    expectedUnicode: "/%E6%B8%AC%E8%A9",
+  },
+];
+
+function run_test() {
+  // Test URLs
+  for (let url of TEST_URLS) {
+    let result = getUnicodeUrl(url.raw);
+    equal(result, url.expectedUnicode,
+          "Test getUnicodeUrl: " + url.raw +
+            " should be unicodized to " + url.expectedUnicode);
+  }
+
+  // Test hostnames
+  for (let hostname of TEST_HOSTNAMES) {
+    let result = getUnicodeHostname(hostname.raw);
+    equal(result, hostname.expectedUnicode,
+          "Test getUnicodeHostname: " + hostname.raw +
+            " should be unicodized to " + hostname.expectedUnicode);
+  }
+
+  // Test URL paths
+  for (let urlPath of TEST_URL_PATHS) {
+    let result = getUnicodeUrlPath(urlPath.raw);
+    equal(result, urlPath.expectedUnicode,
+          "Test getUnicodeUrlPath: " + urlPath.raw +
+            " should be unicodized to " + urlPath.expectedUnicode);
+  }
+}

--- a/devtools/client/shared/test/unit/xpcshell.ini
+++ b/devtools/client/shared/test/unit/xpcshell.ini
@@ -20,10 +20,11 @@ support-files =
 [test_escapeCSSComment.js]
 [test_parseDeclarations.js]
 [test_parsePseudoClassesAndAttributes.js]
 [test_parseSingleValue.js]
 [test_rewriteDeclarations.js]
 [test_source-utils.js]
 [test_suggestion-picker.js]
 [test_undoStack.js]
+[test_unicode-url.js]
 [test_VariablesView_filtering-without-controller.js]
 [test_VariablesView_getString_promise.js]

new file mode 100644
--- /dev/null
+++ b/devtools/client/shared/unicode-url.js
@@ -0,0 +1,115 @@
+/* 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";
+
+// This file is a chrome-API-dependent version of the module
+// devtools/client/shared/webpack/shims/unicode-url-stub.js, so that it can
+// take advantage of utilizing chrome APIs. But because of this, it isn't
+// intended to be used in Chrome-API-free applications, such as the Launchpad.
+//
+// Please keep in mind that if the feature in this file has changed, don't
+// forget to also change that accordingly in
+// devtools/client/shared/webpack/shims/unicode-url-stub.js.
+
+const { Cc, Ci } = require("chrome");
+const idnService =
+        Cc["@mozilla.org/network/idn-service;1"].getService(Ci.nsIIDNService);
+
+/**
+ * Gets a readble Unicode hostname from a hostname.
+ *
+ * If the `hostname` is a readable ASCII hostname, such as example.org, then
+ * this function will simply return the original `hostname`.
+ *
+ * If the `hostname` is a Punycode hostname representing a Unicode domain name,
+ * such as xn--g6w.xn--8pv, then this function will return the readable Unicode
+ * domain name by decoding the Punycode hostname.
+ *
+ * @param {string}  hostname
+ *                  the hostname from which the Unicode hostname will be
+ *                  parsed, such as example.org, xn--g6w.xn--8pv.
+ * @return {string} The Unicode hostname. It may be the same as the `hostname`
+ *                  passed to this function if the `hostname` itself is
+ *                  a readable ASCII hostname or a Unicode hostname.
+ */
+function getUnicodeHostname(hostname) {
+  return idnService.convertToDisplayIDN(hostname, {});
+}
+
+/**
+ * Gets a readble Unicode URL pathname from a URL pathname.
+ *
+ * If the `urlPath` is a readable ASCII URL pathname, such as /a/b/c.js, then
+ * this function will simply return the original `urlPath`.
+ *
+ * If the `urlPath` is a URI-encoded pathname, such as %E8%A9%A6/%E6%B8%AC.js,
+ * then this function will return the readable Unicode pathname.
+ *
+ * If the `urlPath` is a malformed URL pathname, then this function will simply
+ * return the original `urlPath`.
+ *
+ * @param {string}  urlPath
+ *                  the URL path from which the Unicode URL path will be parsed,
+ *                  such as /a/b/c.js, %E8%A9%A6/%E6%B8%AC.js.
+ * @return {string} The Unicode URL Path. It may be the same as the `urlPath`
+ *                  passed to this function if the `urlPath` itself is a readable
+ *                  ASCII url or a Unicode url.
+ */
+function getUnicodeUrlPath(urlPath) {
+  try {
+    return decodeURIComponent(urlPath);
+  } catch (err) {
+    dump("Warning: getUnicodeUrlPath failed to get a Unicode URL from" +
+            `${urlPath}, reason: ${err}`);
+  }
+  return urlPath;
+}
+
+/**
+ * Gets a readable Unicode URL from a URL.
+ *
+ * If the `url` is a readable ASCII URL, such as http://example.org/a/b/c.js,
+ * then this function will simply return the original `url`.
+ *
+ * If the `url` includes either an unreadable Punycode domain name or an
+ * unreadable URI-encoded pathname, such as
+ * http://xn--g6w.xn--8pv/%E8%A9%A6/%E6%B8%AC.js, then this function will return
+ * the readable URL by decoding all its unreadable URL components to Unicode
+ * characters.
+ *
+ * If the `url` is a malformed URL, then this function will return the original
+ * `url`.
+ *
+ * If the `url` is a data: URI, then this function will return the original
+ * `url`.
+ *
+ * @param {string}  url
+ *                  the full URL, or a data: URI. from which the readable URL
+ *                  will be parsed, such as, http://example.org/a/b/c.js,
+ *                  http://xn--g6w.xn--8pv/%E8%A9%A6/%E6%B8%AC.js
+ * @return {string} The readable URL. It may be the same as the `url` passed to
+ *                  this function if the `url` itself is readable.
+ */
+function getUnicodeUrl(url) {
+  try {
+    const { protocol, hostname } = new URL(url);
+    if (protocol === "data:") {
+      // Never convert a data: URI.
+      return url;
+    }
+    const readableHostname = getUnicodeHostname(hostname);
+    url = decodeURIComponent(url);
+    return url.replace(hostname, readableHostname);
+  } catch (err) {
+    dump("Warning: getUnicodeUrl failed to get a Unicode URL from" +
+            `${url}, reason: ${err}`);
+  }
+  return url;
+}
+
+module.exports = {
+  getUnicodeHostname,
+  getUnicodeUrlPath,
+  getUnicodeUrl,
+};

new file mode 100644
--- /dev/null
+++ b/devtools/client/shared/webpack/shims/unicode-url-stub.js
@@ -0,0 +1,32 @@
+/* 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/. */
+
+// TODO This file aims to implement a Chrome-API-free replacement for
+// devtools/client/shared/unicode-url.js, so that it can be used in the
+// Launchpad.
+//
+// Currently this is just a dummpy mock of
+// devtools/client/shared/unicode-url.js, no actual functionaly involved.
+// Eventually we'll want to implement it. Once implemented, we should keep the
+// feature the same as devtools/client/shared/unicode-url.js.
+
+"use strict";
+
+function getUnicodeHostname(hostname) {
+  return hostname;
+}
+
+function getUnicodeUrlPath(urlPath) {
+  return urlPath;
+}
+
+function getUnicodeUrl(url) {
+  return url;
+}
+
+module.exports = {
+  getUnicodeHostname,
+  getUnicodeUrlPath,
+  getUnicodeUrl,
+};

--- a/devtools/client/sourceeditor/test/head.js
+++ b/devtools/client/sourceeditor/test/head.js
@@ -11,21 +11,16 @@
 Services.scriptloader.loadSubScript(
   "chrome://mochitests/content/browser/devtools/client/shared/test/shared-head.js",
   this);
 
 const { NetUtil } = require("resource://gre/modules/NetUtil.jsm");
 const Editor = require("devtools/client/sourceeditor/editor");
 const {getClientCssProperties} = require("devtools/shared/fronts/css-properties");
 
-flags.testing = true;
-SimpleTest.registerCleanupFunction(() => {
-  flags.testing = false;
-});
-
 function promiseWaitForFocus() {
   return new Promise(resolve =>
     waitForFocus(resolve));
 }
 
 function setup(cb, additionalOpts = {}) {
   cb = cb || function() {};
   return new Promise(resolve => {

--- a/devtools/client/storage/ui.js
+++ b/devtools/client/storage/ui.js
@@ -5,16 +5,17 @@
 
 "use strict";
 
 const EventEmitter = require("devtools/shared/event-emitter");
 const {LocalizationHelper, ELLIPSIS} = require("devtools/shared/l10n");
 const KeyShortcuts = require("devtools/client/shared/key-shortcuts");
 const JSOL = require("devtools/client/shared/vendor/jsol");
 const {KeyCodes} = require("devtools/client/shared/keycodes");
+const { getUnicodeHostname } = require("devtools/client/shared/unicode-url");
 
 // GUID to be used as a separator in compound keys. This must match the same
 // constant in devtools/server/actors/storage.js,
 // devtools/client/storage/test/head.js and
 // devtools/server/tests/browser/head.js
 const SEPARATOR_GUID = "{9d414cc5-8319-0a04-0586-c0a6ae01670a}";
 
 loader.lazyRequireGetter(this, "TreeWidget",
@@ -450,17 +451,18 @@ class StorageUI {
   /**
    * Handle added items received by onEdit
    *
    * @param {object} See onEdit docs
    */
   async handleAddedItems(added) {
     for (let type in added) {
       for (let host in added[type]) {
-        this.tree.add([type, {id: host, type: "url"}]);
+        const label = this.getReadableLabelFromHostname(host);
+        this.tree.add([type, {id: host, label: label, type: "url"}]);
         for (let name of added[type][host]) {
           try {
             name = JSON.parse(name);
             if (name.length == 3) {
               name.splice(2, 1);
             }
             this.tree.add([type, host, ...name]);
             if (!this.tree.selectedItem) {
@@ -667,17 +669,18 @@ class StorageUI {
         console.error("Unable to localize tree label type:" + type);
       }
       this.tree.add([{id: type, label: typeLabel, type: "store"}]);
       if (!storageTypes[type].hosts) {
         continue;
       }
       this.storageTypes[type] = storageTypes[type];
       for (let host in storageTypes[type].hosts) {
-        this.tree.add([type, {id: host, type: "url"}]);
+        const label = this.getReadableLabelFromHostname(host);
+        this.tree.add([type, {id: host, label: label, type: "url"}]);
         for (let name of storageTypes[type].hosts[host]) {
           try {
             let names = JSON.parse(name);
             this.tree.add([type, host, ...names]);
             if (!this.tree.selectedItem) {
               this.tree.selectedItem = [type, host, names[0], names[1]];
             }
           } catch (ex) {
@@ -768,23 +771,52 @@ class StorageUI {
         this.parseItemValue(key, item[key]);
       }
     }
 
     this.emit("sidebar-updated");
   }
 
   /**
+   * Gets a readable label from the hostname. If the hostname is a Punycode
+   * domain(I.e. an ASCII domain name representing a Unicode domain name), then
+   * this function decodes it to the readable Unicode domain name, and label
+   * the Unicode domain name toggether with the original domian name, and then
+   * return the label; if the hostname isn't a Punycode domain(I.e. it isn't
+   * encoded and is readable on its own), then this function simply returns the
+   * original hostname.
+   *
+   * @param {string} host
+   *        The string representing a host, e.g, example.com, example.com:8000
+   */
+  getReadableLabelFromHostname(host) {
+    try {
+      const { hostname } = new URL(host);
+      const unicodeHostname = getUnicodeHostname(hostname);
+      if (hostname !== unicodeHostname) {
+        // If the hostname is a Punycode domain representing a Unicode domain,
+        // we decode it to the Unicode domain name, and then label the Unicode
+        // domain name together with the original domain name.
+        return host.replace(hostname, unicodeHostname) + " [ " + host + " ]";
+      }
+    } catch (_) {
+      // Skip decoding for a host which doesn't include a domain name, simply
+      // consider them to be readable.
+    }
+    return host;
+  }
+
+  /**
    * Tries to parse a string value into either a json or a key-value separated
    * object and populates the sidebar with the parsed value. The value can also
    * be a key separated array.
    *
    * @param {string} name
    *        The key corresponding to the `value` string in the object
-   * @param {string} value
+   * @param {string} originalValue
    *        The string to be parsed into an object
    */
   parseItemValue(name, originalValue) {
     // Find if value is URLEncoded ie
     let decodedValue = "";
     try {
       decodedValue = decodeURIComponent(originalValue);
     } catch (e) {
@@ -876,18 +908,16 @@ class StorageUI {
     }
     return null;
   }
 
   /**
    * Select handler for the storage tree. Fetches details of the selected item
    * from the storage details and populates the storage tree.
    *
-   * @param {string} event
-   *        The name of the event fired
    * @param {array} item
    *        An array of ids which represent the location of the selected item in
    *        the storage tree
    */
   async onHostSelect(item) {
     this.table.clear();
     this.hideSidebar();
     this.searchBox.value = "";

--- a/devtools/client/webaudioeditor/controller.js
+++ b/devtools/client/webaudioeditor/controller.js
@@ -78,44 +78,44 @@ var WebAudioEditorController = {
     // early request to ensure the CallWatcherActor is running and watching for new window
     // globals.
     gFront.setup({ reload: false });
   },
 
   /**
    * Remove events emitted by the current tab target.
    */
-  destroy: function () {
+  destroy: function() {
     gTarget.off("will-navigate", this._onTabWillNavigate);
     gFront.off("start-context", this._onStartContext);
     gFront.off("create-node", this._onCreateNode);
     gFront.off("connect-node", this._onConnectNode);
     gFront.off("connect-param", this._onConnectParam);
     gFront.off("disconnect-node", this._onDisconnectNode);
     gFront.off("change-param", this._onChangeParam);
     gFront.off("destroy-node", this._onDestroyNode);
     this._prefObserver.off("devtools.theme", this._onThemeChange);
     this._prefObserver.destroy();
   },
 
   /**
    * Called when page is reloaded to show the reload notice and waiting
    * for an audio context notice.
    */
-  reset: function () {
+  reset: function() {
     $("#content").hidden = true;
     ContextView.resetUI();
     InspectorView.resetUI();
     PropertiesView.resetUI();
   },
 
   // Since node events (create, disconnect, connect) are all async,
   // we have to make sure to wait that the node has finished creating
   // before performing an operation on it.
-  getNode: async function (nodeActor) {
+  getNode: async function(nodeActor) {
     let id = nodeActor.actorID;
     let node = gAudioNodes.get(id);
 
     if (!node) {
       let { resolve, promise } = defer();
       gAudioNodes.on("add", function createNodeListener(createdNode) {
         if (createdNode.id === id) {
           gAudioNodes.off("add", createNodeListener);
@@ -127,17 +127,17 @@ var WebAudioEditorController = {
     return node;
   },
 
   /**
    * Fired when the devtools theme changes (light, dark, etc.)
    * so that the graph can update marker styling, as that
    * cannot currently be done with CSS.
    */
-  _onThemeChange: function () {
+  _onThemeChange: function() {
     let newValue = Services.prefs.getCharPref("devtools.theme");
     window.emit(EVENTS.THEME_CHANGE, newValue);
   },
 
   /**
    * Called for each location change in the debugged tab.
    */
   _onTabWillNavigate: function({isFrameSwitching}) {
@@ -162,36 +162,36 @@ var WebAudioEditorController = {
 
     window.emit(EVENTS.UI_RESET);
   },
 
   /**
    * Called after the first audio node is created in an audio context,
    * signaling that the audio context is being used.
    */
-  _onStartContext: function () {
+  _onStartContext: function() {
     $("#reload-notice").hidden = true;
     $("#waiting-notice").hidden = true;
     $("#content").hidden = false;
     window.emit(EVENTS.START_CONTEXT);
   },
 
   /**
    * Called when a new node is created. Creates an `AudioNodeView` instance
    * for tracking throughout the editor.
    */
-  _onCreateNode: function (nodeActor) {
+  _onCreateNode: function(nodeActor) {
     gAudioNodes.add(nodeActor);
   },
 
   /**
    * Called on `destroy-node` when an AudioNode is GC'd. Removes
    * from the AudioNode array and fires an event indicating the removal.
    */
-  _onDestroyNode: function (nodeActor) {
+  _onDestroyNode: function(nodeActor) {
     gAudioNodes.remove(gAudioNodes.get(nodeActor.actorID));
   },
 
   /**
    * Called when a node is connected to another node.
    */
   async _onConnectNode({ source: sourceActor, dest: destActor }) {
     let source = await WebAudioEditorController.getNode(sourceActor);

--- a/devtools/client/webaudioeditor/includes.js
+++ b/devtools/client/webaudioeditor/includes.js
@@ -79,18 +79,22 @@ var gToolbox, gTarget, gFront;
 /**
  * Convenient way of emitting events from the panel window.
  */
 EventEmitter.decorate(this);
 
 /**
  * DOM query helper.
  */
-function $(selector, target = document) { return target.querySelector(selector); }
-function $$(selector, target = document) { return target.querySelectorAll(selector); }
+function $(selector, target = document) {
+  return target.querySelector(selector);
+}
+function $$(selector, target = document) {
+  return target.querySelectorAll(selector);
+}
 
 /**
  * Takes an iterable collection, and a hash. Return the first
  * object in the collection that matches the values in the hash.
  * From Backbone.Collection#findWhere
  * http://backbonejs.org/#Collection-findWhere
  */
 function findWhere(collection, attrs) {

--- a/devtools/client/webaudioeditor/models.js
+++ b/devtools/client/webaudioeditor/models.js
@@ -136,17 +136,16 @@ class AudioNodeModel extends EventEmitte
     }
   }
 
   toString() {
     return "[object AudioNodeModel]";
   }
 }
 
-
 /**
  * Constructor for a Collection of `AudioNodeModel` models.
  *
  * Events:
  * - `add`: node
  * - `remove`: node
  * - `connect`: node, destinationNode, parameter
  * - `disconnect`: node
@@ -176,16 +175,17 @@ class AudioNodesCollection extends Event
    * instance.
    *
    * Emits "add" event on instance when completed.
    *
    * @param Object obj
    * @return AudioNodeModel
    */
   add(obj) {
+    // eslint-disable-next-line new-cap
     let node = new this.model(obj);
     node.collection = this;
 
     this.models.add(node);
 
     node.on("*", this._onModelEvent);
     EventEmitter.emit(this, "add", node);
     return node;

--- a/devtools/client/webaudioeditor/panel.js
+++ b/devtools/client/webaudioeditor/panel.js
@@ -15,17 +15,17 @@ function WebAudioEditorPanel(iframeWindo
   this._destroyer = null;
 
   EventEmitter.decorate(this);
 }
 
 exports.WebAudioEditorPanel = WebAudioEditorPanel;
 
 WebAudioEditorPanel.prototype = {
-  open: function () {
+  open: function() {
     let targetPromise;
 
     // Local debugging needs to make the target remote.
     if (!this.target.isRemote) {
       targetPromise = this.target.makeRemote();
     } else {
       targetPromise = Promise.resolve(this.target);
     }
@@ -50,17 +50,17 @@ WebAudioEditorPanel.prototype = {
   },
 
   // DevToolPanel API
 
   get target() {
     return this._toolbox.target;
   },
 
-  destroy: function () {
+  destroy: function() {
     // Make sure this panel is not already destroyed.
     if (this._destroyer) {
       return this._destroyer;
     }
 
     return this._destroyer = this.panelWin.shutdownWebAudioEditor().then(() => {
       // Destroy front to ensure packet handler is removed from client
       this.panelWin.gFront.destroy();

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-add-automation-event.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-add-automation-event.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test AudioNode#addAutomationEvent();
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_CONTEXT_URL);
   let [_, [destNode, oscNode, gainNode]] = await Promise.all([
     front.setup({ reload: true }),
     get3(front, "create-node")
   ]);
   let count = 0;
   let counter = () => count++;
   front.on("automation-event", counter);

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-bypass.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-bypass.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test AudioNode#bypass(), AudioNode#isBypassed()
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_CONTEXT_URL);
   let [_, [destNode, oscNode, gainNode]] = await Promise.all([
     front.setup({ reload: true }),
     get3(front, "create-node")
   ]);
 
   is((await gainNode.isBypassed()), false, "Nodes start off unbypassed.");
 

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-bypassable.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-bypassable.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test AudioNode#bypassable
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_NODES_URL);
   let [_, nodes] = await Promise.all([
     front.setup({ reload: true }),
     getN(front, "create-node", 14)
   ]);
 
   let actualBypassability = nodes.map(node => node.bypassable);
   let expectedBypassability = [

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-connectnode-disconnect.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-connectnode-disconnect.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that AudioNodeActor#connectNode() and AudioNodeActor#disconnect() work.
  * Uses the editor front as the actors do not retain connect state.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, gAudioNodes } = panelWin;
 
   let events = Promise.all([
     get3(gFront, "create-node"),
     waitForGraphRendered(panelWin, 3, 2)
   ]);

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-connectparam.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-connectparam.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that AudioNodeActor#connectParam() work.
  * Uses the editor front as the actors do not retain connect state.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, gAudioNodes } = panelWin;
 
   let events = Promise.all([
     get3(gFront, "create-node"),
     waitForGraphRendered(panelWin, 3, 2)
   ]);

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-get-automation-data-01.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-get-automation-data-01.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test AudioNode#addAutomationEvent() checking automation values, also using
  * a curve as the last event to check duration spread.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_CONTEXT_URL);
   let [_, [destNode, oscNode, gainNode]] = await Promise.all([
     front.setup({ reload: true }),
     get3(front, "create-node")
   ]);
 
   let t0 = 0, t1 = 0.1, t2 = 0.2, t3 = 0.3, t4 = 0.4, t5 = 0.6, t6 = 0.7, t7 = 1;
   let curve = [-1, 0, 1];

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-get-automation-data-02.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-get-automation-data-02.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test AudioNode#addAutomationEvent() when automation series ends with
  * `setTargetAtTime`, which approaches its target to infinity.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_CONTEXT_URL);
   let [_, [destNode, oscNode, gainNode]] = await Promise.all([
     front.setup({ reload: true }),
     get3(front, "create-node")
   ]);
 
   await oscNode.addAutomationEvent("frequency", "setValueAtTime", [300, 0.1]);
   await oscNode.addAutomationEvent("frequency", "linearRampToValueAtTime", [500, 0.4]);

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-get-automation-data-03.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-get-automation-data-03.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test that `cancelScheduledEvents` clears out events on and after
  * its argument.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_CONTEXT_URL);
   let [_, [destNode, oscNode, gainNode]] = await Promise.all([
     front.setup({ reload: true }),
     get3(front, "create-node")
   ]);
 
   await oscNode.addAutomationEvent("frequency", "setValueAtTime", [300, 0]);
   await oscNode.addAutomationEvent("frequency", "linearRampToValueAtTime", [500, 0.9]);

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-get-param-flags.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-get-param-flags.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test AudioNode#getParamFlags()
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_NODES_URL);
   let [_, nodes] = await Promise.all([
     front.setup({ reload: true }),
     getN(front, "create-node", 15)
   ]);
 
   let allNodeParams = await Promise.all(nodes.map(node => node.getParams()));
   let nodeTypes = [
@@ -28,20 +28,18 @@ add_task(async function () {
     let params = allNodeParams[i];
 
     for (let {param, value, flags} of params) {
       let testFlags = await nodes[i].getParamFlags(param);
       ok(typeof testFlags === "object", type + " has flags from #getParamFlags(" + param + ")");
 
       if (param === "buffer") {
         is(flags.Buffer, true, "`buffer` params have Buffer flag");
-      }
-      else if (param === "bufferSize" || param === "frequencyBinCount") {
+      } else if (param === "bufferSize" || param === "frequencyBinCount") {
         is(flags.readonly, true, param + " is readonly");
-      }
-      else if (param === "curve") {
-        is(flags["Float32Array"], true, "`curve` param has Float32Array flag");
+      } else if (param === "curve") {
+        is(flags.Float32Array, true, "`curve` param has Float32Array flag");
       }
     }
   }
 
   await removeTab(target.tab);
 });

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-get-params-01.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-get-params-01.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test AudioNode#getParams()
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_NODES_URL);
   let [_, nodes] = await Promise.all([
     front.setup({ reload: true }),
     getN(front, "create-node", 15)
   ]);
 
   await loadFrameScriptUtils();
 
@@ -30,20 +30,18 @@ add_task(async function () {
 
     params.forEach(({param, value, flags}) => {
       ok(param in defaults[i], "expected parameter for " + type);
 
       ok(typeof flags === "object", type + " has a flags object");
 
       if (param === "buffer") {
         is(flags.Buffer, true, "`buffer` params have Buffer flag");
-      }
-      else if (param === "bufferSize" || param === "frequencyBinCount") {
+      } else if (param === "bufferSize" || param === "frequencyBinCount") {
         is(flags.readonly, true, param + " is readonly");
-      }
-      else if (param === "curve") {
-        is(flags["Float32Array"], true, "`curve` param has Float32Array flag");
+      } else if (param === "curve") {
+        is(flags.Float32Array, true, "`curve` param has Float32Array flag");
       }
     });
   });
 
   await removeTab(target.tab);
 });

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-get-params-02.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-get-params-02.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that default properties are returned with the correct type
  * from the AudioNode actors.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_NODES_URL);
   let [_, nodes] = await Promise.all([
     front.setup({ reload: true }),
     getN(front, "create-node", 15)
   ]);
 
   await loadFrameScriptUtils();
 
@@ -34,18 +34,17 @@ add_task(async function () {
   await removeTab(target.tab);
 });
 
 function compare(actual, expected, type) {
   actual.forEach(({ value, param }) => {
     value = getGripValue(value);
     if (typeof expected[param] === "function") {
       ok(expected[param](value), type + " has a passing value for " + param);
-    }
-    else {
+    } else {
       is(value, expected[param], type + " has correct default value and type for " + param);
     }
   });
 
   info(Object.keys(expected).join(",") + " - " + JSON.stringify(expected));
 
   is(actual.length, Object.keys(expected).length,
     type + " has correct amount of properties.");

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-get-set-param.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-get-set-param.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test AudioNode#getParam() / AudioNode#setParam()
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_CONTEXT_URL);
   let [_, [destNode, oscNode, gainNode]] = await Promise.all([
     front.setup({ reload: true }),
     get3(front, "create-node")
   ]);
 
   let freq = await oscNode.getParam("frequency");
   info(typeof freq);

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-source.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-source.js
@@ -1,27 +1,28 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test AudioNode#source
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_NODES_URL);
   let [_, nodes] = await Promise.all([
     front.setup({ reload: true }),
     getN(front, "create-node", 14)
   ]);
 
   let actualTypes = nodes.map(node => node.type);
   let isSourceResult = nodes.map(node => node.source);
 
   actualTypes.forEach((type, i) => {
     let shouldBeSource = type === "AudioBufferSourceNode" || type === "OscillatorNode";
-    if (shouldBeSource)
+    if (shouldBeSource) {
       is(isSourceResult[i], true, type + "'s `source` is `true`");
-    else
+    } else {
       is(isSourceResult[i], false, type + "'s `source` is `false`");
+    }
   });
 
   await removeTab(target.tab);
 });

--- a/devtools/client/webaudioeditor/test/browser_audionode-actor-type.js
+++ b/devtools/client/webaudioeditor/test/browser_audionode-actor-type.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test AudioNode#type
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_NODES_URL);
   let [_, nodes] = await Promise.all([
     front.setup({ reload: true }),
     getN(front, "create-node", 14)
   ]);
 
   let actualTypes = nodes.map(node => node.type);
   let expectedTypes = [

--- a/devtools/client/webaudioeditor/test/browser_callwatcher-01.js
+++ b/devtools/client/webaudioeditor/test/browser_callwatcher-01.js
@@ -5,17 +5,17 @@
  * Bug 1130901
  * Tests to ensure that calling call/apply on methods wrapped
  * via CallWatcher do not throw a security permissions error:
  * "Error: Permission denied to access property 'call'"
  */
 
 const BUG_1130901_URL = EXAMPLE_URL + "doc_bug_1130901.html";
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(BUG_1130901_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, gAudioNodes } = panelWin;
 
   let rendered = waitForGraphRendered(panelWin, 3, 0);
   reload(target);
   await rendered;
 

--- a/devtools/client/webaudioeditor/test/browser_callwatcher-02.js
+++ b/devtools/client/webaudioeditor/test/browser_callwatcher-02.js
@@ -4,17 +4,17 @@
 /**
  * Bug 1112378
  * Tests to ensure that errors called on wrapped functions via call-watcher
  * correctly looks like the error comes from the content, not from within the devtools.
  */
 
 const BUG_1112378_URL = EXAMPLE_URL + "doc_bug_1112378.html";
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(BUG_1112378_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, gAudioNodes } = panelWin;
 
   loadFrameScriptUtils();
 
   let rendered = waitForGraphRendered(panelWin, 2, 0);
   reload(target);

--- a/devtools/client/webaudioeditor/test/browser_wa_automation-view-01.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_automation-view-01.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that automation view shows the correct view depending on if events
  * or params exist.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(AUTOMATION_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS } = panelWin;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([
     get3(gFront, "create-node"),

--- a/devtools/client/webaudioeditor/test/browser_wa_automation-view-02.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_automation-view-02.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that automation view selects the first parameter by default and
  * switching between AudioParam rerenders the graph.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(AUTOMATION_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, AutomationView } = panelWin;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([
     get3(gFront, "create-node"),

--- a/devtools/client/webaudioeditor/test/browser_wa_controller-01.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_controller-01.js
@@ -4,17 +4,17 @@
 /**
  * Bug 1125817
  * Tests to ensure that disconnecting a node immediately
  * after creating it does not fail.
  */
 
 const BUG_1125817_URL = EXAMPLE_URL + "doc_bug_1125817.html";
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(BUG_1125817_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, gAudioNodes } = panelWin;
 
   let events = Promise.all([
     once(gAudioNodes, "add", 2),
     once(gAudioNodes, "disconnect"),
     waitForGraphRendered(panelWin, 2, 0)

--- a/devtools/client/webaudioeditor/test/browser_wa_destroy-node-01.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_destroy-node-01.js
@@ -4,17 +4,17 @@
 /**
  * Tests that the destruction node event is fired and that the nodes are no
  * longer stored internally in the tool, that the graph is updated properly, and
  * that selecting a soon-to-be dead node clears the inspector.
  *
  * All done in one test since this test takes a few seconds to clear GC.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(DESTROY_NODES_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, gAudioNodes } = panelWin;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([
     getNSpread(gAudioNodes, "add", 13),

--- a/devtools/client/webaudioeditor/test/browser_wa_first-run.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_first-run.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that the reloading/onContentLoaded hooks work.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { gFront, $ } = panel.panelWin;
 
   is($("#reload-notice").hidden, false,
     "The 'reload this page' notice should initially be visible.");
   is($("#waiting-notice").hidden, true,
     "The 'waiting for an audio context' notice should initially be hidden.");
   is($("#content").hidden, true,

--- a/devtools/client/webaudioeditor/test/browser_wa_graph-click.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_graph-click.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that the clicking on a node in the GraphView opens and sets
  * the correct node in the InspectorView
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(COMPLEX_CONTEXT_URL);
   let panelWin = panel.panelWin;
   let { gFront, $, $$, InspectorView } = panelWin;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([
     getN(gFront, "create-node", 8),

--- a/devtools/client/webaudioeditor/test/browser_wa_graph-markers.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_graph-markers.js
@@ -2,17 +2,17 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that the SVG marker styling is updated when devtools theme changes.
  */
 
 const { setTheme } = require("devtools/client/shared/theme");
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, MARKER_STYLING } = panelWin;
 
   let currentTheme = Services.prefs.getCharPref("devtools.theme");
 
   ok(MARKER_STYLING.light, "Marker styling exists for light theme.");
   ok(MARKER_STYLING.dark, "Marker styling exists for dark theme.");

--- a/devtools/client/webaudioeditor/test/browser_wa_graph-render-01.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_graph-render-01.js
@@ -2,17 +2,17 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that SVG nodes and edges were created for the Graph View.
  */
 
 var connectCount = 0;
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, gAudioNodes } = panelWin;
 
   let started = once(gFront, "start-context");
 
   gAudioNodes.on("connect", onConnectNode);
 

--- a/devtools/client/webaudioeditor/test/browser_wa_graph-render-02.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_graph-render-02.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests more edge rendering for complex graphs.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(COMPLEX_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$ } = panelWin;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([
     getN(gFront, "create-node", 8),
@@ -18,17 +18,16 @@ add_task(async function () {
   ]);
   reload(target);
   let [actors] = await events;
   let nodeIDs = actors.map(actor => actor.actorID);
 
   let types = ["AudioDestinationNode", "OscillatorNode", "GainNode", "ScriptProcessorNode",
                "OscillatorNode", "GainNode", "AudioBufferSourceNode", "BiquadFilterNode"];
 
-
   types.forEach((type, i) => {
     ok(findGraphNode(panelWin, nodeIDs[i]).classList.contains("type-" + type), "found " + type + " with class");
   });
 
   let edges = [
     [1, 2, "osc1 -> gain1"],
     [1, 3, "osc1 -> proc"],
     [2, 0, "gain1 -> dest"],

--- a/devtools/client/webaudioeditor/test/browser_wa_graph-render-03.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_graph-render-03.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests to ensure that selected nodes stay selected on graph redraw.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS } = panelWin;
 
   let events = Promise.all([
     getN(gFront, "create-node", 3),
     waitForGraphRendered(panelWin, 3, 2)
   ]);

--- a/devtools/client/webaudioeditor/test/browser_wa_graph-render-04.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_graph-render-04.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests audio param connection rendering.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(CONNECT_MULTI_PARAM_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS } = panelWin;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([
     getN(gFront, "create-node", 5),

--- a/devtools/client/webaudioeditor/test/browser_wa_graph-render-05.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_graph-render-05.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests to ensure that param connections trigger graph redraws
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS } = panelWin;
 
   let events = Promise.all([
     getN(gFront, "create-node", 3),
     waitForGraphRendered(panelWin, 3, 2, 0)
   ]);

--- a/devtools/client/webaudioeditor/test/browser_wa_graph-render-06.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_graph-render-06.js
@@ -2,17 +2,17 @@
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests to ensure that param connections trigger graph redraws
  */
 
 const BUG_1141261_URL = EXAMPLE_URL + "doc_bug_1141261.html";
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(BUG_1141261_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS } = panelWin;
 
   let events = Promise.all([
     getN(gFront, "create-node", 3),
     waitForGraphRendered(panelWin, 3, 1, 0)
   ]);

--- a/devtools/client/webaudioeditor/test/browser_wa_graph-selected.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_graph-selected.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that SVG nodes and edges were created for the Graph View.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS } = panelWin;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([
     get3(gFront, "create-node"),

--- a/devtools/client/webaudioeditor/test/browser_wa_graph-zoom.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_graph-zoom.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that the graph's scale and position is reset on a page reload.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, ContextView } = panelWin;
 
   let started = once(gFront, "start-context");
 
   await Promise.all([
     waitForGraphRendered(panelWin, 3, 2),

--- a/devtools/client/webaudioeditor/test/browser_wa_inspector-bypass-01.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_inspector-bypass-01.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that nodes are correctly bypassed when bypassing.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, gAudioNodes } = panelWin;
 
   let events = Promise.all([
     get3(gFront, "create-node"),
     waitForGraphRendered(panelWin, 3, 2)
   ]);

--- a/devtools/client/webaudioeditor/test/browser_wa_inspector-toggle.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_inspector-toggle.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that the inspector toggle button shows and hides
  * the inspector panel as intended.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, InspectorView } = panelWin;
   let gVars = InspectorView._propsView;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([

--- a/devtools/client/webaudioeditor/test/browser_wa_inspector-width.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_inspector-width.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test that the WebAudioInspector's Width is saved as
  * a preference
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, InspectorView } = panelWin;
   let gVars = InspectorView._propsView;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([

--- a/devtools/client/webaudioeditor/test/browser_wa_inspector.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_inspector.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that inspector view opens on graph node click, and
  * loads the correct node inside the inspector.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, InspectorView } = panelWin;
   let gVars = InspectorView._propsView;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([

--- a/devtools/client/webaudioeditor/test/browser_wa_navigate.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_navigate.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests naviating from a page to another will repopulate
  * the audio graph if both pages have an AudioContext.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $ } = panelWin;
 
   let events = Promise.all([
     get3(gFront, "create-node"),
     waitForGraphRendered(panelWin, 3, 2)
   ]);

--- a/devtools/client/webaudioeditor/test/browser_wa_properties-view-edit-01.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_properties-view-edit-01.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that properties are updated when modifying the VariablesView.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, PropertiesView } = panelWin;
   let gVars = PropertiesView._propsView;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([
@@ -32,34 +32,34 @@ add_task(async function () {
 
   checkVariableView(gVars, 0, {
     "type": "sine",
     "frequency": 440,
     "detune": 0
   }, "default loaded string");
 
   click(panelWin, findGraphNode(panelWin, nodeIds[2]));
-  await waitForInspectorRender(panelWin, EVENTS),
+  await waitForInspectorRender(panelWin, EVENTS);
   checkVariableView(gVars, 0, {
     "gain": 0
   }, "default loaded number");
 
   click(panelWin, findGraphNode(panelWin, nodeIds[1]));
-  await waitForInspectorRender(panelWin, EVENTS),
+  await waitForInspectorRender(panelWin, EVENTS);
   await setAndCheck(0, "type", "square", "square", "sets string as string");
 
   click(panelWin, findGraphNode(panelWin, nodeIds[2]));
-  await waitForInspectorRender(panelWin, EVENTS),
+  await waitForInspectorRender(panelWin, EVENTS);
   await setAndCheck(0, "gain", "0.005", 0.005, "sets number as number");
   await setAndCheck(0, "gain", "0.1", 0.1, "sets float as float");
   await setAndCheck(0, "gain", ".2", 0.2, "sets float without leading zero as float");
 
   await teardown(target);
 });
 
 function setAndCheckVariable(panelWin, gVars) {
-  return async function (varNum, prop, value, expected, desc) {
+  return async function(varNum, prop, value, expected, desc) {
     await modifyVariableView(panelWin, gVars, varNum, prop, value);
     var props = {};
     props[prop] = expected;
     checkVariableView(gVars, varNum, props, desc);
   };
 }

--- a/devtools/client/webaudioeditor/test/browser_wa_properties-view-edit-02.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_properties-view-edit-02.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that properties are not updated when modifying the VariablesView.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(COMPLEX_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, PropertiesView } = panelWin;
   let gVars = PropertiesView._propsView;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([

--- a/devtools/client/webaudioeditor/test/browser_wa_properties-view-media-nodes.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_properties-view-media-nodes.js
@@ -10,32 +10,33 @@ var MEDIA_PERMISSION = "media.navigator.
 
 function waitForDeviceClosed() {
   info("Checking that getUserMedia streams are no longer in use.");
 
   let temp = {};
   ChromeUtils.import("resource:///modules/webrtcUI.jsm", temp);
   let webrtcUI = temp.webrtcUI;
 
-  if (!webrtcUI.showGlobalIndicator)
+  if (!webrtcUI.showGlobalIndicator) {
     return Promise.resolve();
+  }
 
   return new Promise((resolve, reject) => {
     const message = "webrtc:UpdateGlobalIndicators";
     Services.ppmm.addMessageListener(message, function listener(aMessage) {
       info("Received " + message + " message");
       if (!aMessage.data.showGlobalIndicator) {
         Services.ppmm.removeMessageListener(message, listener);
         resolve();
       }
     });
   });
 }
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(MEDIA_NODES_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, PropertiesView } = panelWin;
   let gVars = PropertiesView._propsView;
 
   // Auto enable getUserMedia
   let mediaPermissionPref = Services.prefs.getBoolPref(MEDIA_PERMISSION);
   Services.prefs.setBoolPref(MEDIA_PERMISSION, true);

--- a/devtools/client/webaudioeditor/test/browser_wa_properties-view-params-objects.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_properties-view-params-objects.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that params view correctly displays non-primitive properties
  * like AudioBuffer and Float32Array in properties of AudioNodes.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(BUFFER_AND_ARRAY_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, PropertiesView } = panelWin;
   let gVars = PropertiesView._propsView;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([

--- a/devtools/client/webaudioeditor/test/browser_wa_properties-view-params.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_properties-view-params.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that params view correctly displays all properties for nodes
  * correctly, with default values and correct types.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_NODES_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, PropertiesView } = panelWin;
   let gVars = PropertiesView._propsView;
 
   let started = once(gFront, "start-context");
 
   await loadFrameScriptUtils();

--- a/devtools/client/webaudioeditor/test/browser_wa_properties-view.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_properties-view.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that params view shows params when they exist, and are hidden otherwise.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, $$, EVENTS, PropertiesView } = panelWin;
   let gVars = PropertiesView._propsView;
 
   let started = once(gFront, "start-context");
 
   let events = Promise.all([

--- a/devtools/client/webaudioeditor/test/browser_wa_reset-01.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_reset-01.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that reloading a tab will properly listen for the `start-context`
  * event and reshow the tools after reloading.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { gFront, $ } = panel.panelWin;
 
   is($("#reload-notice").hidden, false,
     "The 'reload this page' notice should initially be visible.");
   is($("#waiting-notice").hidden, true,
     "The 'waiting for an audio context' notice should initially be hidden.");
   is($("#content").hidden, true,

--- a/devtools/client/webaudioeditor/test/browser_wa_reset-02.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_reset-02.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests reloading a tab with the tools open properly cleans up
  * the graph.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $ } = panelWin;
 
   let events = Promise.all([
     get3(gFront, "create-node"),
     waitForGraphRendered(panelWin, 3, 2)
   ]);

--- a/devtools/client/webaudioeditor/test/browser_wa_reset-03.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_reset-03.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests reloading a tab with the tools open properly cleans up
  * the inspector and selected node.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, panel } = await initWebAudioEditor(SIMPLE_CONTEXT_URL);
   let { panelWin } = panel;
   let { gFront, $, InspectorView } = panelWin;
 
   let events = Promise.all([
     get3(gFront, "create-node"),
     waitForGraphRendered(panelWin, 3, 2)
   ]);

--- a/devtools/client/webaudioeditor/test/browser_wa_reset-04.js
+++ b/devtools/client/webaudioeditor/test/browser_wa_reset-04.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Tests that switching to an iframe works fine.
  */
 
-add_task(async function () {
+add_task(async function() {
   Services.prefs.setBoolPref("devtools.command-button-frames.enabled", true);
 
   let { target, panel, toolbox } = await initWebAudioEditor(IFRAME_CONTEXT_URL);
   let { gFront, $ } = panel.panelWin;
 
   is($("#reload-notice").hidden, false,
     "The 'reload this page' notice should initially be visible.");
   is($("#waiting-notice").hidden, true,

--- a/devtools/client/webaudioeditor/test/browser_webaudio-actor-automation-event.js
+++ b/devtools/client/webaudioeditor/test/browser_webaudio-actor-automation-event.js
@@ -1,17 +1,17 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test that the WebAudioActor receives and emits the `automation-event` events
  * with correct arguments from the content.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(AUTOMATION_URL);
   let events = [];
 
   let expected = [
     ["setValueAtTime", 0.2, 0],
     ["linearRampToValueAtTime", 1, 0.3],
     ["exponentialRampToValueAtTime", 0.75, 0.6],
     ["setValueCurveAtTime", [-1, 0, 1], 0.7, 0.3],

--- a/devtools/client/webaudioeditor/test/browser_webaudio-actor-connect-param.js
+++ b/devtools/client/webaudioeditor/test/browser_webaudio-actor-connect-param.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test the `connect-param` event on the web audio actor.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(CONNECT_PARAM_URL);
   let [, , [destNode, carrierNode, modNode, gainNode], , connectParam] = await Promise.all([
     front.setup({ reload: true }),
     once(front, "start-context"),
     getN(front, "create-node", 4),
     get2(front, "connect-node"),
     once(front, "connect-param")
   ]);

--- a/devtools/client/webaudioeditor/test/browser_webaudio-actor-destroy-node.js
+++ b/devtools/client/webaudioeditor/test/browser_webaudio-actor-destroy-node.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test `destroy-node` event on WebAudioActor.
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(DESTROY_NODES_URL);
 
   let [, , created] = await Promise.all([
     front.setup({ reload: true }),
     once(front, "start-context"),
     // Should create dest, gain, and oscillator node and 10
     // disposable buffer nodes
     getN(front, "create-node", 13)
@@ -29,13 +29,14 @@ add_task(async function () {
       "`destroy-node` called only on AudioNodes in current document.");
   });
 
   await removeTab(target.tab);
 });
 
 function actorIsInList(list, actor) {
   for (let i = 0; i < list.length; i++) {
-    if (list[i].actorID === actor.actorID)
+    if (list[i].actorID === actor.actorID) {
       return list[i];
+    }
   }
   return null;
 }

--- a/devtools/client/webaudioeditor/test/browser_webaudio-actor-simple.js
+++ b/devtools/client/webaudioeditor/test/browser_webaudio-actor-simple.js
@@ -1,16 +1,16 @@
 /* Any copyright is dedicated to the Public Domain.
    http://creativecommons.org/publicdomain/zero/1.0/ */
 
 /**
  * Test basic communication of Web Audio actor
  */
 
-add_task(async function () {
+add_task(async function() {
   let { target, front } = await initBackend(SIMPLE_CONTEXT_URL);
   let [_, __, [destNode, oscNode, gainNode], [connect1, connect2]] = await Promise.all([
     front.setup({ reload: true }),
     once(front, "start-context"),
     get3(front, "create-node"),
     get2(front, "connect-node")
   ]);
 

--- a/devtools/client/webaudioeditor/test/doc_buffer-and-array.html
+++ b/devtools/client/webaudioeditor/test/doc_buffer-and-array.html
@@ -37,17 +37,17 @@
         for (let i = 0; i < n; ++i) {
           let x = (i - n2) / n2;
           let y = Math.atan(5 * x) / (0.5 * Math.PI);
         }
 
         return curve;
       }
 
-      function getBuffer (url, callback) {
+      function getBuffer(url, callback) {
         let xhr = new XMLHttpRequest();
         xhr.open("GET", url, true);
         xhr.responseType = "arraybuffer";
         xhr.onload = callback;
         xhr.send();
         return xhr;
       }
     </script>