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 --- ...ser_flexbox_sizing_info_has_correct_sections.js | 86 ++++++++++++++++++++++ 1 file changed, 86 insertions(+) create mode 100644 devtools/client/inspector/flexbox/test/browser_flexbox_sizing_info_has_correct_sections.js (limited to 'devtools/client/inspector/flexbox/test/browser_flexbox_sizing_info_has_correct_sections.js') diff --git a/devtools/client/inspector/flexbox/test/browser_flexbox_sizing_info_has_correct_sections.js b/devtools/client/inspector/flexbox/test/browser_flexbox_sizing_info_has_correct_sections.js new file mode 100644 index 0000000000..e31366da15 --- /dev/null +++ b/devtools/client/inspector/flexbox/test/browser_flexbox_sizing_info_has_correct_sections.js @@ -0,0 +1,86 @@ +/* Any copyright is dedicated to the Public Domain. + http://creativecommons.org/publicdomain/zero/1.0/ */ + +"use strict"; + +// Test that the flex item sizing UI contains the right sections, depending on which +// element is selected. Some items may be clamped, others not, so not all sections are +// visible at all times. + +const TEST_URI = URL_ROOT + "doc_flexbox_specific_cases.html"; + +const TEST_DATA = [ + { + selector: ".shrinking .item", + expectedSections: ["Base Size", "Flexibility", "Final Size"], + }, + { + selector: ".shrinking.is-clamped .item", + expectedSections: [ + "Base Size", + "Flexibility", + "Minimum Size", + "Final Size", + ], + }, + { + selector: ".growing .item", + expectedSections: ["Base Size", "Flexibility", "Final Size"], + }, + { + selector: ".growing.is-clamped .item", + expectedSections: [ + "Base Size", + "Flexibility", + "Maximum Size", + "Final Size", + ], + }, +]; + +add_task(async function () { + await addTab(TEST_URI); + const { inspector, flexboxInspector } = await openLayoutView(); + const { document: doc, store } = flexboxInspector; + + for (const { selector, expectedSections } of TEST_DATA) { + info(`Checking the list of sections for the flex item ${selector}`); + const sections = await selectNodeAndGetFlexSizingSections( + selector, + store, + inspector, + doc + ); + + is( + sections.length, + expectedSections.length, + "Correct number of sections found" + ); + expectedSections.forEach((expectedSection, i) => { + ok( + sections[i].includes(expectedSection), + `The ${expectedSection} section was found` + ); + }); + } +}); + +async function selectNodeAndGetFlexSizingSections( + selector, + store, + inspector, + doc +) { + const onUpdate = waitForDispatch(store, "UPDATE_FLEXBOX"); + await selectNode(selector, inspector); + await onUpdate; + + info(`Getting the list of displayed sections for ${selector}`); + const allSections = [ + ...doc.querySelectorAll("ul.flex-item-sizing .section .name"), + ]; + const allSectionTitles = allSections.map(el => el.textContent); + + return allSectionTitles; +} -- cgit v1.2.3