check for proplate existence with mutationobserver

this only removes the "checked" attribute
once the proplate has actually been removed
fixes #31

src/content_scripts/protoots.js

@@ -9,6 +9,13 @@
 import { fetchPronouns } from "../libs/fetchPronouns";
 import { getLogging, isLogging } from "../libs/logging";
 import { warn, log } from "../libs/logging";
+import {
+	findAllDescendants,
+	hasClasses,
+	insertAfter,
+	waitForElement,
+	waitForElementRemoved,
+} from "../libs/domhelpers";
 import { addTypeAttribute, normaliseAccountName, sanitizePronouns } from "../libs/protootshelpers";
 
 // const max_age = 8.64e7
@@ -129,9 +136,9 @@ function onTootIntersection(observerentries) {
 	for (const observation of observerentries) {
 		const ArticleElement = observation.target;
 		if (!observation.isIntersecting) {
-			if (ArticleElement.getAttribute("protoots-type") == "status")
+			waitForElementRemoved(ArticleElement, ".protoots-proplate", () => {
 				ArticleElement.removeAttribute("protoots-checked");
-			continue;
+			});
 		}
 		waitForElement(ArticleElement, ".display-name", () => addProplate(ArticleElement));
 	}

src/libs/domhelpers.js

@@ -51,6 +51,31 @@ export function waitForElement(node, selector, callback) {
 	}).observe(node, { subtree: true, childList: true });
 }
 
+/**
+ * Waits until the given selector appears below the given node. Then removes itself.
+ * TODO: turn into single MutationObserver?
+ *
+ * @param {Element} node
+ * @param {string} selector
+ * @param {(el: Element) => void} callback
+ * @copyright CC-BY-SA 4.0 wOxxoM https://stackoverflow.com/a/71488320
+ */
+export function waitForElementRemoved(node, selector, callback) {
+	let el = node.querySelector(selector);
+	if (!el) {
+		callback(el);
+		return;
+	}
+
+	new MutationObserver((mutations, observer) => {
+		el = node.querySelector(selector);
+		if (!el) {
+			observer.disconnect();
+			callback(el);
+		}
+	}).observe(node, { subtree: true, childList: true });
+}
+
 /**
  * Inserts a given new element as a sibling of the target
  * @param {HTMLElement} insertion Element to insert