From 26a029d407be480d791972afb5975cf62c9360a6 Mon Sep 17 00:00:00 2001 From: Daniel Baumann Date: Fri, 19 Apr 2024 02:47:55 +0200 Subject: Adding upstream version 124.0.1. Signed-off-by: Daniel Baumann --- .../test/browser_inplace-editor_stop_on_key.js | 219 +++++++++++++++++++++ 1 file changed, 219 insertions(+) create mode 100644 devtools/client/shared/test/browser_inplace-editor_stop_on_key.js (limited to 'devtools/client/shared/test/browser_inplace-editor_stop_on_key.js') diff --git a/devtools/client/shared/test/browser_inplace-editor_stop_on_key.js b/devtools/client/shared/test/browser_inplace-editor_stop_on_key.js new file mode 100644 index 0000000000..50ab5631ae --- /dev/null +++ b/devtools/client/shared/test/browser_inplace-editor_stop_on_key.js @@ -0,0 +1,219 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ +/* import-globals-from helper_inplace_editor.js */ + +"use strict"; + +loadHelperScript("helper_inplace_editor.js"); + +// Test the inplace-editor stopOnX options behavior + +add_task(async function () { + await addTab("data:text/html;charset=utf-8,inline editor stopOnX"); + const { host, doc } = await createHost(); + + testStopOnReturn(doc); + testStopOnTab(doc); + testStopOnShiftTab(doc); + + host.destroy(); + gBrowser.removeCurrentTab(); +}); + +function testStopOnReturn(doc) { + const { span1El, span2El } = setupMarkupAndCreateInplaceEditors(doc); + + info(`Create an editable field with "stopOnReturn" set to true`); + editableField({ + element: span1El, + focusEditableFieldAfterApply: true, + focusEditableFieldContainerSelector: "main", + stopOnReturn: true, + }); + editableField({ + element: span2El, + }); + + info("Activate inplace editor on first span"); + span1El.click(); + + is( + doc.activeElement.inplaceEditor.elt.id, + "span-1", + "Visible editable field is the one associated with first span" + ); + assertFocusedElementInplaceEditorInput(doc); + + info("Press Return"); + EventUtils.synthesizeKey("VK_RETURN"); + + is( + doc.activeElement.id, + "span-1", + "Using Enter did not advance the editor to the next focusable element" + ); + + info("Activate inplace editor on first span again"); + span1El.click(); + + is( + doc.activeElement.inplaceEditor.elt.id, + "span-1", + "Visible editable field is the one associated with first span" + ); + assertFocusedElementInplaceEditorInput(doc); + + const isMacOS = Services.appinfo.OS === "Darwin"; + info(`Press ${isMacOS ? "Cmd" : "Ctrl"} + Enter`); + EventUtils.synthesizeKey("VK_RETURN", { + [isMacOS ? "metaKey" : "ctrlKey"]: true, + }); + + is( + doc.activeElement.inplaceEditor.elt.id, + "span-2", + `Using ${ + isMacOS ? "Cmd" : "Ctrl" + } + Enter did advance the editor to the next focusable element` + ); +} + +function testStopOnTab(doc) { + const { span1El, span2El } = setupMarkupAndCreateInplaceEditors(doc); + + info(`Create editable fields with "stopOnTab" set to true`); + const options = { + focusEditableFieldAfterApply: true, + focusEditableFieldContainerSelector: "main", + stopOnTab: true, + }; + editableField({ + element: span1El, + ...options, + }); + editableField({ + element: span2El, + ...options, + }); + + info("Activate inplace editor on first span"); + span1El.click(); + + is( + doc.activeElement.inplaceEditor.elt.id, + "span-1", + "Visible editable field is the one associated with first span" + ); + assertFocusedElementInplaceEditorInput(doc); + + info("Press Tab"); + EventUtils.synthesizeKey("VK_TAB"); + + is( + doc.activeElement.id, + "span-1", + "Using Tab did not advance the editor to the next focusable element" + ); + + info( + "Activate inplace editor on second span to check that Shift+Tab does work" + ); + span2El.click(); + + is( + doc.activeElement.inplaceEditor.elt.id, + "span-2", + "Visible editable field is the one associated with second span" + ); + assertFocusedElementInplaceEditorInput(doc); + + info("Press Shift+Tab"); + EventUtils.synthesizeKey("VK_TAB", { + shiftKey: true, + }); + + is( + doc.activeElement.inplaceEditor.elt.id, + "span-1", + `Using Shift + Tab did move the editor to the previous focusable element` + ); +} + +function testStopOnShiftTab(doc) { + const { span1El, span2El } = setupMarkupAndCreateInplaceEditors(doc); + info(`Create editable fields with "stopOnShiftTab" set to true`); + const options = { + focusEditableFieldAfterApply: true, + focusEditableFieldContainerSelector: "main", + stopOnShiftTab: true, + }; + editableField({ + element: span1El, + ...options, + }); + editableField({ + element: span2El, + ...options, + }); + + info("Activate inplace editor on second span"); + span2El.click(); + + is( + doc.activeElement.inplaceEditor.elt.id, + "span-2", + "Visible editable field is the one associated with second span" + ); + assertFocusedElementInplaceEditorInput(doc); + + info("Press Shift+Tab"); + EventUtils.synthesizeKey("VK_TAB", { shiftKey: true }); + + is( + doc.activeElement.id, + "span-2", + "Using Shift+Tab did not move the editor to the previous focusable element" + ); + + info( + "Activate inplace editor on first span to check that Tab is not impacted" + ); + span1El.click(); + + is( + doc.activeElement.inplaceEditor.elt.id, + "span-1", + "Visible editable field is the one associated with first span" + ); + assertFocusedElementInplaceEditorInput(doc); + + info("Press Tab"); + EventUtils.synthesizeKey("VK_TAB"); + + is( + doc.activeElement.inplaceEditor.elt.id, + "span-2", + `Using Tab did move the editor to the next focusable element` + ); +} + +function setupMarkupAndCreateInplaceEditors(doc) { + // For some reason