summaryrefslogtreecommitdiffstats
path: root/devtools/client/performance-new/test/browser/browser_interaction-between-interfaces.js
diff options
context:
space:
mode:
authorDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
committerDaniel Baumann <daniel.baumann@progress-linux.org>2024-04-07 19:33:14 +0000
commit36d22d82aa202bb199967e9512281e9a53db42c9 (patch)
tree105e8c98ddea1c1e4784a60a5a6410fa416be2de /devtools/client/performance-new/test/browser/browser_interaction-between-interfaces.js
parentInitial commit. (diff)
downloadfirefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz
firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip
Adding upstream version 115.7.0esr.upstream/115.7.0esr
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'devtools/client/performance-new/test/browser/browser_interaction-between-interfaces.js')
-rw-r--r--devtools/client/performance-new/test/browser/browser_interaction-between-interfaces.js389
1 files changed, 389 insertions, 0 deletions
diff --git a/devtools/client/performance-new/test/browser/browser_interaction-between-interfaces.js b/devtools/client/performance-new/test/browser/browser_interaction-between-interfaces.js
new file mode 100644
index 0000000000..1268cf818d
--- /dev/null
+++ b/devtools/client/performance-new/test/browser/browser_interaction-between-interfaces.js
@@ -0,0 +1,389 @@
+/* This Source Code Form is subject to the terms of the Mozilla Public
+ * License, v. 2.0. If a copy of the MPL was not distributed with this
+ * file, You can obtain one at http://mozilla.org/MPL/2.0/. */
+/* eslint-disable max-nested-callbacks */
+"use strict";
+
+add_task(async function test_change_in_popup() {
+ // This test assumes that the Web Developer preset is set by default, which is
+ // not the case on Nightly and custom builds.
+ BackgroundJSM.changePreset(
+ "aboutprofiling",
+ "web-developer",
+ Services.profiler.GetFeatures()
+ );
+
+ info(
+ "Test that changing settings in the popup changes settings in the devtools panel and about:profiling too."
+ );
+
+ const browserWindow = window;
+ const browserDocument = document;
+
+ await makeSureProfilerPopupIsEnabled();
+ await withDevToolsPanel(
+ "about:profiling",
+ async (devtoolsDocument, aboutProfilingDocument) => {
+ await withPopupOpen(browserWindow, async () => {
+ const presetsInPopup = browserDocument.getElementById(
+ "PanelUI-profiler-presets"
+ );
+
+ const presetsInDevtools = await getNearestInputFromText(
+ devtoolsDocument,
+ "Settings"
+ );
+
+ const webdev = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Web Developer"
+ );
+ const graphics = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Graphics"
+ );
+ const media = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Media"
+ );
+
+ // Default situation
+ ok(
+ webdev.checked,
+ "By default the Web Developer preset is selected in the about:profiling interface."
+ );
+ is(
+ presetsInDevtools.value,
+ "web-developer",
+ "The presets default to webdev mode in the devtools panel."
+ );
+ is(
+ presetsInPopup.value,
+ "web-developer",
+ "The presets default to webdev mode in the popup."
+ );
+
+ // Select "graphics" using the popup
+ ok(!graphics.checked, "The Graphics preset is not checked.");
+
+ presetsInPopup.menupopup.openPopup();
+ presetsInPopup.menupopup.activateItem(
+ await getElementByLabel(presetsInPopup, "Graphics")
+ );
+
+ await TestUtils.waitForCondition(
+ () => !webdev.checked,
+ "After selecting the preset in the popup, waiting until the Web Developer preset isn't selected anymore in the about:profiling interface."
+ );
+ await TestUtils.waitForCondition(
+ () => graphics.checked,
+ "After selecting the preset in the popup, waiting until the Graphics preset is checked in the about:profiling interface."
+ );
+ await TestUtils.waitForCondition(
+ () => presetsInDevtools.value === "graphics",
+ "After selecting the preset in the popup, waiting until the preset is changed to Graphics in the devtools panel too."
+ );
+ await TestUtils.waitForCondition(
+ () => presetsInPopup.value === "graphics",
+ "After selecting the preset in the popup, waiting until the preset is changed to Graphics in the popup."
+ );
+
+ // Select "firefox frontend" using the popup
+ ok(!media.checked, "The Media preset is not checked.");
+
+ presetsInPopup.menupopup.openPopup();
+ presetsInPopup.menupopup.activateItem(
+ await getElementByLabel(presetsInPopup, "Media")
+ );
+
+ await TestUtils.waitForCondition(
+ () => !graphics.checked,
+ "After selecting the preset in the popup, waiting until the Graphics preset is not checked anymore in the about:profiling interface."
+ );
+ await TestUtils.waitForCondition(
+ () => media.checked,
+ "After selecting the preset in the popup, waiting until the Media preset is checked in the about:profiling interface."
+ );
+ await TestUtils.waitForCondition(
+ () => presetsInDevtools.value === "media",
+ "After selecting the preset in the popup, waiting until the preset is changed to Firefox Front-end in the devtools panel."
+ );
+ await TestUtils.waitForCondition(
+ () => presetsInPopup.value === "media",
+ "After selecting the preset in the popup, waiting until the preset is changed to Media in the popup."
+ );
+ });
+ }
+ );
+});
+
+// In the following tests we don't look at changes in the popup. Indeed because
+// the popup rerenders each time it's open, we don't need to mirror it.
+add_task(async function test_change_in_about_profiling() {
+ // This test assumes that the Web Developer preset is set by default, which is
+ // not the case on Nightly and custom builds, or after previous tests.
+ BackgroundJSM.changePreset(
+ "aboutprofiling",
+ "web-developer",
+ Services.profiler.GetFeatures()
+ );
+
+ info(
+ "Test that changing settings in about:profiling changes settings in the devtools panel too."
+ );
+
+ await withDevToolsPanel(
+ "about:profiling",
+ async (devtoolsDocument, aboutProfilingDocument) => {
+ const presetsInDevtools = await getNearestInputFromText(
+ devtoolsDocument,
+ "Settings"
+ );
+
+ const webdev = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Web Developer"
+ );
+ const graphics = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Graphics"
+ );
+ const media = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Media"
+ );
+ const custom = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Custom"
+ );
+
+ // Default values
+ ok(
+ webdev.checked,
+ "By default the Web Developer preset is selected in the about:profiling interface."
+ );
+ is(
+ presetsInDevtools.value,
+ "web-developer",
+ "The presets default to webdev mode in the devtools panel."
+ );
+
+ // Change the preset in about:profiling, check it changes also in the
+ // devtools panel.
+ ok(!graphics.checked, "The Graphics preset is not checked.");
+ graphics.click();
+ ok(
+ graphics.checked,
+ "After clicking the input, the Graphics preset is now checked in about:profiling."
+ );
+ await TestUtils.waitForCondition(
+ () => presetsInDevtools.value === "graphics",
+ "The preset was changed to Graphics in the devtools panel too."
+ );
+
+ ok(!media.checked, "The Media preset is not checked.");
+ media.click();
+ ok(
+ media.checked,
+ "After clicking the input, the Media preset is now checked in about:profiling."
+ );
+ await TestUtils.waitForCondition(
+ () => presetsInDevtools.value === "media",
+ "The preset was changed to Media in the devtools panel too."
+ );
+
+ // Now let's try to change some configuration!
+ info(
+ "Increase the interval by an arbitrary amount. The input range will " +
+ "scale that to the final value presented to the profiler."
+ );
+ const intervalInput = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Sampling interval:"
+ );
+ setReactFriendlyInputValue(
+ intervalInput,
+ Number(intervalInput.value) + 1
+ );
+ ok(
+ custom.checked,
+ "After changing the interval, the Custom preset is now checked in about:profiling."
+ );
+ await TestUtils.waitForCondition(
+ () => presetsInDevtools.value === "custom",
+ "The preset was changed to Custom in the devtools panel too."
+ );
+
+ ok(
+ getDevtoolsCustomPresetContent(devtoolsDocument).includes(
+ "Interval: 2 ms"
+ ),
+ "The new interval should be in the custom preset description"
+ );
+
+ // Let's check some thread as well
+ info("Change the threads values using the checkboxes");
+
+ const styleThreadInput = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "StyleThread"
+ );
+ ok(
+ !styleThreadInput.checked,
+ "The StyleThread thread isn't checked by default."
+ );
+
+ info("Click the StyleThread checkbox.");
+ styleThreadInput.click();
+
+ // For some reason, it's not possible to directly match "StyleThread".
+ const threadsLine = (
+ await getElementFromDocumentByText(devtoolsDocument, "Threads")
+ ).parentElement;
+ await TestUtils.waitForCondition(
+ () => threadsLine.textContent.includes("StyleThread"),
+ "Waiting that StyleThread is displayed in the devtools panel."
+ );
+ ok(
+ getDevtoolsCustomPresetContent(devtoolsDocument).includes(
+ "StyleThread"
+ ),
+ "The StyleThread thread should be listed in the custom preset description"
+ );
+ styleThreadInput.click();
+ await TestUtils.waitForCondition(
+ () => !threadsLine.textContent.includes("StyleThread"),
+ "Waiting until the StyleThread disappears from the devtools panel."
+ );
+ ok(
+ !getDevtoolsCustomPresetContent(devtoolsDocument).includes(
+ "StyleThread"
+ ),
+ "The StyleThread thread should no longer be listed in the custom preset description"
+ );
+
+ info("Change the threads values using the input.");
+ const threadInput = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Add custom threads by name"
+ );
+
+ function setThreadInputValue(newThreadValue) {
+ // Actually set the new value.
+ setReactFriendlyInputValue(threadInput, newThreadValue);
+ // The settings are actually changed on the blur event.
+ threadInput.dispatchEvent(new FocusEvent("blur"));
+ }
+
+ let newThreadValue = "GeckoMain,Foo";
+ setThreadInputValue(newThreadValue);
+ await TestUtils.waitForCondition(
+ () => threadsLine.textContent.includes("Foo"),
+ "Waiting for Foo to be displayed in the devtools panel."
+ );
+
+ // The code detecting changes to the thread list has a fast path
+ // to detect that the list of threads has changed if the 2 lists
+ // have different lengths. Exercise the slower code path by changing
+ // the list of threads to a list with the same number of threads.
+ info("Change the thread list again to a list of the same length");
+ newThreadValue = "GeckoMain,Dummy";
+ is(
+ threadInput.value.split(",").length,
+ newThreadValue.split(",").length,
+ "The new value should have the same count of threads as the old value, please double check the test code."
+ );
+ setThreadInputValue(newThreadValue);
+ checkDevtoolsCustomPresetContent(
+ devtoolsDocument,
+ `
+ Interval: 2 ms
+ Threads: GeckoMain, Dummy
+ JavaScript
+ Native Stacks
+ CPU Utilization
+ Audio Callback Tracing
+ IPC Messages
+ Process CPU Utilization
+ `
+ );
+ }
+ );
+});
+
+add_task(async function test_change_in_devtools_panel() {
+ // This test assumes that the Web Developer preset is set by default, which is
+ // not the case on Nightly and custom builds, or after previous tests.
+ BackgroundJSM.changePreset(
+ "aboutprofiling",
+ "web-developer",
+ Services.profiler.GetFeatures()
+ );
+
+ info(
+ "Test that changing settings in the devtools panel changes settings in about:profiling too."
+ );
+
+ await withDevToolsPanel(
+ "about:profiling",
+ async (devtoolsDocument, aboutProfilingDocument) => {
+ const presetsInDevtools = await getNearestInputFromText(
+ devtoolsDocument,
+ "Settings"
+ );
+
+ const webdev = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Web Developer"
+ );
+ const graphics = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Graphics"
+ );
+ const media = await getNearestInputFromText(
+ aboutProfilingDocument,
+ "Media"
+ );
+
+ // Default values
+ ok(
+ webdev.checked,
+ "By default the Web Developer preset is selected in the about:profiling interface."
+ );
+ is(
+ presetsInDevtools.value,
+ "web-developer",
+ "The presets default to webdev mode in the devtools panel."
+ );
+
+ // Change the preset in devtools panel, check it changes also in
+ // about:profiling.
+ ok(
+ !graphics.checked,
+ "The Graphics preset is not checked in about:profiling."
+ );
+
+ setReactFriendlyInputValue(presetsInDevtools, "graphics");
+ await TestUtils.waitForCondition(
+ () => graphics.checked,
+ "After changing the preset in the devtools panel, the Graphics preset is now checked in about:profiling."
+ );
+ await TestUtils.waitForCondition(
+ () => presetsInDevtools.value === "graphics",
+ "The preset was changed to Graphics in the devtools panel too."
+ );
+
+ // Change another preset now
+ ok(!media.checked, "The Media preset is not checked.");
+ setReactFriendlyInputValue(presetsInDevtools, "media");
+ await TestUtils.waitForCondition(
+ () => media.checked,
+ "After changing the preset in the devtools panel, the Media preset is now checked in about:profiling."
+ );
+ await TestUtils.waitForCondition(
+ () => presetsInDevtools.value === "media",
+ "The preset was changed to Media in the devtools panel too."
+ );
+ }
+ );
+});