--- 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/unicode-url.js
+++ b/devtools/client/shared/unicode-url.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/. */
 "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

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/webconsole/reducers/messages.js
+++ b/devtools/client/webconsole/reducers/messages.js
@@ -13,16 +13,17 @@ const {
 const constants = require("devtools/client/webconsole/constants");
 const {
   DEFAULT_FILTERS,
   FILTERS,
   MESSAGE_TYPE,
   MESSAGE_SOURCE,
 } = constants;
 const { getGripPreviewItems } = require("devtools/client/shared/components/reps/reps");
+const { getUnicodeUrlPath } = require("devtools/client/shared/unicode-url");
 const { getSourceNames } = require("devtools/client/shared/source-utils");
 
 const {
   UPDATE_REQUEST,
 } = require("devtools/client/netmonitor/src/constants");
 
 const {
   processNetworkUpdates,
@@ -777,20 +778,23 @@ function isTextInFrame(text, frame) {
 
   const {
     functionName,
     line,
     column,
     source
   } = frame;
   const { short } = getSourceNames(source);
+  const unicodeShort = getUnicodeUrlPath(short);
 
-  return `${functionName ? functionName + " " : ""}${short}:${line}:${column}`
+  const includes =
+    `${functionName ? functionName + " " : ""}${unicodeShort}:${line}:${column}`
     .toLocaleLowerCase()
     .includes(text.toLocaleLowerCase());
+  return includes;
 }
 
 /**
 * Returns true if given text is included in provided parameters.
 */
 function isTextInParameters(text, parameters) {
   if (!parameters) {
     return false;

--- a/devtools/client/webconsole/webpack.config.js
+++ b/devtools/client/webconsole/webpack.config.js
@@ -88,16 +88,17 @@ webpackConfig.resolve = {
     "devtools/client/shared/vendor/reselect": "reselect",
 
     "resource://gre/modules/AppConstants.jsm": path.join(__dirname, "../../client/shared/webpack/shims/app-constants-stub"),
 
     "devtools/client/framework/devtools": path.join(__dirname, "../../client/shared/webpack/shims/framework-devtools-shim"),
     "devtools/client/framework/menu": "devtools-modules/src/menu",
     "devtools/client/sourceeditor/editor": "devtools-source-editor/src/source-editor",
 
+    "devtools/client/shared/unicode-url": path.join(__dirname, "../../client/shared/webpack/shims/unicode-url-stub"),
     "devtools/client/shared/zoom-keys": "devtools-modules/src/zoom-keys",
 
     "devtools/shared/fronts/timeline": path.join(__dirname, "../../client/shared/webpack/shims/fronts-timeline-shim"),
     "devtools/shared/old-event-emitter": "devtools-modules/src/utils/event-emitter",
     "devtools/shared/event-emitter": "devtools-modules/src/utils/event-emitter",
     "devtools/shared/client/debugger-client": path.join(__dirname, "test/fixtures/DebuggerClient"),
     "devtools/shared/platform/clipboard": path.join(__dirname, "../../client/shared/webpack/shims/platform-clipboard-stub"),
     "devtools/shared/platform/stack": path.join(__dirname, "../../client/shared/webpack/shims/platform-stack-stub"),