Bug 1884479 - Make sure is DOM ready in TranslationsDocument; r=translations-reviewers,nordzilla

The TranslationsDocument can be invoked before the DOM content is
loaded.

Differential Revision: https://phabricator.services.mozilla.com/D211876

toolkit/components/translations/content/translations-document.sys.mjs

@@ -465,8 +465,18 @@ export class TranslationsDocument {
       this.handleVisibilityChange
     );
 
-    this.addRootElement(document.querySelector("title"));
-    this.addRootElement(document.body, true /* reportWordsInViewport */);
+    const addRootElements = () => {
+      this.addRootElement(document.querySelector("title"));
+      this.addRootElement(document.body, true /* reportWordsInViewport */);
+    };
+
+    if (document.body) {
+      addRootElements();
+    } else {
+      // The TranslationsDocument was invoked before the DOM was ready, wait for
+      // it to be loaded.
+      document.addEventListener("DOMContentLoaded", addRootElements);
+    }
 
     this.viewportTranslated?.then(() => {
       ChromeUtils.addProfilerMarker(