Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>

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."
+      );
+    }
+  );
+});