From af3e9305440bba5f0fbe732f5626793859e99453 Mon Sep 17 00:00:00 2001
From: Bauke <me@bauke.xyz>
Date: Wed, 23 Feb 2022 23:28:33 +0100
Subject: [PATCH] Consolidate the MutationObserver-dependent features to use a
 single observer.

---
 source/content-scripts.ts             | 56 +++++++++++++++++++++------
 source/scripts/anonymize-usernames.ts | 15 -------
 source/scripts/hide-votes.ts          | 15 -------
 source/scripts/markdown-toolbar.ts    | 18 ---------
 4 files changed, 45 insertions(+), 59 deletions(-)

diff --git a/source/content-scripts.ts b/source/content-scripts.ts
index 7b402a9..a4c8b62 100644
--- a/source/content-scripts.ts
+++ b/source/content-scripts.ts
@@ -34,13 +34,50 @@ async function initialize() {
     }
   }
 
-  // Object to hold the active components we are going to render.
-  const components: Record<string, TRXComponent | undefined> = {};
+  const observerFeatures: Array<() => any> = [];
+  const observer = new window.MutationObserver(() => {
+    log('Page mutation detected, rerunning features.');
+    observer.disconnect();
+    for (const feature of observerFeatures) {
+      feature();
+    }
+
+    startObserver();
+  });
+
+  function startObserver() {
+    observer.observe(document.body, {
+      childList: true,
+      subtree: true,
+    });
+  }
 
   if (settings.features.anonymizeUsernames) {
-    runAnonymizeUsernamesFeature();
+    observerFeatures.push(() => {
+      runAnonymizeUsernamesFeature();
+    });
   }
 
+  if (settings.features.hideVotes) {
+    observerFeatures.push(() => {
+      runHideVotesFeature(settings);
+    });
+  }
+
+  if (settings.features.markdownToolbar) {
+    observerFeatures.push(() => {
+      runMarkdownToolbarFeature();
+    });
+  }
+
+  // Initialize all the observer-dependent features first.
+  for (const feature of observerFeatures) {
+    feature();
+  }
+
+  // Object to hold the active components we are going to render.
+  const components: Record<string, TRXComponent | undefined> = {};
+
   if (settings.features.autocomplete) {
     components.autocomplete = html`
       <${AutocompleteFeature} settings=${settings} />
@@ -51,18 +88,10 @@ async function initialize() {
     components.backToTop = html`<${BackToTopFeature} />`;
   }
 
-  if (settings.features.hideVotes) {
-    runHideVotesFeature(settings);
-  }
-
   if (settings.features.jumpToNewComment) {
     components.jumpToNewComment = html`<${JumpToNewCommentFeature} />`;
   }
 
-  if (settings.features.markdownToolbar) {
-    runMarkdownToolbarFeature();
-  }
-
   if (settings.features.userLabels) {
     components.userLabels = html`
       <${UserLabelsFeature} settings=${settings} />
@@ -88,6 +117,11 @@ async function initialize() {
     replacement,
   );
 
+  // Start the mutation observer only when some features depend on it are enabled.
+  if (observerFeatures.length > 0) {
+    startObserver();
+  }
+
   const initializedIn = window.performance.now() - start;
   log(`Initialized in approximately ${initializedIn} milliseconds.`);
 }
diff --git a/source/scripts/anonymize-usernames.ts b/source/scripts/anonymize-usernames.ts
index 25b2f43..93e0ad1 100644
--- a/source/scripts/anonymize-usernames.ts
+++ b/source/scripts/anonymize-usernames.ts
@@ -1,22 +1,7 @@
 import {log, querySelectorAll} from '../utilities/exports.js';
 
 export function runAnonymizeUsernamesFeature() {
-  const observer = new window.MutationObserver(() => {
-    observer.disconnect();
-    anonymizeUsernames();
-    startObserver();
-  });
-
-  function startObserver() {
-    observer.observe(document, {
-      childList: true,
-      subtree: true,
-    });
-  }
-
   const count = anonymizeUsernames();
-  startObserver();
-
   log(`Anonymize Usernames: Initialized for ${count} user links.`);
 }
 
diff --git a/source/scripts/hide-votes.ts b/source/scripts/hide-votes.ts
index 9561b06..867f230 100644
--- a/source/scripts/hide-votes.ts
+++ b/source/scripts/hide-votes.ts
@@ -2,22 +2,7 @@ import Settings from '../settings.js';
 import {log, querySelectorAll} from '../utilities/exports.js';
 
 export function runHideVotesFeature(settings: Settings) {
-  const observer = new window.MutationObserver(() => {
-    observer.disconnect();
-    hideVotes(settings);
-    startObserver();
-  });
-
-  function startObserver() {
-    observer.observe(document, {
-      childList: true,
-      subtree: true,
-    });
-  }
-
   hideVotes(settings);
-  startObserver();
-
   log('Hide Votes: Initialized.');
 }
 
diff --git a/source/scripts/markdown-toolbar.ts b/source/scripts/markdown-toolbar.ts
index c68e39c..420c7a1 100644
--- a/source/scripts/markdown-toolbar.ts
+++ b/source/scripts/markdown-toolbar.ts
@@ -75,25 +75,7 @@ const snippets: MarkdownSnippet[] = [
 }));
 
 export function runMarkdownToolbarFeature() {
-  // Create an observer that will add toolbars whenever
-  // a new Markdown form is created (like when clicking Reply).
-  const observer = new window.MutationObserver(() => {
-    observer.disconnect();
-    addToolbarsToTextareas();
-    startObserver();
-  });
-
-  function startObserver() {
-    observer.observe(document, {
-      childList: true,
-      subtree: true,
-    });
-  }
-
-  // Run once when the page loads.
   addToolbarsToTextareas();
-  startObserver();
-
   log('Markdown Toolbar: Initialized.');
 }