diff options
Diffstat (limited to 'editor/libeditor/tests/test_bug640321.html')
| -rw-r--r-- | editor/libeditor/tests/test_bug640321.html | 190 |
1 files changed, 190 insertions, 0 deletions
diff --git a/editor/libeditor/tests/test_bug640321.html b/editor/libeditor/tests/test_bug640321.html new file mode 100644 index 000000000..984ea295a --- /dev/null +++ b/editor/libeditor/tests/test_bug640321.html @@ -0,0 +1,190 @@ +<!DOCTYPE HTML> +<html> +<!-- +https://bugzilla.mozilla.org/show_bug.cgi?id=640321 +--> +<head> + <title>Test for Bug 640321</title> + <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script> + <script type="text/javascript" src="/tests/SimpleTest/EventUtils.js"></script> + <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/> +</head> +<body> +<a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=640321">Mozilla Bug 640321</a> +<p id="display"></p> +<div id="content" contenteditable style="text-align: center"> + <img src="green.png"> +</div> +<div id="clickaway" style="width: 10px; height: 10px"></div> +<pre id="test"> +<script type="application/javascript"> + +/** Test for Bug 640321 **/ +SimpleTest.waitForExplicitFinish(); +SimpleTest.waitForFocus(function() { + var img = document.querySelector("img"); + + function cancel(e) { e.stopPropagation(); } + var content = document.getElementById("content"); + content.addEventListener("mousedown", cancel, false); + content.addEventListener("mousemove", cancel, false); + content.addEventListener("mouseup", cancel, false); + + /** + * This function is a generic resizer test. + * We have 8 resizers that we'd like to test, and each can be moved in 8 different directions. + * In specifying baseX, W can be considered to be the width of the image, and for baseY, H + * can be considered to be the height of the image. deltaX and deltaY are regular pixel values + * which can be positive or negative. + */ + const W = 1; + const H = 1; + function testResizer(baseX, baseY, deltaX, deltaY, expectedDeltaX, expectedDeltaY) { + ok(true, "testResizer(" + [baseX, baseY, deltaX, deltaY, expectedDeltaX, expectedDeltaY].join(", ") + ")"); + + // Reset the dimensions of the image + img.style.width = "100px"; + img.style.height = "100px"; + var rect = img.getBoundingClientRect(); + is(rect.width, 100, "Sanity check the length"); + is(rect.height, 100, "Sanity check the height"); + + // Click on the image to show the resizers + synthesizeMouseAtCenter(img, {}); + + // Determine which resizer we're dealing with + var basePosX = rect.width * baseX; + var basePosY = rect.height * baseY; + + // Click on the correct resizer + synthesizeMouse(img, basePosX, basePosY, {type: "mousedown"}); + // Drag it delta pixels to the right and bottom (or maybe left and top!) + synthesizeMouse(img, basePosX + deltaX, basePosY + deltaY, {type: "mousemove"}); + // Release the mouse button + synthesizeMouse(img, basePosX + deltaX, basePosY + deltaY, {type: "mouseup"}); + // Move the mouse delta more pixels to the same direction to make sure that the + // resize operation has stopped. + synthesizeMouse(img, basePosX + deltaX * 2, basePosY + deltaY * 2, {type: "mousemove"}); + // Click outside of the image to hide the resizers + synthesizeMouseAtCenter(document.getElementById("clickaway"), {}); + + // Get the new dimensions for the image + var newRect = img.getBoundingClientRect(); + is(newRect.width, rect.width + expectedDeltaX, "The width should be increased by " + expectedDeltaX + " pixels"); + is(newRect.height, rect.height + expectedDeltaY, "The height should be increased by " + expectedDeltaY + "pixels"); + } + + function runTests(preserveRatio) { + // Account for changes in the resizing behavior when we're trying to preserve + // the aspect ration. + // ignoredGrowth means we don't change the size of a dimension because otherwise + // the aspect ratio would change undesirably. + // needlessGrowth means that we change the size of a dimension perpendecular to + // the mouse movement axis in order to preserve the aspect ratio. + // reversedGrowth means that we change the size of a dimension in the opposite + // direction to the mouse movement in order to maintain the aspect ratio. + const ignoredGrowth = preserveRatio ? 0 : 1; + const needlessGrowth = preserveRatio ? 1 : 0; + const reversedGrowth = preserveRatio ? -1 : 1; + + // top resizer + testResizer(W/2, 0, -10, -10, 0, 10); + testResizer(W/2, 0, -10, 0, 0, 0); + testResizer(W/2, 0, -10, 10, 0, -10); + testResizer(W/2, 0, 0, -10, 0, 10); + testResizer(W/2, 0, 0, 0, 0, 0); + testResizer(W/2, 0, 0, 10, 0, -10); + testResizer(W/2, 0, 10, -10, 0, 10); + testResizer(W/2, 0, 10, 0, 0, 0); + testResizer(W/2, 0, 10, 10, 0, -10); + + // top right resizer + testResizer( W, 0, -10, -10, -10 * reversedGrowth, 10); + testResizer( W, 0, -10, 0, -10 * ignoredGrowth, 0); + testResizer( W, 0, -10, 10, -10, -10); + testResizer( W, 0, 0, -10, 10 * needlessGrowth, 10); + testResizer( W, 0, 0, 0, 0, 0); + testResizer( W, 0, 0, 10, 0, -10 * ignoredGrowth); + testResizer( W, 0, 10, -10, 10, 10); + testResizer( W, 0, 10, 0, 10, 10 * needlessGrowth); + testResizer( W, 0, 10, 10, 10, -10 * reversedGrowth); + + // right resizer + testResizer( W, H/2, -10, -10, -10, 0); + testResizer( W, H/2, -10, 0, -10, 0); + testResizer( W, H/2, -10, 10, -10, 0); + testResizer( W, H/2, 0, -10, 0, 0); + testResizer( W, H/2, 0, 0, 0, 0); + testResizer( W, H/2, 0, 10, 0, 0); + testResizer( W, H/2, 10, -10, 10, 0); + testResizer( W, H/2, 10, 0, 10, 0); + testResizer( W, H/2, 10, 10, 10, 0); + + // bottom right resizer + testResizer( W, H, -10, -10, -10, -10); + testResizer( W, H, -10, 0, -10 * ignoredGrowth, 0); + testResizer( W, H, -10, 10, -10 * reversedGrowth, 10); + testResizer( W, H, 0, -10, 0, -10 * ignoredGrowth); + testResizer( W, H, 0, 0, 0, 0); + testResizer( W, H, 0, 10, 10 * needlessGrowth, 10); + testResizer( W, H, 10, -10, 10, -10 * reversedGrowth); + testResizer( W, H, 10, 0, 10, 10 * needlessGrowth); + testResizer( W, H, 10, 10, 10, 10); + + // bottom resizer + testResizer(W/2, H, -10, -10, 0, -10); + testResizer(W/2, H, -10, 0, 0, 0); + testResizer(W/2, H, -10, 10, 0, 10); + testResizer(W/2, H, 0, -10, 0, -10); + testResizer(W/2, H, 0, 0, 0, 0); + testResizer(W/2, H, 0, 10, 0, 10); + testResizer(W/2, H, 10, -10, 0, -10); + testResizer(W/2, H, 10, 0, 0, 0); + testResizer(W/2, H, 10, 10, 0, 10); + + // bottom left resizer + testResizer( 0, H, -10, -10, 10, -10 * reversedGrowth); + testResizer( 0, H, -10, 0, 10, 10 * needlessGrowth); + testResizer( 0, H, -10, 10, 10, 10); + testResizer( 0, H, 0, -10, 0, -10 * ignoredGrowth); + testResizer( 0, H, 0, 0, 0, 0); + testResizer( 0, H, 0, 10, 10 * needlessGrowth, 10); + testResizer( 0, H, 10, -10, -10, -10); + testResizer( 0, H, 10, 0, -10 * ignoredGrowth, 0); + testResizer( 0, H, 10, 10, -10 * reversedGrowth, 10); + + // left resizer + testResizer( 0, H/2, -10, -10, 10, 0); + testResizer( 0, H/2, -10, 0, 10, 0); + testResizer( 0, H/2, -10, 10, 10, 0); + testResizer( 0, H/2, 0, -10, 0, 0); + testResizer( 0, H/2, 0, 0, 0, 0); + testResizer( 0, H/2, 0, 10, 0, 0); + testResizer( 0, H/2, 10, -10, -10, 0); + testResizer( 0, H/2, 10, 0, -10, 0); + testResizer( 0, H/2, 10, 10, -10, 0); + + // top left resizer + testResizer( 0, 0, -10, -10, 10, 10); + testResizer( 0, 0, -10, 0, 10, 10 * needlessGrowth); + testResizer( 0, 0, -10, 10, 10, -10 * reversedGrowth); + testResizer( 0, 0, 0, -10, 10 * needlessGrowth, 10); + testResizer( 0, 0, 0, 0, 0, 0); + testResizer( 0, 0, 0, 10, 0, -10 * ignoredGrowth); + testResizer( 0, 0, 10, -10, -10 * reversedGrowth, 10); + testResizer( 0, 0, 10, 0, -10 * ignoredGrowth, 0); + testResizer( 0, 0, 10, 10, -10, -10); + } + SpecialPowers.pushPrefEnv({"set": [["editor.resizing.preserve_ratio", false]]}, function() { + runTests(false); + SpecialPowers.pushPrefEnv({"set": [["editor.resizing.preserve_ratio", true]]}, function() { + runTests(true); + SimpleTest.finish(); + }); + }); + }); + +</script> +</pre> +</body> +</html> |