refactor: use weakset to track elemets

pionxzh · Jul 30, 2023 · 3a8e172 · 3a8e172
1 parent 7924beb
commit 3a8e172
Showing 1 changed file with 7 additions and 8 deletions.
diff --git a/packages/userscript/src/main.ts b/packages/userscript/src/main.ts
@@ -9,8 +9,6 @@ const twitterIconSvgInner = '<g><path d="M23.643 4.937c-.835.37-1.732.62-2.675.7
 
 // const verifiedIconSvg = '<g><path d="M20.396 11c-.018-.646-.215-1.275-.57-1.816-.354-.54-.852-.972-1.438-1.246.223-.607.27-1.264.14-1.897-.131-.634-.437-1.218-.882-1.687-.47-.445-1.053-.75-1.687-.882-.633-.13-1.29-.083-1.897.14-.273-.587-.704-1.086-1.245-1.44S11.647 1.62 11 1.604c-.646.017-1.273.213-1.813.568s-.969.854-1.24 1.44c-.608-.223-1.267-.272-1.902-.14-.635.13-1.22.436-1.69.882-.445.47-.749 1.055-.878 1.688-.13.633-.08 1.29.144 1.896-.587.274-1.087.705-1.443 1.245-.356.54-.555 1.17-.574 1.817.02.647.218 1.276.574 1.817.356.54.856.972 1.443 1.245-.224.606-.274 1.263-.144 1.896.13.634.433 1.218.877 1.688.47.443 1.054.747 1.687.878.633.132 1.29.084 1.897-.136.274.586.705 1.084 1.246 1.439.54.354 1.17.551 1.816.569.647-.016 1.276-.213 1.817-.567s.972-.854 1.245-1.44c.604.239 1.266.296 1.903.164.636-.132 1.22-.447 1.68-.907.46-.46.776-1.044.908-1.681s.075-1.299-.165-1.903c.586-.274 1.084-.705 1.439-1.246.354-.54.551-1.17.569-1.816zM9.662 14.85l-3.429-3.428 1.293-1.302 2.072 2.072 4.4-4.794 1.347 1.246z"></path></g>'
 
-// const twitterIconSvg = `<svg data-replaced="true" viewBox="0 0 24 24" aria-hidden="true" class="r-k200y r-1cvl2hr r-4qtqp9 r-yyyyoo r-eu3ka r-dnmrzs r-bnwqim r-1plcrui r-lrvibr old-twitter-icon">${twitterIconSvgInner}</svg>`
-
 const linkMap: Record<string, string> = {
     'mask-icon': 'https://abs.twimg.com/responsive-web/client-web/icon-svg.168b89da.svg',
     'shortcut icon': '//abs.twimg.com/favicons/twitter.2.ico',
@@ -20,10 +18,11 @@ const metaMap: Record<string, string> = {
     'apple-mobile-web-app-title': 'Twitter',
 }
 
+const checkedElements = new WeakSet<Element>()
+
 function main() {
+    injectStyle()
     onloadSafe(() => {
-        injectStyle()
-
         const placeHolderIconSelector = '#placeholder > svg'
         replaceIcon(placeHolderIconSelector, 'twitter-blue')
 
@@ -43,8 +42,8 @@ function main() {
 
         // Fuzzy matching for all 𝕏 icons
         sentinel.on('svg', (svg) => {
-            if (svg.getAttribute('data-replaced') === 'true') return
-            svg.setAttribute('data-replaced', 'true')
+            if (checkedElements.has(svg)) return
+            checkedElements.add(svg)
 
             if (svg.innerHTML === xIconSvgInner) svg.innerHTML = twitterIconSvgInner
             if (svg.innerHTML === xIconInNotification) svg.innerHTML = twitterIconSvgInner
@@ -111,8 +110,8 @@ function injectStyle() {
 
 function replaceIcon(selector: string, applyStyle?: string) {
     sentinel.on(selector, (svg) => {
-        if (svg.getAttribute('data-replaced') === 'true') return
-        svg.setAttribute('data-replaced', 'true')
+        if (checkedElements.has(svg)) return
+        checkedElements.add(svg)
 
         svg.innerHTML = twitterIconSvgInner
         if (applyStyle) svg.classList.add(applyStyle)