summaryrefslogtreecommitdiffstats
path: root/devtools/shared/commands/resource/tests/browser_resources_reflows.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/shared/commands/resource/tests/browser_resources_reflows.js
parentInitial commit. (diff)
downloadfirefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz
firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip
Adding upstream version 115.7.0esr.upstream/115.7.0esrupstream
Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
Diffstat (limited to 'devtools/shared/commands/resource/tests/browser_resources_reflows.js')
-rw-r--r--devtools/shared/commands/resource/tests/browser_resources_reflows.js111
1 files changed, 111 insertions, 0 deletions
diff --git a/devtools/shared/commands/resource/tests/browser_resources_reflows.js b/devtools/shared/commands/resource/tests/browser_resources_reflows.js
new file mode 100644
index 0000000000..e4e7b57f13
--- /dev/null
+++ b/devtools/shared/commands/resource/tests/browser_resources_reflows.js
@@ -0,0 +1,111 @@
+/* Any copyright is dedicated to the Public Domain.
+ http://creativecommons.org/publicdomain/zero/1.0/ */
+
+"use strict";
+
+// Test the ResourceCommand API for reflows
+
+const {
+ TYPES,
+} = require("resource://devtools/shared/commands/resource/resource-command.js");
+
+add_task(async function () {
+ const tab = await addTab(
+ "https://example.com/document-builder.sjs?html=<h1>Test reflow resources</h1>"
+ );
+
+ const { client, resourceCommand, targetCommand } = await initResourceCommand(
+ tab
+ );
+
+ const resources = [];
+ const onAvailable = _resources => {
+ resources.push(..._resources);
+ };
+ await resourceCommand.watchResources([TYPES.REFLOW], {
+ onAvailable,
+ });
+
+ is(resources.length, 0, "No reflow resource were sent initially");
+
+ await SpecialPowers.spawn(tab.linkedBrowser, [], () => {
+ const el = content.document.createElement("div");
+ el.textContent = "1";
+ content.document.body.appendChild(el);
+ });
+
+ await waitFor(() => resources.length === 1);
+ checkReflowResource(resources[0]);
+
+ await SpecialPowers.spawn(tab.linkedBrowser, [], () => {
+ const el = content.document.querySelector("div");
+ el.style.display = "inline-grid";
+ });
+
+ await waitFor(() => resources.length === 2);
+ ok(
+ true,
+ "A reflow resource is sent when the display property of an element is modified"
+ );
+ checkReflowResource(resources.at(-1));
+
+ info("Check that adding an iframe does emit a reflow");
+ const iframeBC = await SpecialPowers.spawn(
+ tab.linkedBrowser,
+ [],
+ async () => {
+ const el = content.document.createElement("iframe");
+ const onIframeLoaded = new Promise(resolve =>
+ el.addEventListener("load", resolve, { once: true })
+ );
+ content.document.body.appendChild(el);
+ el.src =
+ "https://example.org/document-builder.sjs?html=<h2>remote iframe</h2>";
+ await onIframeLoaded;
+ return el.browsingContext;
+ }
+ );
+
+ await waitFor(() => resources.length === 3);
+ ok(true, "A reflow resource was received when adding a remote iframe");
+ checkReflowResource(resources.at(-1));
+
+ info("Check that we receive reflow resources for the remote iframe");
+ await SpecialPowers.spawn(iframeBC, [], () => {
+ const el = content.document.createElement("section");
+ el.textContent = "remote org iframe";
+ el.style.display = "grid";
+ content.document.body.appendChild(el);
+ });
+
+ await waitFor(() => resources.length === 4);
+ if (isFissionEnabled()) {
+ ok(
+ resources.at(-1).targetFront.url.includes("example.org"),
+ "The reflow resource is linked to the remote target"
+ );
+ }
+ checkReflowResource(resources.at(-1));
+
+ targetCommand.destroy();
+ await client.close();
+});
+
+function checkReflowResource(resource) {
+ is(
+ resource.resourceType,
+ TYPES.REFLOW,
+ "The resource has the expected resourceType"
+ );
+
+ ok(Array.isArray(resource.reflows), "the `reflows` property is an array");
+ for (const reflow of resource.reflows) {
+ is(
+ Number.isFinite(reflow.start),
+ true,
+ "reflow start property is a number"
+ );
+ is(Number.isFinite(reflow.end), true, "reflow end property is a number");
+ ok(reflow.end >= reflow.start, "end is greater than start");
+ }
+}