summaryrefslogtreecommitdiffstats
path: root/devtools/server/css-logic.js
diff options
context:
space:
mode:
authorjanekptacijarabaci <janekptacijarabaci@seznam.cz>2018-02-02 20:42:28 +0100
committerjanekptacijarabaci <janekptacijarabaci@seznam.cz>2018-02-02 20:42:28 +0100
commitf34094bae31e216228d5c2da2f2461d03df38302 (patch)
treebe78d0059fafcf0bfc451b9add9a0dbd175a4a85 /devtools/server/css-logic.js
parent9627f18cebab38cdfe45592d83371ee7bbc62cfa (diff)
downloadUXP-f34094bae31e216228d5c2da2f2461d03df38302.tar
UXP-f34094bae31e216228d5c2da2f2461d03df38302.tar.gz
UXP-f34094bae31e216228d5c2da2f2461d03df38302.tar.lz
UXP-f34094bae31e216228d5c2da2f2461d03df38302.tar.xz
UXP-f34094bae31e216228d5c2da2f2461d03df38302.zip
Add a "copy full CSS path" option to the inspector's menu
Issue #3
Diffstat (limited to 'devtools/server/css-logic.js')
-rw-r--r--devtools/server/css-logic.js49
1 files changed, 49 insertions, 0 deletions
diff --git a/devtools/server/css-logic.js b/devtools/server/css-logic.js
index f632871e1..c4a073635 100644
--- a/devtools/server/css-logic.js
+++ b/devtools/server/css-logic.js
@@ -793,6 +793,55 @@ CssLogic.findCssSelector = function (ele) {
};
/**
+ * Get the full CSS path for a given element.
+ * @returns a string that can be used as a CSS selector for the element. It might not
+ * match the element uniquely. It does however, represent the full path from the root
+ * node to the element.
+ */
+CssLogic.getCssPath = function (ele) {
+ ele = getRootBindingParent(ele);
+ const document = ele.ownerDocument;
+ if (!document || !document.contains(ele)) {
+ throw new Error("getCssPath received element not inside document");
+ }
+
+ const getElementSelector = element => {
+ if (!element.localName) {
+ return "";
+ }
+
+ let label = element.nodeName == element.nodeName.toUpperCase()
+ ? element.localName.toLowerCase()
+ : element.localName;
+
+ if (element.id) {
+ label += "#" + element.id;
+ }
+
+ if (element.classList) {
+ for (let cl of element.classList) {
+ label += "." + cl;
+ }
+ }
+
+ return label;
+ };
+
+ let paths = [];
+
+ while (ele) {
+ if (!ele || ele.nodeType !== Node.ELEMENT_NODE) {
+ break;
+ }
+
+ paths.splice(0, 0, getElementSelector(ele));
+ ele = ele.parentNode;
+ }
+
+ return paths.length ? paths.join(" ") : "";
+}
+
+/**
* A safe way to access cached bits of information about a stylesheet.
*
* @constructor