Bug 1085119 - Add unit tests for css-logic row and column precedence r?gl draft
authorCosine <judahiii@gmail.com>
Thu, 31 Aug 2017 16:49:29 -0400
changeset 656905 d862f8956fdefbdd0813a28cb08380909bd0a4cc
parent 656904 32a9b040e727d12e735d13aa7919a0aaedbb83bb
child 729285 13b60d2dd9c40d8f9df7b5362ac03b38aba0b582
push id77370
push userbmo:judahiii@gmail.com
push dateThu, 31 Aug 2017 20:52:11 +0000
reviewersgl
bugs1085119
milestone57.0a1
Bug 1085119 - Add unit tests for css-logic row and column precedence r?gl MozReview-Commit-ID: 4zz7hFOQJAj
devtools/server/tests/mochitest/inspector-styles-data.html
devtools/server/tests/mochitest/test_styles-matched.html
--- a/devtools/server/tests/mochitest/inspector-styles-data.html
+++ b/devtools/server/tests/mochitest/inspector-styles-data.html
@@ -5,16 +5,18 @@
   window.onload = () => {
     window.opener.postMessage("ready", "*");
   };
 </script>
 <style>
   .inheritable-rule {
     font-size: 15px;
   }
+  /* Has to be on one line, is such for test */
+  .column-rule { font-size: 20px; } .column-rule { font-size: 25px; }
   .uninheritable-rule {
     background-color: #f06;
   }
   @media screen {
     #mediaqueried {
       background-color: #f06;
     }
   }
@@ -57,17 +59,17 @@
   <!-- Computed checks -->
   <div id="computed-parent" class="external-rule inheritable-rule uninheritable-rule" style="color: red;">
     <div id="computed-test-node" class="external-rule">
       Here is the test node.
     </div>
   </div>
 
   <!-- Matched checks -->
-  <div id="matched-parent" class="external-rule inheritable-rule uninheritable-rule" style="color: red;">
+  <div id="matched-parent" class="external-rule inheritable-rule column-rule uninheritable-rule" style="color: red;">
     <div id="matched-test-node" style="font-size: 10px" class="external-rule">
       Here is the test node.
     </div>
   </div>
 
   <div id="mediaqueried">
     Screen mediaqueried.
   </div>
--- a/devtools/server/tests/mochitest/test_styles-matched.html
+++ b/devtools/server/tests/mochitest/test_styles-matched.html
@@ -47,27 +47,32 @@ addTest(function testMatchedStyles() {
     is(matched[0].sourceText, "this.style", "First match comes from the element style");
     is(matched[0].selector, "@element.style", "Element style has a special selector");
     is(matched[0].value, "10px", "First match has the expected value");
     is(matched[0].status, CssLogic.STATUS.BEST, "First match is the best match");
     is(matched[0].rule.type, 100, "First match is an element style");
     is(matched[0].rule.href, gInspectee.defaultView.location.href,
        "Node style comes from this document");
 
-    is(matched[1].sourceText, ".inheritable-rule", "Second match comes from a rule");
-    is(matched[1].selector, ".inheritable-rule", "Second style has a selector");
-    is(matched[1].value, "15px", "Second match has the expected value");
+    is(matched[1].sourceText, ".column-rule",
+        "Second match comes from a rule");
+    is(matched[1].selector, ".column-rule", "Second match comes from highest line number");
+    is(matched[1].value, "25px", "Second match comes from highest column");
     is(matched[1].status, CssLogic.STATUS.PARENT_MATCH,
        "Second match is from the parent");
     is(matched[1].rule.parentStyleSheet.href, null,
        "Inline stylesheet shouldn't have an href");
     is(matched[1].rule.parentStyleSheet.nodeHref, gInspectee.defaultView.location.href,
        "Inline stylesheet's nodeHref should match the current document");
     ok(!matched[1].rule.parentStyleSheet.system,
        "Inline stylesheet shouldn't be a system stylesheet.");
+
+    // matched[2] is only there to test matched[1]; do not need to test
+
+    is(matched[3].value, "15px", "Third match has the expected value");
   }).then(runNextTest));
 });
 
 addTest(function testSystemStyles() {
   let testNode = null;
 
   promiseDone(gWalker.querySelector(gWalker.rootNode, "#matched-test-node").then(node => {
     testNode = node;