diff options
author | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
---|---|---|
committer | Daniel Baumann <daniel.baumann@progress-linux.org> | 2024-04-19 00:47:55 +0000 |
commit | 26a029d407be480d791972afb5975cf62c9360a6 (patch) | |
tree | f435a8308119effd964b339f76abb83a57c29483 /devtools/client/inspector/rules/test/browser_rules_cubicbezier-commit-on-ENTER.js | |
parent | Initial commit. (diff) | |
download | firefox-26a029d407be480d791972afb5975cf62c9360a6.tar.xz firefox-26a029d407be480d791972afb5975cf62c9360a6.zip |
Adding upstream version 124.0.1.upstream/124.0.1
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to '')
-rw-r--r-- | devtools/client/inspector/rules/test/browser_rules_cubicbezier-commit-on-ENTER.js | 82 |
1 files changed, 82 insertions, 0 deletions
diff --git a/devtools/client/inspector/rules/test/browser_rules_cubicbezier-commit-on-ENTER.js b/devtools/client/inspector/rules/test/browser_rules_cubicbezier-commit-on-ENTER.js new file mode 100644 index 0000000000..5fbd1da25b --- /dev/null +++ b/devtools/client/inspector/rules/test/browser_rules_cubicbezier-commit-on-ENTER.js @@ -0,0 +1,82 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +// Tests that a curve change in the cubic-bezier tooltip is committed when ENTER +// is pressed. + +const TEST_URI = ` + <style type="text/css"> + body { + transition: top 2s linear; + } + </style> +`; + +add_task(async function () { + await addTab("data:text/html;charset=utf-8," + encodeURIComponent(TEST_URI)); + const { view } = await openRuleView(); + + info("Getting the bezier swatch element"); + const swatch = getRuleViewProperty( + view, + "body", + "transition" + ).valueSpan.querySelector(".ruleview-bezierswatch"); + + await testPressingEnterCommitsChanges(swatch, view); +}); + +async function testPressingEnterCommitsChanges(swatch, ruleView) { + const bezierTooltip = ruleView.tooltips.getTooltip("cubicBezier"); + + info("Showing the tooltip"); + const onBezierWidgetReady = bezierTooltip.once("ready"); + swatch.click(); + await onBezierWidgetReady; + + const widget = await bezierTooltip.widget; + info("Simulating a change of curve in the widget"); + widget.coordinates = [0.1, 2, 0.9, -1]; + const expected = "cubic-bezier(0.1, 2, 0.9, -1)"; + + await waitForSuccess(async function () { + const func = await getComputedStyleProperty( + "body", + null, + "transition-timing-function" + ); + return func === expected; + }, "Waiting for the change to be previewed on the element"); + + ok( + getRuleViewProperty( + ruleView, + "body", + "transition" + ).valueSpan.textContent.includes("cubic-bezier("), + "The text of the timing-function was updated" + ); + + info("Sending RETURN key within the tooltip document"); + // Pressing RETURN ends up doing 2 rule-view updates, one for the preview and + // one for the commit when the tooltip closes. + const onRuleViewChanged = waitForNEvents(ruleView, "ruleview-changed", 2); + focusAndSendKey(widget.parent.ownerDocument.defaultView, "RETURN"); + await onRuleViewChanged; + + const style = await getComputedStyleProperty( + "body", + null, + "transition-timing-function" + ); + is(style, expected, "The element's timing-function was kept after RETURN"); + + const ruleViewStyle = getRuleViewProperty( + ruleView, + "body", + "transition" + ).valueSpan.textContent.includes("cubic-bezier("); + ok(ruleViewStyle, "The text of the timing-function was kept after RETURN"); +} |