diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 01:47:29 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 01:47:29 +0000 |
commit | 0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d (patch) | |
tree | a31f07c9bcca9d56ce61e9a1ffd30ef350d513aa /devtools/client/shared/test/browser_cubic-bezier-02.js | |
parent | Initial commit. (diff) | |
download | firefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.tar.xz firefox-esr-0ebf5bdf043a27fd3dfb7f92e0cb63d88954c44d.zip |
Adding upstream version 115.8.0esr.upstream/115.8.0esr
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'devtools/client/shared/test/browser_cubic-bezier-02.js')
-rw-r--r-- | devtools/client/shared/test/browser_cubic-bezier-02.js | 206 |
1 files changed, 206 insertions, 0 deletions
diff --git a/devtools/client/shared/test/browser_cubic-bezier-02.js b/devtools/client/shared/test/browser_cubic-bezier-02.js new file mode 100644 index 0000000000..3ce0af2f99 --- /dev/null +++ b/devtools/client/shared/test/browser_cubic-bezier-02.js @@ -0,0 +1,206 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +// Tests the CubicBezierWidget events + +const { + CubicBezierWidget, +} = require("resource://devtools/client/shared/widgets/CubicBezierWidget.js"); +const { + PREDEFINED, +} = require("resource://devtools/client/shared/widgets/CubicBezierPresets.js"); + +// In this test we have to use a slightly more complete HTML tree, with <body> +// in order to remove its margin and prevent shifted positions +const TEST_URI = CHROME_URL_ROOT + "doc_cubic-bezier-02.html"; + +add_task(async function () { + const { host, win, doc } = await createHost("bottom", TEST_URI); + + // Required or widget will be clipped inside of 'bottom' + // host by -14. Setting `fixed` zeroes this which is needed for + // calculating offsets. Occurs in test env only. + doc.body.setAttribute("style", "position: fixed; margin: 0;"); + + const container = doc.querySelector("#cubic-bezier-container"); + const w = new CubicBezierWidget(container, PREDEFINED.linear); + + const rect = w.curve.getBoundingClientRect(); + rect.graphTop = rect.height * w.bezierCanvas.padding[0]; + rect.graphBottom = rect.height - rect.graphTop; + rect.graphHeight = rect.graphBottom - rect.graphTop; + + await pointsCanBeDragged(w, win, doc, rect); + await curveCanBeClicked(w, win, doc, rect); + await pointsCanBeMovedWithKeyboard(w, win, doc, rect); + + w.destroy(); + host.destroy(); +}); + +async function pointsCanBeDragged(widget, win, doc, offsets) { + info("Checking that the control points can be dragged with the mouse"); + + info("Listening for the update event"); + let onUpdated = widget.once("updated"); + + info("Generating a mousedown/move/up on P1"); + widget._onPointMouseDown({ target: widget.p1 }); + doc.onmousemove({ pageX: offsets.left, pageY: offsets.graphTop }); + doc.onmouseup(); + + let bezier = await onUpdated; + ok(true, "The widget fired the updated event"); + ok(bezier, "The updated event contains a bezier argument"); + is(bezier.P1[0], 0, "The new P1 time coordinate is correct"); + is(bezier.P1[1], 1, "The new P1 progress coordinate is correct"); + + info("Listening for the update event"); + onUpdated = widget.once("updated"); + + info("Generating a mousedown/move/up on P2"); + widget._onPointMouseDown({ target: widget.p2 }); + doc.onmousemove({ pageX: offsets.right, pageY: offsets.graphBottom }); + doc.onmouseup(); + + bezier = await onUpdated; + is(bezier.P2[0], 1, "The new P2 time coordinate is correct"); + is(bezier.P2[1], 0, "The new P2 progress coordinate is correct"); +} + +async function curveCanBeClicked(widget, win, doc, offsets) { + info("Checking that clicking on the curve moves the closest control point"); + + info("Listening for the update event"); + let onUpdated = widget.once("updated"); + + info("Click close to P1"); + let x = offsets.left + offsets.width / 4.0; + let y = offsets.graphTop + offsets.graphHeight / 4.0; + widget._onCurveClick({ pageX: x, pageY: y }); + + let bezier = await onUpdated; + ok(true, "The widget fired the updated event"); + is(bezier.P1[0], 0.25, "The new P1 time coordinate is correct"); + is(bezier.P1[1], 0.75, "The new P1 progress coordinate is correct"); + is(bezier.P2[0], 1, "P2 time coordinate remained unchanged"); + is(bezier.P2[1], 0, "P2 progress coordinate remained unchanged"); + + info("Listening for the update event"); + onUpdated = widget.once("updated"); + + info("Click close to P2"); + x = offsets.right - offsets.width / 4; + y = offsets.graphBottom - offsets.graphHeight / 4; + widget._onCurveClick({ pageX: x, pageY: y }); + + bezier = await onUpdated; + is(bezier.P2[0], 0.75, "The new P2 time coordinate is correct"); + is(bezier.P2[1], 0.25, "The new P2 progress coordinate is correct"); + is(bezier.P1[0], 0.25, "P1 time coordinate remained unchanged"); + is(bezier.P1[1], 0.75, "P1 progress coordinate remained unchanged"); +} + +async function pointsCanBeMovedWithKeyboard(widget, win, doc, offsets) { + info("Checking that points respond to keyboard events"); + + const singleStep = 3; + const shiftStep = 30; + + info("Moving P1 to the left"); + let newOffset = parseInt(widget.p1.style.left, 10) - singleStep; + let x = widget.bezierCanvas.offsetsToCoordinates({ + style: { left: newOffset }, + })[0]; + + let onUpdated = widget.once("updated"); + widget._onPointKeyDown(getKeyEvent(widget.p1, 37)); + let bezier = await onUpdated; + + is(bezier.P1[0], x, "The new P1 time coordinate is correct"); + is(bezier.P1[1], 0.75, "The new P1 progress coordinate is correct"); + + info("Moving P1 to the left, fast"); + newOffset = parseInt(widget.p1.style.left, 10) - shiftStep; + x = widget.bezierCanvas.offsetsToCoordinates({ + style: { left: newOffset }, + })[0]; + + onUpdated = widget.once("updated"); + widget._onPointKeyDown(getKeyEvent(widget.p1, 37, true)); + bezier = await onUpdated; + is(bezier.P1[0], x, "The new P1 time coordinate is correct"); + is(bezier.P1[1], 0.75, "The new P1 progress coordinate is correct"); + + info("Moving P1 to the right, fast"); + newOffset = parseInt(widget.p1.style.left, 10) + shiftStep; + x = widget.bezierCanvas.offsetsToCoordinates({ + style: { left: newOffset }, + })[0]; + + onUpdated = widget.once("updated"); + widget._onPointKeyDown(getKeyEvent(widget.p1, 39, true)); + bezier = await onUpdated; + is(bezier.P1[0], x, "The new P1 time coordinate is correct"); + is(bezier.P1[1], 0.75, "The new P1 progress coordinate is correct"); + + info("Moving P1 to the bottom"); + newOffset = parseInt(widget.p1.style.top, 10) + singleStep; + let y = widget.bezierCanvas.offsetsToCoordinates({ + style: { top: newOffset }, + })[1]; + + onUpdated = widget.once("updated"); + widget._onPointKeyDown(getKeyEvent(widget.p1, 40)); + bezier = await onUpdated; + is(bezier.P1[0], x, "The new P1 time coordinate is correct"); + is(bezier.P1[1], y, "The new P1 progress coordinate is correct"); + + info("Moving P1 to the bottom, fast"); + newOffset = parseInt(widget.p1.style.top, 10) + shiftStep; + y = widget.bezierCanvas.offsetsToCoordinates({ + style: { top: newOffset }, + })[1]; + + onUpdated = widget.once("updated"); + widget._onPointKeyDown(getKeyEvent(widget.p1, 40, true)); + bezier = await onUpdated; + is(bezier.P1[0], x, "The new P1 time coordinate is correct"); + is(bezier.P1[1], y, "The new P1 progress coordinate is correct"); + + info("Moving P1 to the top, fast"); + newOffset = parseInt(widget.p1.style.top, 10) - shiftStep; + y = widget.bezierCanvas.offsetsToCoordinates({ + style: { top: newOffset }, + })[1]; + + onUpdated = widget.once("updated"); + widget._onPointKeyDown(getKeyEvent(widget.p1, 38, true)); + bezier = await onUpdated; + is(bezier.P1[0], x, "The new P1 time coordinate is correct"); + is(bezier.P1[1], y, "The new P1 progress coordinate is correct"); + + info("Checking that keyboard events also work with P2"); + info("Moving P2 to the left"); + newOffset = parseInt(widget.p2.style.left, 10) - singleStep; + x = widget.bezierCanvas.offsetsToCoordinates({ + style: { left: newOffset }, + })[0]; + + onUpdated = widget.once("updated"); + widget._onPointKeyDown(getKeyEvent(widget.p2, 37)); + bezier = await onUpdated; + is(bezier.P2[0], x, "The new P2 time coordinate is correct"); + is(bezier.P2[1], 0.25, "The new P2 progress coordinate is correct"); +} + +function getKeyEvent(target, keyCode, shift = false) { + return { + target, + keyCode, + shiftKey: shift, + preventDefault: () => {}, + }; +} |