devtools/server/tests/chrome/test_inspector_getOffsetParent.html

   1 <!DOCTYPE HTML>
   2 <html>
   3 <!--
   4 https://bugzilla.mozilla.org/show_bug.cgi?id=1345119
   5 -->
   6 <head>
   7   <meta charset="utf-8">
   8   <title>Test for Bug 1345119</title>
   9
  10   <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
  11   <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
  12   <script type="application/javascript" src="inspector-helpers.js"></script>
  13   <script type="application/javascript">
  14 "use strict";
  15
  16 window.onload = function() {
  17   SimpleTest.waitForExplicitFinish();
  18   runNextTest();
  19 };
  20
  21 var gWalker;
  22 var gHTMLNode;
  23 var gBodyNode;
  24
  25 addTest(async function setup() {
  26   const url = document.getElementById("inspectorContent").href;
  27   const { target } = await attachURL(url);
  28   const inspector = await target.getFront("inspector");
  29   gWalker = inspector.walker;
  30   gBodyNode = await gWalker.querySelector(gWalker.rootNode, "body");
  31   gHTMLNode = await gWalker.querySelector(gWalker.rootNode, "html");
  32   runNextTest();
  33 });
  34
  35 addTest(function() {
  36   info("Try to get the offset parent for a dead node (null)");
  37   gWalker.getOffsetParent(null).then(offsetParent => {
  38     ok(!offsetParent, "No offset parent found");
  39     runNextTest();
  40   });
  41 });
  42
  43 addTest(function() {
  44   info("Try to get the offset parent for a node that is absolutely positioned inside a " +
  45     "relative node");
  46   gWalker.querySelector(gWalker.rootNode, "#absolute_child").then(node => {
  47     return gWalker.getOffsetParent(node);
  48   }).then(offsetParent => {
  49     ok(offsetParent, "The node has an offset parent");
  50     gWalker.querySelector(gWalker.rootNode, "#relative_parent").then(parent => {
  51       ok(offsetParent === parent, "The offset parent is the correct node");
  52       runNextTest();
  53     });
  54   });
  55 });
  56
  57 addTest(function() {
  58   info("Try to get the offset parent for a node that is absolutely positioned outside a" +
  59     " relative node");
  60   gWalker.querySelector(gWalker.rootNode, "#no_parent").then(node => {
  61     return gWalker.getOffsetParent(node);
  62   }).then(offsetParent => {
  63     ok(offsetParent === gBodyNode || offsetParent === gHTMLNode,
  64       "The node's offset parent is the body or html node");
  65     runNextTest();
  66   });
  67 });
  68
  69 addTest(function() {
  70   info("Try to get the offset parent for a relatively positioned node");
  71   gWalker.querySelector(gWalker.rootNode, "#relative_parent").then(node => {
  72     return gWalker.getOffsetParent(node);
  73   }).then(offsetParent => {
  74     ok(offsetParent === gBodyNode || offsetParent === gHTMLNode,
  75       "The node's offset parent is the body or html node");
  76     runNextTest();
  77   });
  78 });
  79
  80 addTest(function() {
  81   info("Try to get the offset parent for a statically positioned node");
  82   gWalker.querySelector(gWalker.rootNode, "#static").then(node => {
  83     return gWalker.getOffsetParent(node);
  84   }).then(offsetParent => {
  85     ok(offsetParent === gBodyNode || offsetParent === gHTMLNode,
  86       "The node's offset parent is the body or html node");
  87     runNextTest();
  88   });
  89 });
  90
  91 addTest(function() {
  92   info("Try to get the offset parent for a fixed positioned node");
  93   gWalker.querySelector(gWalker.rootNode, "#fixed").then(node => {
  94     return gWalker.getOffsetParent(node);
  95   }).then(offsetParent => {
  96     ok(offsetParent === gBodyNode || offsetParent === gHTMLNode,
  97       "The node's offset parent is the body or html node");
  98     runNextTest();
  99   });
 100 });
 101
 102 addTest(function() {
 103   info("Try to get the offset parent for the body");
 104   gWalker.querySelector(gWalker.rootNode, "body").then(node => {
 105     return gWalker.getOffsetParent(node);
 106   }).then(offsetParent => {
 107     ok(!offsetParent, "The body has no offset parent");
 108     runNextTest();
 109   });
 110 });
 111
 112 addTest(function() {
 113   gWalker = null;
 114   gBodyNode = null;
 115   runNextTest();
 116 });
 117   </script>
 118 </head>
 119 <body>
 120 <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=1345119">Mozilla Bug 1345119</a>
 121 <a id="inspectorContent" target="_blank" href="inspector_getOffsetParent.html">Test Document</a>
 122 <p id="display"></p>
 123 <div id="content" style="display: none">
 124
 125 </div>
 126 <pre id="test">
 127 </pre>
 128 </body>
 129 </html>