feat: endless observer for tweet status btn

Author: DIYgod

src/common/utils.ts

@@ -2,7 +2,7 @@ import { debounce } from 'lodash-es';
 
 const interval = 200;
 const maxCount = 10000 / interval;
-export function observe(selector: string, callback: (ele: Element) => void) {
+export function observe(selector: string, callback: (ele: Element) => void, endless?: boolean) {
     let observer: MutationObserver;
     let cache: Element;
     const cb = (result: Element) => {
@@ -14,7 +14,7 @@ export function observe(selector: string, callback: (ele: Element) => void) {
     const run = () => {
         let currentCount = 0;
         const result = document.querySelector(selector);
-        if (result) {
+        if (result && !endless) {
             cb(result);
         } else {
             if (observer) {
@@ -23,13 +23,19 @@ export function observe(selector: string, callback: (ele: Element) => void) {
             observer = new MutationObserver(
                 debounce(() => {
                     const result = document.querySelector(selector);
-                    if (result) {
-                        observer.disconnect();
-                        cb(result);
-                    } else if (currentCount > maxCount) {
-                        observer.disconnect();
+                    if (!endless) {
+                        if (result) {
+                            observer.disconnect();
+                            cb(result);
+                        } else if (currentCount > maxCount) {
+                            observer.disconnect();
+                        } else {
+                            currentCount++;
+                        }
                     } else {
-                        currentCount++;
+                        if (result) {
+                            cb(result);
+                        }
                     }
                 }, interval),
             );

src/content-script/hooks/twitter.ts

@@ -33,6 +33,7 @@ class TwitterHook {
                 callback: async (el) => {
                     this.mountSyncOldTweets();
                 },
+                endless: true,
             },
         ];
 

src/content-script/index.ts

@@ -11,6 +11,7 @@ import '../css/lib.css';
 export interface Hook {
     selector: string;
     callback: (el: Element) => void;
+    endless?: boolean;
 }
 
 class CrossSyncContentScript {
@@ -29,7 +30,7 @@ class CrossSyncContentScript {
         switch (new URL(window.location.href).host) {
             case 'twitter.com':
                 new TwitterHook(this).hooks.forEach((h) => {
-                    observe(h.selector, h.callback);
+                    observe(h.selector, h.callback, h.endless);
                 });
                 break;
             default: