3 files changed, 69 insertions, 0 deletions
diff --git a/devtools/client/inspector/changes/utils/changes-utils.js b/devtools/client/inspector/changes/utils/changes-utils.js
new file mode 100644
index 0000000000..3e8505dc17
--- /dev/null
+++ b/devtools/client/inspector/changes/utils/changes-utils.js
@@ -0,0 +1,44 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const {
+  getFormatStr,
+  getStr,
+} = require("resource://devtools/client/inspector/changes/utils/l10n.js");
+
+/**
+ * Get a human-friendly style source path to display in the Changes panel.
+ * For element inline styles, return a string indicating that.
+ * For inline stylesheets, return a string indicating that plus the stylesheet's index.
+ * For URLs, return just the stylesheet filename.
+ *
+ * @param {Object} source
+ *        Information about the style source. Contains:
+ *        - type: {String} One of "element" or "stylesheet"
+ *        - href: {String|null} Stylesheet URL or document URL for elmeent inline styles
+ *        - index: {Number} Position of the stylesheet in its document's stylesheet list.
+ * @return {String}
+ */
+function getSourceForDisplay(source) {
+  let href;
+
+  switch (source.type) {
+    case "element":
+      href = getStr("changes.elementStyleLabel");
+      break;
+    case "inline":
+      href = getFormatStr("changes.inlineStyleSheetLabel", `#${source.index}`);
+      break;
+    case "stylesheet":
+      const url = new URL(source.href);
+      href = url.pathname.substring(url.pathname.lastIndexOf("/") + 1);
+      break;
+  }
+
+  return href;
+}
+
+module.exports.getSourceForDisplay = getSourceForDisplay;
diff --git a/devtools/client/inspector/changes/utils/l10n.js b/devtools/client/inspector/changes/utils/l10n.js
new file mode 100644
index 0000000000..693a1ec3cf
--- /dev/null
+++ b/devtools/client/inspector/changes/utils/l10n.js
@@ -0,0 +1,15 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+
+"use strict";
+
+const { LocalizationHelper } = require("resource://devtools/shared/l10n.js");
+const L10N = new LocalizationHelper(
+  "devtools/client/locales/changes.properties"
+);
+
+module.exports = {
+  getStr: (...args) => L10N.getStr(...args),
+  getFormatStr: (...args) => L10N.getFormatStr(...args),
+};
diff --git a/devtools/client/inspector/changes/utils/moz.build b/devtools/client/inspector/changes/utils/moz.build
new file mode 100644
index 0000000000..155752e0d8
--- /dev/null
+++ b/devtools/client/inspector/changes/utils/moz.build
@@ -0,0 +1,10 @@
+# -*- Mode: python; indent-tabs-mode: nil; tab-width: 40 -*-
+# vim: set filetype=python:
+# 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/.
+
+DevToolsModules(
+    "changes-utils.js",
+    "l10n.js",
+)