diff options
| author | janekptacijarabaci <janekptacijarabaci@seznam.cz> | 2018-02-02 20:42:28 +0100 |
|---|---|---|
| committer | janekptacijarabaci <janekptacijarabaci@seznam.cz> | 2018-02-02 20:42:28 +0100 |
| commit | f34094bae31e216228d5c2da2f2461d03df38302 (patch) | |
| tree | be78d0059fafcf0bfc451b9add9a0dbd175a4a85 /devtools/shared | |
| parent | 9627f18cebab38cdfe45592d83371ee7bbc62cfa (diff) | |
| download | UXP-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/shared')
| -rw-r--r-- | devtools/shared/specs/node.js | 6 | ||||
| -rw-r--r-- | devtools/shared/tests/mochitest/chrome.ini | 3 | ||||
| -rw-r--r-- | devtools/shared/tests/mochitest/test_css-logic-getCssPath.html | 121 |
3 files changed, 129 insertions, 1 deletions
diff --git a/devtools/shared/specs/node.js b/devtools/shared/specs/node.js index ea3d1b264..022d7f1ac 100644 --- a/devtools/shared/specs/node.js +++ b/devtools/shared/specs/node.js @@ -37,6 +37,12 @@ const nodeSpec = generateActorSpec({ value: RetVal("string") } }, + getCssPath: { + request: {}, + response: { + value: RetVal("string") + } + }, scrollIntoView: { request: {}, response: {} diff --git a/devtools/shared/tests/mochitest/chrome.ini b/devtools/shared/tests/mochitest/chrome.ini index 85ece7c48..3e4e028d1 100644 --- a/devtools/shared/tests/mochitest/chrome.ini +++ b/devtools/shared/tests/mochitest/chrome.ini @@ -2,6 +2,7 @@ tags = devtools skip-if = os == 'android' -[test_eventemitter_basic.html] +[test_css-logic-getCssPath.html] [test_devtools_extensions.html] +[test_eventemitter_basic.html] skip-if = os == 'linux' && debug # Bug 1205739 diff --git a/devtools/shared/tests/mochitest/test_css-logic-getCssPath.html b/devtools/shared/tests/mochitest/test_css-logic-getCssPath.html new file mode 100644 index 000000000..2c444308a --- /dev/null +++ b/devtools/shared/tests/mochitest/test_css-logic-getCssPath.html @@ -0,0 +1,121 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=1323700 +--> +<head> + <meta charset="utf-8"> + <title>Test for Bug 1323700</title> + + <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script> + <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css"> + <script type="application/javascript;version=1.8"> +const { classes: Cc, interfaces: Ci, utils: Cu } = Components; + +let { require } = Cu.import("resource://devtools/shared/Loader.jsm", {}); +const CssLogic = require("devtools/shared/inspector/css-logic"); + +var _tests = []; +function addTest(test) { + _tests.push(test); +} + +function runNextTest() { + if (_tests.length == 0) { + SimpleTest.finish() + return; + } + _tests.shift()(); +} + +window.onload = function() { + SimpleTest.waitForExplicitFinish(); + runNextTest(); +} + +addTest(function getCssPathForUnattachedElement() { + var unattached = document.createElement("div"); + unattached.id = "unattached"; + try { + CssLogic.getCssPath(unattached); + ok(false, "Unattached node did not throw") + } catch(e) { + ok(e, "Unattached node throws an exception"); + } + + var unattachedChild = document.createElement("div"); + unattached.appendChild(unattachedChild); + try { + CssLogic.getCssPath(unattachedChild); + ok(false, "Unattached child node did not throw") + } catch(e) { + ok(e, "Unattached child node throws an exception"); + } + + var unattachedBody = document.createElement("body"); + try { + CssLogic.getCssPath(unattachedBody); + ok(false, "Unattached body node did not throw") + } catch(e) { + ok(e, "Unattached body node throws an exception"); + } + + runNextTest(); +}); + +addTest(function cssPathHasOneStepForEachAncestor() { + for (let el of [...document.querySelectorAll('*')]) { + let splitPath = CssLogic.getCssPath(el).split(" "); + + let expectedNbOfParts = 0; + var parent = el.parentNode; + while (parent) { + expectedNbOfParts ++; + parent = parent.parentNode; + } + + is(splitPath.length, expectedNbOfParts, "There are enough parts in the full path"); + } + + runNextTest(); +}); + +addTest(function getCssPath() { + let data = [{ + selector: "#id", + path: "html body div div div.class div#id" + }, { + selector: "html", + path: "html" + }, { + selector: "body", + path: "html body" + }, { + selector: ".c1.c2.c3", + path: "html body span.c1.c2.c3" + }, { + selector: "#i", + path: "html body span#i.c1.c2" + }]; + + for (let {selector, path} of data) { + let node = document.querySelector(selector); + is (CssLogic.getCssPath(node), path, `Full css path is correct for ${selector}`); + } + + runNextTest(); +}); + </script> +</head> +<body> + <div> + <div> + <div class="class"> + <div id="id"></div> + </div> + </div> + </div> + <span class="c1 c2 c3"></span> + <span id="i" class="c1 c2"></span> +</body> +</html> |