diff options
Diffstat (limited to '')
| -rw-r--r-- | devtools/client/inspector/test/browser_inspector_highlighter-rulers_02.js | 201 |
1 files changed, 201 insertions, 0 deletions
diff --git a/devtools/client/inspector/test/browser_inspector_highlighter-rulers_02.js b/devtools/client/inspector/test/browser_inspector_highlighter-rulers_02.js new file mode 100644 index 0000000000..44bd1514b3 --- /dev/null +++ b/devtools/client/inspector/test/browser_inspector_highlighter-rulers_02.js @@ -0,0 +1,201 @@ +/* This Source Code Form is subject to the terms of the Mozilla Public + * License, v. 2.0. If a copy of the MPL was not distributed with this + * file, You can obtain one at http://mozilla.org/MPL/2.0/. */ + +"use strict"; + +// Test the creation of the geometry highlighter elements. + +const TEST_URL = + "data:text/html;charset=utf-8," + + "<div style='position:absolute;left: 0; top: 0; " + + "width: 40000px; height: 8000px'></div>"; + +const ID = "rulers-highlighter-"; + +add_task(async function () { + const { inspector, highlighterTestFront } = await openInspectorForURL( + TEST_URL + ); + const front = inspector.inspectorFront; + + const highlighter = await front.getHighlighterByType("RulersHighlighter"); + + // the rulers doesn't need any node, but as highligher it seems mandatory + // ones, so the body is given + const body = await getNodeFront("body", inspector); + await highlighter.show(body); + + await isUpdatedAfterScroll(highlighter, inspector, highlighterTestFront); + + await highlighter.finalize(); +}); + +async function isUpdatedAfterScroll( + highlighterFront, + inspector, + highlighterTestFront +) { + info("Check the rulers' position by default"); + + let xAxisRulerTransform = + await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}x-axis-ruler`, + "transform", + highlighterFront + ); + let xAxisTextTransform = + await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}x-axis-text`, + "transform", + highlighterFront + ); + let yAxisRulerTransform = + await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}y-axis-ruler`, + "transform", + highlighterFront + ); + let yAxisTextTransform = + await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}y-axis-text`, + "transform", + highlighterFront + ); + + is(xAxisRulerTransform, null, "x axis ruler is positioned properly"); + is(xAxisTextTransform, null, "x axis text are positioned properly"); + is(yAxisRulerTransform, null, "y axis ruler is positioned properly"); + is(yAxisTextTransform, null, "y axis text are positioned properly"); + + info("Ask the content window to scroll to specific coords"); + + const x = 200, + y = 300; + + let data = await SpecialPowers.spawn( + gBrowser.selectedBrowser, + [x, y], + (_x, _y) => { + return new Promise(resolve => { + content.addEventListener( + "scroll", + () => resolve({ x: content.scrollX, y: content.scrollY }), + { once: true } + ); + content.scrollTo(_x, _y); + }); + } + ); + + is(data.x, x, "window scrolled properly horizontally"); + is(data.y, y, "window scrolled properly vertically"); + + info("Check the rulers are properly positioned after the scrolling"); + + xAxisRulerTransform = await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}x-axis-ruler`, + "transform", + highlighterFront + ); + xAxisTextTransform = await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}x-axis-text`, + "transform", + highlighterFront + ); + yAxisRulerTransform = await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}y-axis-ruler`, + "transform", + highlighterFront + ); + yAxisTextTransform = await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}y-axis-text`, + "transform", + highlighterFront + ); + + is( + xAxisRulerTransform, + `translate(-${x})`, + "x axis ruler is positioned properly" + ); + is( + xAxisTextTransform, + `translate(-${x})`, + "x axis text are positioned properly" + ); + is( + yAxisRulerTransform, + `translate(0, -${y})`, + "y axis ruler is positioned properly" + ); + is( + yAxisTextTransform, + `translate(0, -${y})`, + "y axis text are positioned properly" + ); + + info("Ask the content window to scroll relative to the current position"); + + data = await SpecialPowers.spawn( + gBrowser.selectedBrowser, + [-50, -60], + (_deltaX, _deltaY) => { + return new Promise(resolve => { + content.addEventListener( + "scroll", + () => resolve({ x: content.scrollX, y: content.scrollY }), + { once: true } + ); + content.scrollBy(_deltaX, _deltaY); + }); + } + ); + + is(data.x, x - 50, "window scrolled properly horizontally"); + is(data.y, y - 60, "window scrolled properly vertically"); + + info("Check the rulers are properly positioned after the relative scrolling"); + + xAxisRulerTransform = await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}x-axis-ruler`, + "transform", + highlighterFront + ); + xAxisTextTransform = await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}x-axis-text`, + "transform", + highlighterFront + ); + yAxisRulerTransform = await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}y-axis-ruler`, + "transform", + highlighterFront + ); + yAxisTextTransform = await highlighterTestFront.getHighlighterNodeAttribute( + `${ID}y-axis-text`, + "transform", + highlighterFront + ); + + is( + xAxisRulerTransform, + `translate(-${x - 50})`, + "x axis ruler is positioned properly" + ); + is( + xAxisTextTransform, + `translate(-${x - 50})`, + "x axis text are positioned properly" + ); + is( + yAxisRulerTransform, + `translate(0, -${y - 60})`, + "y axis ruler is positioned properly" + ); + is( + yAxisTextTransform, + `translate(0, -${y - 60})`, + "y axis text are positioned properly" + ); +} |