Adding upstream version 115.7.0esr.upstream/115.7.0esr upstream

Signed-off-by: Daniel Baumann <daniel.baumann@progress-linux.org>
author: Daniel Baumann <daniel.baumann@progress-linux.org> 2024-04-07 19:33:14 +0000
committer: Daniel Baumann <daniel.baumann@progress-linux.org> 2024-04-07 19:33:14 +0000
commit: 36d22d82aa202bb199967e9512281e9a53db42c9 (patch)
tree: 105e8c98ddea1c1e4784a60a5a6410fa416be2de /dom/l10n/tests/mochitest/l10n_mutations
parent: Initial commit. (diff)
download: firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz
firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip
9 files changed, 498 insertions, 0 deletions
diff --git a/dom/l10n/tests/mochitest/l10n_mutations/test_append_content_post_dcl.html b/dom/l10n/tests/mochitest/l10n_mutations/test_append_content_post_dcl.html
new file mode 100644
index 0000000000..e3a9819728
--- /dev/null
+++ b/dom/l10n/tests/mochitest/l10n_mutations/test_append_content_post_dcl.html
@@ -0,0 +1,30 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test L10n Mutations for ContentAppended after DOMContentLoaded</title>
+  <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
+  <link rel="localization" href="crashreporter/aboutcrashes.ftl"/>
+  <script type="application/javascript">
+  "use strict";
+  SimpleTest.waitForExplicitFinish();
+
+  document.addEventListener("DOMContentLoaded", function() {
+    let elem = document.createElement("div");
+    document.l10n.setAttributes(elem, "crash-reports-title");
+    is(elem.textContent.length, 0);
+    let verifyL10n = () => {
+      if (elem.textContent.length) {
+        window.removeEventListener("MozAfterPaint", verifyL10n);
+        SimpleTest.finish();
+      }
+    };
+    window.addEventListener("MozAfterPaint", verifyL10n);
+    document.body.appendChild(elem);
+  });
+  </script>
+</head>
+<body>
+</body>
+</html>
diff --git a/dom/l10n/tests/mochitest/l10n_mutations/test_append_content_pre_dcl.html b/dom/l10n/tests/mochitest/l10n_mutations/test_append_content_pre_dcl.html
new file mode 100644
index 0000000000..825464e7b8
--- /dev/null
+++ b/dom/l10n/tests/mochitest/l10n_mutations/test_append_content_pre_dcl.html
@@ -0,0 +1,28 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test L10n Mutations for ContentAppended before DOMContentLoaded</title>
+  <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
+  <link rel="localization" href="crashreporter/aboutcrashes.ftl"/>
+</head>
+<body>
+  <script type="application/javascript">
+  "use strict";
+  SimpleTest.waitForExplicitFinish();
+
+  let elem = document.createElement("div");
+  document.l10n.setAttributes(elem, "crash-reports-title");
+  is(elem.textContent.length, 0);
+  let verifyL10n = () => {
+    if (elem.textContent.length) {
+      window.removeEventListener("MozAfterPaint", verifyL10n);
+      SimpleTest.finish();
+    }
+  };
+  window.addEventListener("MozAfterPaint", verifyL10n);
+  document.body.appendChild(elem);
+  </script>
+</body>
+</html>
diff --git a/dom/l10n/tests/mochitest/l10n_mutations/test_append_fragment_post_dcl.html b/dom/l10n/tests/mochitest/l10n_mutations/test_append_fragment_post_dcl.html
new file mode 100644
index 0000000000..8efb3203c6
--- /dev/null
+++ b/dom/l10n/tests/mochitest/l10n_mutations/test_append_fragment_post_dcl.html
@@ -0,0 +1,39 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test L10n Mutations for appending a fragment after DOMContentLoaded</title>
+  <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
+  <link rel="localization" href="crashreporter/aboutcrashes.ftl"/>
+  <script type="application/javascript">
+  "use strict";
+  SimpleTest.waitForExplicitFinish();
+
+  document.addEventListener("DOMContentLoaded", function() {
+    let frag = document.createDocumentFragment();
+    let elem = document.createElement("div");
+    document.l10n.setAttributes(elem, "crash-reports-title");
+    frag.appendChild(elem);
+
+    let elem2 = document.createElement("div");
+    document.l10n.setAttributes(elem2, "crash-reports-title");
+    frag.appendChild(elem2);
+
+    is(elem.textContent.length, 0);
+    is(elem2.textContent.length, 0);
+
+    let verifyL10n = () => {
+      if (elem.textContent.length && elem2.textContent.length) {
+        window.removeEventListener("MozAfterPaint", verifyL10n);
+        SimpleTest.finish();
+      }
+    };
+    window.addEventListener("MozAfterPaint", verifyL10n);
+    document.body.appendChild(frag);
+  });
+  </script>
+</head>
+<body>
+</body>
+</html>
diff --git a/dom/l10n/tests/mochitest/l10n_mutations/test_disconnectedRoot_webcomponent.html b/dom/l10n/tests/mochitest/l10n_mutations/test_disconnectedRoot_webcomponent.html
new file mode 100644
index 0000000000..bb9d9fc24d
--- /dev/null
+++ b/dom/l10n/tests/mochitest/l10n_mutations/test_disconnectedRoot_webcomponent.html
@@ -0,0 +1,148 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test DOMLocalization.prototype.connectRoot with Web Components</title>
+  <script src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
+  <script type="application/javascript">
+  "use strict";
+  const l10nReg = new L10nRegistry();
+  const fs = [
+    { path: "/localization/en-US/mock.ftl", source: `
+key1 = Key 1
+key2 = Key 2
+key3 = Key 3
+key4 = Key 4
+` },
+  ];
+  const source = L10nFileSource.createMock("test", "app", ["en-US"], "/localization/{locale}", fs);
+  l10nReg.registerSources([source]);
+
+  document.domLoc = new DOMLocalization(
+    ["/mock.ftl"],
+    false,
+    l10nReg,
+    ["en-US"],
+  );
+  document.domLoc.connectRoot(document.documentElement);
+  </script>
+  <script type="application/javascript">
+    // In this test we're going to use two elements - `shadowLabel` and `lightLabel`.
+    // We create a new `DOMLocalization` and connect it to the document's root first.
+    //
+    // Then, we connect and disconnect it on root and element within the shadow DOM and
+    // apply new `data-l10n-id` onto both labels.
+    // Once the `lightLabel` get a new translation, we check what happened to the `shadowLabel`
+    // to ensure that depending on the status of connection between the shadow DOM and the `DOMLocalization`
+    // the `shadowLabel` either gets translated or not.
+
+    SimpleTest.waitForExplicitFinish();
+
+    class FluentWidget extends HTMLElement {
+      constructor() {
+        super();
+        const shadowRoot = this.attachShadow({mode: "open"});
+        const t = document.querySelector("#fluent-widget-template");
+        const instance = t.content.cloneNode(true);
+        shadowRoot.appendChild(instance);
+      }
+      connectedCallback() {
+        this.runTests();
+      }
+      runTests() {
+        // First, let's verify that the mutation will not be applied since
+        // the shadow DOM is not connected to the `DOMLocalization`.
+        let shadowLabel = this.shadowRoot.getElementById("shadowLabel");
+        let lightLabel = document.getElementById("lightLabel");
+
+        let verifyL10n = () => {
+          if (lightLabel.textContent == "Key 1") {
+            is(shadowLabel.textContent, "", "document.l10n content not applied to an element in the shadow DOM");
+            window.removeEventListener("MozAfterPaint", verifyL10n);
+            this.testPart2();
+          }
+        };
+        window.addEventListener("MozAfterPaint", verifyL10n);
+
+        document.domLoc.setAttributes(shadowLabel, "key1");
+        document.domLoc.setAttributes(lightLabel, "key1");
+      }
+      testPart2() {
+        // Next, we connect the shadow root to DOMLocalization and the next attribute
+        // change should result in a translation being applied.
+        document.domLoc.connectRoot(this.shadowRoot);
+
+        let shadowLabel = this.shadowRoot.getElementById("shadowLabel");
+        let lightLabel = document.getElementById("lightLabel");
+
+        // Test that mutation was applied.
+        let verifyL10n = () => {
+          if (lightLabel.textContent == "Key 2") {
+            is(shadowLabel.textContent, "Key 2", "document.l10n content applied to an element in the shadow DOM");
+            window.removeEventListener("MozAfterPaint", verifyL10n);
+            this.testPart3();
+          }
+        };
+        window.addEventListener("MozAfterPaint", verifyL10n);
+
+        document.domLoc.setAttributes(shadowLabel, "key2");
+        document.domLoc.setAttributes(lightLabel, "key2");
+      }
+      testPart3() {
+        // After we disconnect the shadow root, the mutations should
+        // not be applied onto the `shadowLabel`.
+        document.domLoc.disconnectRoot(this.shadowRoot);
+
+        let shadowLabel = this.shadowRoot.getElementById("shadowLabel");
+        let lightLabel = document.getElementById("lightLabel");
+
+        let verifyL10n = () => {
+          if (lightLabel.textContent == "Key 3") {
+            is(shadowLabel.textContent, "Key 2", "document.l10n content not applied to an element in the shadow DOM");
+            window.removeEventListener("MozAfterPaint", verifyL10n);
+            this.testPart4();
+          }
+        };
+        window.addEventListener("MozAfterPaint", verifyL10n);
+
+        document.domLoc.setAttributes(shadowLabel, "key3");
+        document.domLoc.setAttributes(lightLabel, "key3");
+      }
+      testPart4() {
+        // Finally, we'll connect it back, but this time, we'll connect
+        // not the shadow root, but an element within it.
+        // This should still result in the `shadowLabel` receiving a new translation.
+        document.domLoc.connectRoot(this.shadowRoot.getElementById("shadowDiv"));
+
+        let shadowLabel = this.shadowRoot.getElementById("shadowLabel");
+        let lightLabel = document.getElementById("lightLabel");
+
+        // Test that mutation was applied.
+        let verifyL10n = () => {
+          if (lightLabel.textContent == "Key 4") {
+            is(shadowLabel.textContent, "Key 4", "document.l10n content applied to an element in the shadow DOM");
+            window.removeEventListener("MozAfterPaint", verifyL10n);
+            SimpleTest.finish();
+          }
+        };
+        window.addEventListener("MozAfterPaint", verifyL10n);
+
+        document.domLoc.setAttributes(shadowLabel, "key4");
+        document.domLoc.setAttributes(lightLabel, "key4");
+      }
+    }
+    customElements.define("fluent-widget", FluentWidget);
+  </script>
+</head>
+<body>
+  <p id="lightLabel"></p>
+
+  <template id="fluent-widget-template">
+    <div id="shadowDiv">
+      <p id="shadowLabel"></p>
+    </div>
+  </template>
+  <fluent-widget id="widget1"></fluent-widget>
+</body>
+</html>
diff --git a/dom/l10n/tests/mochitest/l10n_mutations/test_pause_observing.html b/dom/l10n/tests/mochitest/l10n_mutations/test_pause_observing.html
new file mode 100644
index 0000000000..d225153418
--- /dev/null
+++ b/dom/l10n/tests/mochitest/l10n_mutations/test_pause_observing.html
@@ -0,0 +1,44 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test L10n Mutations for Pause/Resume Observing</title>
+  <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
+  <link rel="localization" href="crashreporter/aboutcrashes.ftl"/>
+  <script type="application/javascript">
+  "use strict";
+  SimpleTest.waitForExplicitFinish();
+
+  document.addEventListener("DOMContentLoaded", function() {
+    let elem1 = document.createElement("div");
+    let elem2 = document.createElement("div");
+    let elem3 = document.createElement("div");
+    is(elem1.textContent.length, 0);
+    is(elem2.textContent.length, 0);
+    is(elem3.textContent.length, 0);
+
+    document.l10n.setAttributes(elem1, "crash-reports-title");
+    document.l10n.setAttributes(elem2, "crash-reports-title");
+    document.l10n.setAttributes(elem3, "crash-reports-title");
+
+    let verifyL10n = () => {
+      if (elem1.textContent.length &&
+          !elem2.textContent.length &&
+          elem3.textContent.length) {
+        window.removeEventListener("MozAfterPaint", verifyL10n);
+        SimpleTest.finish();
+      }
+    };
+    window.addEventListener("MozAfterPaint", verifyL10n);
+    document.body.appendChild(elem1);
+    document.l10n.pauseObserving();
+    document.body.appendChild(elem2);
+    document.l10n.resumeObserving();
+    document.body.appendChild(elem3);
+  });
+  </script>
+</head>
+<body>
+</body>
+</html>
diff --git a/dom/l10n/tests/mochitest/l10n_mutations/test_remove_element.html b/dom/l10n/tests/mochitest/l10n_mutations/test_remove_element.html
new file mode 100644
index 0000000000..347e858d52
--- /dev/null
+++ b/dom/l10n/tests/mochitest/l10n_mutations/test_remove_element.html
@@ -0,0 +1,68 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test L10n Mutations for removing element</title>
+  <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
+  <link rel="localization" href="crashreporter/aboutcrashes.ftl"/>
+  <script type="application/javascript">
+  "use strict";
+  SimpleTest.waitForExplicitFinish();
+
+  document.addEventListener("DOMContentLoaded", async function() {
+    // This element will be added to DOM and expected to be localized.
+    let elem = document.createElement("div");
+
+    // This element will be added to DOM, then immediatelly removed and
+    // expected *not* to be localized.
+    let elem2 = document.createElement("div");
+
+    // This element will be added to DOM, then immediatelly removed and
+    // and then immediatelly re-added, and expected to be localized.
+    let elem3 = document.createElement("div");
+
+    // This element will be added to DOM, then immediatelly removed and
+    // and then re-added later, and expected to be localized.
+    let elem4 = document.createElement("div");
+
+    document.l10n.setAttributes(elem, "crash-reports-title");
+    document.l10n.setAttributes(elem2, "crash-reports-title");
+    document.l10n.setAttributes(elem3, "crash-reports-title");
+    document.l10n.setAttributes(elem4, "crash-reports-title");
+
+    document.body.appendChild(elem);
+    document.body.appendChild(elem2);
+    document.body.appendChild(elem3);
+    document.body.appendChild(elem4);
+
+    is(elem.textContent.length, 0);
+    is(elem2.textContent.length, 0);
+    is(elem3.textContent.length, 0);
+    is(elem4.textContent.length, 0);
+
+    document.body.removeChild(elem2);
+    document.body.removeChild(elem3);
+    document.body.removeChild(elem4);
+
+    document.body.appendChild(elem3);
+
+    // 1. `elem` should be localized since it is in DOM.
+    await SimpleTest.waitForCondition(() => elem.textContent.length);
+    // 2. `elem2` was removed before l10n frame, so it should remain not localized.
+    is(elem2.textContent.length, 0);
+    // 3. `elem3` was added/removed/re-added so it should become localized.
+    await SimpleTest.waitForCondition(() => elem3.textContent.length);
+    // 4. `elem4` was not re-added, so it shouldn't be localized.
+    is(elem4.textContent.length, 0);
+
+    document.body.appendChild(elem4);
+    // 5. Now we re-added `elem4` to DOM so it should get localized.
+    await SimpleTest.waitForCondition(() => elem4.textContent.length);
+    SimpleTest.finish();
+  });
+  </script>
+</head>
+<body>
+</body>
+</html>
diff --git a/dom/l10n/tests/mochitest/l10n_mutations/test_remove_fragment.html b/dom/l10n/tests/mochitest/l10n_mutations/test_remove_fragment.html
new file mode 100644
index 0000000000..4f4d0fe1d8
--- /dev/null
+++ b/dom/l10n/tests/mochitest/l10n_mutations/test_remove_fragment.html
@@ -0,0 +1,67 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test L10n Mutations for removing fragment</title>
+  <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
+  <link rel="localization" href="crashreporter/aboutcrashes.ftl"/>
+  <script type="application/javascript">
+  "use strict";
+  SimpleTest.waitForExplicitFinish();
+
+  document.addEventListener("DOMContentLoaded", async function() {
+    let div = document.createElement("div");
+    let div2 = document.createElement("div");
+
+    let elem = document.createElement("p");
+    let elem2 = document.createElement("p");
+    let elem3 = document.createElement("p");
+    let elem4 = document.createElement("p");
+
+    document.l10n.setAttributes(elem, "crash-reports-title");
+    document.l10n.setAttributes(elem2, "crash-reports-title");
+    document.l10n.setAttributes(elem3, "crash-reports-title");
+    document.l10n.setAttributes(elem4, "crash-reports-title");
+
+    div.appendChild(elem);
+    div.appendChild(elem2);
+    div.appendChild(elem3);
+    div.appendChild(elem4);
+
+    document.body.appendChild(div);
+
+    is(elem.textContent.length, 0);
+    is(elem2.textContent.length, 0);
+    is(elem3.textContent.length, 0);
+    is(elem4.textContent.length, 0);
+
+    document.body.removeChild(div);
+
+    div2.appendChild(elem);
+    div2.appendChild(elem3);
+
+    document.body.appendChild(div2);
+
+    // 1. `elem` should be localized since it is in DOM.
+    await SimpleTest.waitForCondition(() => !!elem.textContent.length);
+
+    // 2. `elem2` was removed before l10n frame, so it should remain not localized.
+    is(elem2.textContent.length, 0);
+
+    // 3. `elem3` was added/removed/re-added so it should become localized.
+    await SimpleTest.waitForCondition(() => !!elem3.textContent.length);
+
+    // 4. `elem4` was not re-added, so it shouldn't be localized.
+    is(elem4.textContent.length, 0);
+
+    document.body.appendChild(div);
+    // 5. Now we re-added `elem4` to DOM so it should get localized.
+    await SimpleTest.waitForCondition(() => !!elem4.textContent.length);
+    SimpleTest.finish();
+  });
+  </script>
+</head>
+<body>
+</body>
+</html>
diff --git a/dom/l10n/tests/mochitest/l10n_mutations/test_set_attributes.html b/dom/l10n/tests/mochitest/l10n_mutations/test_set_attributes.html
new file mode 100644
index 0000000000..762353a06c
--- /dev/null
+++ b/dom/l10n/tests/mochitest/l10n_mutations/test_set_attributes.html
@@ -0,0 +1,37 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test L10n Mutations for AttributeChange after DOMContentLoaded</title>
+  <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
+  <link rel="localization" href="crashreporter/aboutcrashes.ftl"/>
+  <link rel="localization" href="toolkit/about/aboutCompat.ftl"/>
+  <script type="application/javascript">
+  "use strict";
+  SimpleTest.waitForExplicitFinish();
+
+  document.addEventListener("DOMContentLoaded", async function() {
+    await document.l10n.ready;
+    let elem = document.getElementById("elem1");
+    let elem2 = document.getElementById("elem2");
+    is(elem.textContent.length, 0);
+    is(elem2.textContent.includes("Initial string"), true);
+    document.l10n.setAttributes(elem, "crash-reports-title");
+    elem2.setAttribute("data-l10n-args", JSON.stringify({bug: "New string"}));
+
+    let verifyL10n = () => {
+      if (elem.textContent.length && elem2.textContent.includes("New string")) {
+        window.removeEventListener("MozAfterPaint", verifyL10n);
+        SimpleTest.finish();
+      }
+    };
+    window.addEventListener("MozAfterPaint", verifyL10n);
+  });
+  </script>
+</head>
+<body>
+  <div id="elem1"></div>
+  <div id="elem2" data-l10n-id="label-more-information" data-l10n-args='{"bug":"Initial string"}'></div>
+</body>
+</html>
diff --git a/dom/l10n/tests/mochitest/l10n_mutations/test_template.html b/dom/l10n/tests/mochitest/l10n_mutations/test_template.html
new file mode 100644
index 0000000000..d02ecfcd4d
--- /dev/null
+++ b/dom/l10n/tests/mochitest/l10n_mutations/test_template.html
@@ -0,0 +1,37 @@
+<!DOCTYPE HTML>
+<html>
+<head>
+  <meta charset="utf-8">
+  <title>Test L10n Mutations in Template elements</title>
+  <script type="application/javascript" src="chrome://mochikit/content/tests/SimpleTest/SimpleTest.js"></script>
+  <link rel="stylesheet" type="text/css" href="chrome://mochikit/content/tests/SimpleTest/test.css">
+  <link rel="localization" href="crashreporter/aboutcrashes.ftl"/>
+  <script type="application/javascript">
+  "use strict";
+  SimpleTest.waitForExplicitFinish();
+
+  document.addEventListener("DOMContentLoaded", async () => {
+    await document.l10n.ready;
+    let template = document.getElementById("template");
+    let clone = document.importNode(template.content, true);
+    let span = clone.querySelector("span");
+    is(span.textContent.length, 0,
+      "Element has not been translated while in template");
+    document.body.appendChild(clone);
+
+    let verifyL10n = () => {
+      if (span.textContent.length) {
+        window.removeEventListener("MozAfterPaint", verifyL10n);
+        SimpleTest.finish();
+      }
+    };
+    window.addEventListener("MozAfterPaint", verifyL10n);
+  });
+  </script>
+</head>
+<body>
+  <template id="template">
+    <span data-l10n-id="crash-reports-title"></span>
+  </template>
+</body>
+</html>
author	Daniel Baumann <daniel.baumann@progress-linux.org>	2024-04-07 19:33:14 +0000
committer	Daniel Baumann <daniel.baumann@progress-linux.org>	2024-04-07 19:33:14 +0000
commit	36d22d82aa202bb199967e9512281e9a53db42c9 (patch)
tree	105e8c98ddea1c1e4784a60a5a6410fa416be2de /dom/l10n/tests/mochitest/l10n_mutations
parent	Initial commit. (diff)
download	firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.tar.xz firefox-esr-36d22d82aa202bb199967e9512281e9a53db42c9.zip