browser/devtools/tilt/test/browser_tilt_utils07.js

Wed, 31 Dec 2014 06:55:46 +0100

author
Michael Schloh von Bennewitz <michael@schloh.com>
date
Wed, 31 Dec 2014 06:55:46 +0100
changeset 1
ca08bd8f51b2
permissions
-rw-r--r--

Added tag TORBROWSER_REPLICA for changeset 6474c204b198

michael@0 1 /* Any copyright is dedicated to the Public Domain.
michael@0 2 http://creativecommons.org/publicdomain/zero/1.0/ */
michael@0 3 "use strict";
michael@0 4
michael@0 5 const STACK_THICKNESS = 15;
michael@0 6
michael@0 7 function init(callback) {
michael@0 8 let iframe = gBrowser.ownerDocument.createElement("iframe");
michael@0 9
michael@0 10 iframe.addEventListener("load", function onLoad() {
michael@0 11 iframe.removeEventListener("load", onLoad, true);
michael@0 12 callback(iframe);
michael@0 13
michael@0 14 gBrowser.parentNode.removeChild(iframe);
michael@0 15 finish();
michael@0 16 }, true);
michael@0 17
michael@0 18 iframe.setAttribute("src", ["data:text/html,",
michael@0 19 "<!DOCTYPE html>",
michael@0 20 "<html>",
michael@0 21 "<body style='margin: 0;'>",
michael@0 22 "<frameset cols='50%,50%'>",
michael@0 23 "<frame src='",
michael@0 24 ["data:text/html,",
michael@0 25 "<!DOCTYPE html>",
michael@0 26 "<html>",
michael@0 27 "<body style='margin: 0;'>",
michael@0 28 "<div id='test-div' style='width: 123px; height: 456px;'></div>",
michael@0 29 "</body>",
michael@0 30 "</html>"
michael@0 31 ].join(""),
michael@0 32 "' />",
michael@0 33 "<frame src='",
michael@0 34 ["data:text/html,",
michael@0 35 "<!DOCTYPE html>",
michael@0 36 "<html>",
michael@0 37 "<body style='margin: 0;'>",
michael@0 38 "<span></span>",
michael@0 39 "</body>",
michael@0 40 "</html>"
michael@0 41 ].join(""),
michael@0 42 "' />",
michael@0 43 "</frameset>",
michael@0 44 "<iframe src='",
michael@0 45 ["data:text/html,",
michael@0 46 "<!DOCTYPE html>",
michael@0 47 "<html>",
michael@0 48 "<body>",
michael@0 49 "<span></span>",
michael@0 50 "</body>",
michael@0 51 "</html>"
michael@0 52 ].join(""),
michael@0 53 "'></iframe>",
michael@0 54 "<frame src='",
michael@0 55 ["data:text/html,",
michael@0 56 "<!DOCTYPE html>",
michael@0 57 "<html>",
michael@0 58 "<body style='margin: 0;'>",
michael@0 59 "<span></span>",
michael@0 60 "</body>",
michael@0 61 "</html>"
michael@0 62 ].join(""),
michael@0 63 "' />",
michael@0 64 "<frame src='",
michael@0 65 ["data:text/html,",
michael@0 66 "<!DOCTYPE html>",
michael@0 67 "<html>",
michael@0 68 "<body style='margin: 0;'>",
michael@0 69 "<iframe src='",
michael@0 70 ["data:text/html,",
michael@0 71 "<!DOCTYPE html>",
michael@0 72 "<html>",
michael@0 73 "<body>",
michael@0 74 "<div></div>",
michael@0 75 "</body>",
michael@0 76 "</html>"
michael@0 77 ].join(""),
michael@0 78 "'></iframe>",
michael@0 79 "</body>",
michael@0 80 "</html>"
michael@0 81 ].join(""),
michael@0 82 "' />",
michael@0 83 "</body>",
michael@0 84 "</html>"
michael@0 85 ].join(""));
michael@0 86
michael@0 87 gBrowser.parentNode.appendChild(iframe);
michael@0 88 }
michael@0 89
michael@0 90 function test() {
michael@0 91 waitForExplicitFinish();
michael@0 92 ok(TiltUtils, "The TiltUtils object doesn't exist.");
michael@0 93
michael@0 94 let dom = TiltUtils.DOM;
michael@0 95 ok(dom, "The TiltUtils.DOM wasn't found.");
michael@0 96
michael@0 97 init(function(iframe) {
michael@0 98 let cwDimensions = dom.getContentWindowDimensions(iframe.contentWindow);
michael@0 99
michael@0 100 is(cwDimensions.width - iframe.contentWindow.scrollMaxX,
michael@0 101 iframe.contentWindow.innerWidth,
michael@0 102 "The content window width wasn't calculated correctly.");
michael@0 103 is(cwDimensions.height - iframe.contentWindow.scrollMaxY,
michael@0 104 iframe.contentWindow.innerHeight,
michael@0 105 "The content window height wasn't calculated correctly.");
michael@0 106
michael@0 107 let lh = new LayoutHelpers(gBrowser.contentWindow);
michael@0 108 let nodeCoordinates = lh.getRect(
michael@0 109 iframe.contentDocument.getElementById("test-div"), iframe.contentWindow);
michael@0 110
michael@0 111 let frameOffset = lh.getIframeContentOffset(iframe);
michael@0 112 let frameRect = iframe.getBoundingClientRect();
michael@0 113
michael@0 114 is(nodeCoordinates.top, frameRect.top + frameOffset[0],
michael@0 115 "The node coordinates top value wasn't calculated correctly.");
michael@0 116 is(nodeCoordinates.left, frameRect.left + frameOffset[1],
michael@0 117 "The node coordinates left value wasn't calculated correctly.");
michael@0 118 is(nodeCoordinates.width, 123,
michael@0 119 "The node coordinates width value wasn't calculated correctly.");
michael@0 120 is(nodeCoordinates.height, 456,
michael@0 121 "The node coordinates height value wasn't calculated correctly.");
michael@0 122
michael@0 123
michael@0 124 let store = dom.traverse(iframe.contentWindow);
michael@0 125
michael@0 126 let expected = [
michael@0 127 { name: "html", depth: 0 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 128 { name: "head", depth: 1 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 129 { name: "body", depth: 1 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 130 { name: "div", depth: 2 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 131 { name: "span", depth: 2 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 132 { name: "iframe", depth: 2 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 133 { name: "span", depth: 2 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 134 { name: "iframe", depth: 2 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 135 { name: "html", depth: 3 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 136 { name: "html", depth: 3 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 137 { name: "head", depth: 4 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 138 { name: "body", depth: 4 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 139 { name: "head", depth: 4 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 140 { name: "body", depth: 4 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 141 { name: "span", depth: 5 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 142 { name: "div", depth: 5 * STACK_THICKNESS, thickness: STACK_THICKNESS },
michael@0 143 ];
michael@0 144
michael@0 145 is(store.nodes.length, expected.length,
michael@0 146 "The traverse() function didn't walk the correct number of nodes.");
michael@0 147 is(store.info.length, expected.length,
michael@0 148 "The traverse() function didn't examine the correct number of nodes.");
michael@0 149
michael@0 150 for (let i = 0; i < expected.length; i++) {
michael@0 151 is(store.info[i].name, expected[i].name,
michael@0 152 "traversed node " + (i + 1) + " isn't the expected one.");
michael@0 153 is(store.info[i].coord.depth, expected[i].depth,
michael@0 154 "traversed node " + (i + 1) + " doesn't have the expected depth.");
michael@0 155 is(store.info[i].coord.thickness, expected[i].thickness,
michael@0 156 "traversed node " + (i + 1) + " doesn't have the expected thickness.");
michael@0 157 }
michael@0 158 });
michael@0 159 }

mercurial