DEV: Remove decorateCookedElement id parameters (#23544)

These are no longer required per https://github.com/discourse/discourse/pull/23543
2024-11-22 09:12:45 +08:00 · 2023-09-12 16:32:04 +01:00 · 2023-09-12 16:32:04 +01:00 · c3061d580c
commit c3061d580c
parent e0d8dae0b3
14 changed files with 126 additions and 177 deletions
--- a/app/assets/javascripts/discourse/app/instance-initializers/animated-images-pause-on-click.js
+++ b/app/assets/javascripts/discourse/app/instance-initializers/animated-images-pause-on-click.js
@ -100,7 +100,6 @@ export default {

      api.decorateCookedElement(_attachCommands, {
        onlyStream: true,
-        id: "animated-images-pause-on-click",
      });

      api.cleanupStream(_cleanUp);
--- a/app/assets/javascripts/discourse/app/instance-initializers/codeblock-buttons.js
+++ b/app/assets/javascripts/discourse/app/instance-initializers/codeblock-buttons.js
@ -43,7 +43,6 @@ export default {
        },
        {
          onlyStream: true,
-          id: "codeblock-buttons",
        }
      );

--- a/app/assets/javascripts/discourse/app/instance-initializers/hashtag-post-decorations.js
+++ b/app/assets/javascripts/discourse/app/instance-initializers/hashtag-post-decorations.js
@ -10,7 +10,6 @@ export default {
    withPluginApi("0.8.7", (api) => {
      api.decorateCookedElement((post) => decorateHashtags(post, site), {
        onlyStream: true,
-        id: "hashtag-icons",
      });
    });
  },
--- a/app/assets/javascripts/discourse/app/instance-initializers/image-aspect-ratio.js
+++ b/app/assets/javascripts/discourse/app/instance-initializers/image-aspect-ratio.js
@ -14,42 +14,35 @@ export default {
  initWithApi(api) {
    const supportsAspectRatio = CSS.supports("aspect-ratio: 1");

-    api.decorateCookedElement(
-      (element) => {
-        element.querySelectorAll("img").forEach((img) => {
-          const declaredHeight = parseFloat(img.getAttribute("height"));
-          const declaredWidth = parseFloat(img.getAttribute("width"));
+    api.decorateCookedElement((element) => {
+      element.querySelectorAll("img").forEach((img) => {
+        const declaredHeight = parseFloat(img.getAttribute("height"));
+        const declaredWidth = parseFloat(img.getAttribute("width"));

-          if (
-            isNaN(declaredHeight) ||
-            isNaN(declaredWidth) ||
-            img.style.aspectRatio
-          ) {
-            return;
-          }
+        if (
+          isNaN(declaredHeight) ||
+          isNaN(declaredWidth) ||
+          img.style.aspectRatio
+        ) {
+          return;
+        }

-          if (supportsAspectRatio) {
-            img.style.setProperty(
-              "aspect-ratio",
-              `${declaredWidth} / ${declaredHeight}`
-            );
-          } else {
-            // For older browsers (e.g. iOS < 15), we need to apply the aspect ratio manually.
-            // It's not perfect, because it won't recompute on browser resize.
-            // This property is consumed in `topic-post.scss` for responsive images only.
-            // It's a no-op for non-responsive images.
-            const calculatedHeight =
-              img.width / (declaredWidth / declaredHeight);
+        if (supportsAspectRatio) {
+          img.style.setProperty(
+            "aspect-ratio",
+            `${declaredWidth} / ${declaredHeight}`
+          );
+        } else {
+          // For older browsers (e.g. iOS < 15), we need to apply the aspect ratio manually.
+          // It's not perfect, because it won't recompute on browser resize.
+          // This property is consumed in `topic-post.scss` for responsive images only.
+          // It's a no-op for non-responsive images.
+          const calculatedHeight = img.width / (declaredWidth / declaredHeight);

-            img.style.setProperty(
-              "--calculated-height",
-              `${calculatedHeight}px`
-            );
-          }
-        });
-      },
-      { id: "image-aspect-ratio" }
-    );
+          img.style.setProperty("--calculated-height", `${calculatedHeight}px`);
+        }
+      });
+    });
  },

  initialize() {
--- a/app/assets/javascripts/discourse/app/instance-initializers/onebox-decorators.js
+++ b/app/assets/javascripts/discourse/app/instance-initializers/onebox-decorators.js
@ -40,14 +40,9 @@ function _cleanUp() {
 export default {
  initialize() {
    withPluginApi("0.8.42", (api) => {
-      api.decorateCookedElement(
-        (element) => {
-          decorateGithubOneboxBody(element);
-        },
-        {
-          id: "onebox-github-body",
-        }
-      );
+      api.decorateCookedElement((element) => {
+        decorateGithubOneboxBody(element);
+      });

      api.cleanupStream(_cleanUp);
    });
--- a/app/assets/javascripts/discourse/app/instance-initializers/post-decorations.js
+++ b/app/assets/javascripts/discourse/app/instance-initializers/post-decorations.js
@ -21,14 +21,9 @@ export default {
      const modal = owner.lookup("service:modal");
      // will eventually just be called lightbox
      const lightboxService = owner.lookup("service:lightbox");
-      api.decorateCookedElement(
-        (elem) => {
-          return highlightSyntax(elem, siteSettings, session);
-        },
-        {
-          id: "discourse-syntax-highlighting",
-        }
-      );
+      api.decorateCookedElement((elem) => {
+        return highlightSyntax(elem, siteSettings, session);
+      });

      if (siteSettings.enable_experimental_lightbox) {
        api.decorateCookedElement(
@ -42,62 +37,50 @@ export default {
              : null;
          },
          {
-            id: "experimental-discourse-lightbox",
            onlyStream: true,
          }
        );

        api.cleanupStream(lightboxService.cleanupLightboxes);
      } else {
-        api.decorateCookedElement(
-          (elem) => {
-            return lightbox(elem, siteSettings);
-          },
-          { id: "discourse-lightbox" }
-        );
+        api.decorateCookedElement((elem) => {
+          return lightbox(elem, siteSettings);
+        });
      }

-      api.decorateCookedElement(
-        (elem) => {
-          const grids = elem.querySelectorAll(".d-image-grid");
+      api.decorateCookedElement((elem) => {
+        const grids = elem.querySelectorAll(".d-image-grid");

-          if (!grids.length) {
-            return;
-          }
+        if (!grids.length) {
+          return;
+        }

-          grids.forEach((grid) => {
-            return new Columns(grid, {
-              columns: site.mobileView ? 2 : 3,
-            });
+        grids.forEach((grid) => {
+          return new Columns(grid, {
+            columns: site.mobileView ? 2 : 3,
          });
-        },
-        { id: "discourse-image-grid" }
-      );
+        });
+      });

      if (siteSettings.support_mixed_text_direction) {
-        api.decorateCookedElement(setTextDirections, {
-          id: "discourse-text-direction",
-        });
+        api.decorateCookedElement(setTextDirections, {});
      }

      nativeLazyLoading(api);

-      api.decorateCookedElement(
-        (elem) => {
-          elem.querySelectorAll("audio").forEach((player) => {
-            player.addEventListener("play", () => {
-              const postId = parseInt(
-                elem.closest("article")?.dataset.postId,
-                10
-              );
-              if (postId) {
-                api.preventCloak(postId);
-              }
-            });
+      api.decorateCookedElement((elem) => {
+        elem.querySelectorAll("audio").forEach((player) => {
+          player.addEventListener("play", () => {
+            const postId = parseInt(
+              elem.closest("article")?.dataset.postId,
+              10
+            );
+            if (postId) {
+              api.preventCloak(postId);
+            }
          });
-        },
-        { id: "discourse-audio" }
-      );
+        });
+      });

      const caps = owner.lookup("service:capabilities");
      if (caps.isSafari || caps.isIOS) {
@ -119,7 +102,7 @@ export default {
              }
            });
          },
-          { id: "safari-video-poster", afterAdopt: true, onlyStream: true }
+          { afterAdopt: true, onlyStream: true }
        );
      }

@ -136,45 +119,39 @@ export default {
        wikipedia: "fab-wikipedia-w",
      };

-      api.decorateCookedElement(
-        (elem) => {
-          elem.querySelectorAll(".onebox").forEach((onebox) => {
-            Object.entries(oneboxTypes).forEach(([key, value]) => {
-              if (onebox.classList.contains(key)) {
-                onebox
-                  .querySelector(".source")
-                  .insertAdjacentHTML("afterbegin", iconHTML(value));
-              }
+      api.decorateCookedElement((elem) => {
+        elem.querySelectorAll(".onebox").forEach((onebox) => {
+          Object.entries(oneboxTypes).forEach(([key, value]) => {
+            if (onebox.classList.contains(key)) {
+              onebox
+                .querySelector(".source")
+                .insertAdjacentHTML("afterbegin", iconHTML(value));
+            }
+          });
+        });
+      });
+
+      api.decorateCookedElement((element) => {
+        element
+          .querySelectorAll(".video-container")
+          .forEach((videoContainer) => {
+            const video = videoContainer.getElementsByTagName("video")[0];
+            video.addEventListener("loadeddata", () => {
+              discourseLater(() => {
+                if (video.videoWidth === 0 || video.videoHeight === 0) {
+                  const notice = document.createElement("div");
+                  notice.className = "notice";
+                  notice.innerHTML =
+                    iconHTML("exclamation-triangle") +
+                    " " +
+                    I18n.t("cannot_render_video");
+
+                  videoContainer.appendChild(notice);
+                }
+              }, 500);
            });
          });
-        },
-        { id: "onebox-source-icons" }
-      );
-
-      api.decorateCookedElement(
-        (element) => {
-          element
-            .querySelectorAll(".video-container")
-            .forEach((videoContainer) => {
-              const video = videoContainer.getElementsByTagName("video")[0];
-              video.addEventListener("loadeddata", () => {
-                discourseLater(() => {
-                  if (video.videoWidth === 0 || video.videoHeight === 0) {
-                    const notice = document.createElement("div");
-                    notice.className = "notice";
-                    notice.innerHTML =
-                      iconHTML("exclamation-triangle") +
-                      " " +
-                      I18n.t("cannot_render_video");
-
-                    videoContainer.appendChild(notice);
-                  }
-                }, 500);
-              });
-            });
-        },
-        { id: "discourse-video-codecs" }
-      );
+      });

      function _createButton() {
        const openPopupBtn = document.createElement("button");
@ -234,7 +211,6 @@ export default {
        },
        {
          onlyStream: true,
-          id: "fullscreen-table",
        }
      );
    });
--- a/app/assets/javascripts/discourse/app/lib/lazy-load-images.js
+++ b/app/assets/javascripts/discourse/app/lib/lazy-load-images.js
@ -5,12 +5,8 @@ function isLoaded(img) {
 }

 export function nativeLazyLoading(api) {
-  api.decorateCookedElement(
-    (post) =>
-      post.querySelectorAll("img").forEach((img) => (img.loading = "lazy")),
-    {
-      id: "discourse-lazy-load",
-    }
+  api.decorateCookedElement((post) =>
+    post.querySelectorAll("img").forEach((img) => (img.loading = "lazy"))
  );

  api.decorateCookedElement(
@ -47,7 +43,6 @@ export function nativeLazyLoading(api) {
      });
    },
    {
-      id: "discourse-lazy-load-after-adopt",
      afterAdopt: true,
    }
  );
--- a/app/assets/javascripts/discourse/app/widgets/decorator-helper.js
+++ b/app/assets/javascripts/discourse/app/widgets/decorator-helper.js
@ -131,7 +131,7 @@ class DecoratorHelper {
   *     cooked.querySelector(".some-container"),
   *     hbs`I will be appended to some-container`
   *   );
-   * }, { onlyStream: true, id: "my-id" });
+   * }, { onlyStream: true });
   * ```
   *
   */
--- a/app/assets/javascripts/discourse/tests/acceptance/topic-post-decorate-cooked-test.js
+++ b/app/assets/javascripts/discourse/tests/acceptance/topic-post-decorate-cooked-test.js
@ -47,7 +47,7 @@ acceptance("Acceptance | decorateCookedElement", function () {
            hbs` with more content from glimmer`
          );
        },
-        { id: "render-glimmer-test", onlyStream: true }
+        { onlyStream: true }
      );
    });

--- a/plugins/chat/assets/javascripts/discourse/initializers/chat-setup.js
+++ b/plugins/chat/assets/javascripts/discourse/initializers/chat-setup.js
@ -120,34 +120,31 @@ export default {

      // we want to decorate the chat quote dates regardless
      // of whether the current user has chat enabled
-      api.decorateCookedElement(
-        (elem) => {
-          const currentUser = getOwner(this).lookup("service:current-user");
-          const currentUserTimezone = currentUser?.user_option?.timezone;
-          const chatTranscriptElements =
-            elem.querySelectorAll(".chat-transcript");
+      api.decorateCookedElement((elem) => {
+        const currentUser = getOwner(this).lookup("service:current-user");
+        const currentUserTimezone = currentUser?.user_option?.timezone;
+        const chatTranscriptElements =
+          elem.querySelectorAll(".chat-transcript");

-          chatTranscriptElements.forEach((el) => {
-            const dateTimeRaw = el.dataset["datetime"];
-            const dateTimeEl = el.querySelector(
-              ".chat-transcript-datetime a, .chat-transcript-datetime span"
+        chatTranscriptElements.forEach((el) => {
+          const dateTimeRaw = el.dataset["datetime"];
+          const dateTimeEl = el.querySelector(
+            ".chat-transcript-datetime a, .chat-transcript-datetime span"
+          );
+
+          if (currentUserTimezone) {
+            dateTimeEl.innerText = moment
+              .tz(dateTimeRaw, currentUserTimezone)
+              .format(I18n.t("dates.long_no_year"));
+          } else {
+            dateTimeEl.innerText = moment(dateTimeRaw).format(
+              I18n.t("dates.long_no_year")
            );
+          }

-            if (currentUserTimezone) {
-              dateTimeEl.innerText = moment
-                .tz(dateTimeRaw, currentUserTimezone)
-                .format(I18n.t("dates.long_no_year"));
-            } else {
-              dateTimeEl.innerText = moment(dateTimeRaw).format(
-                I18n.t("dates.long_no_year")
-              );
-            }
-
-            dateTimeEl.dataset.dateFormatted = true;
-          });
-        },
-        { id: "chat-transcript-datetime" }
-      );
+          dateTimeEl.dataset.dateFormatted = true;
+        });
+      });

      if (!this.chatService.userCanChat) {
        return;
--- a/plugins/checklist/assets/javascripts/discourse/initializers/checklist.js
+++ b/plugins/checklist/assets/javascripts/discourse/initializers/checklist.js
@ -7,7 +7,7 @@ function initializePlugin(api) {
  const siteSettings = api.container.lookup("site-settings:main");

  if (siteSettings.checklist_enabled) {
-    api.decorateCookedElement(checklistSyntax, { id: "checklist" });
+    api.decorateCookedElement(checklistSyntax);
  }
 }

--- a/plugins/discourse-lazy-videos/assets/javascripts/initializers/lazy-videos.js
+++ b/plugins/discourse-lazy-videos/assets/javascripts/initializers/lazy-videos.js
@ -33,7 +33,7 @@ function initLazyEmbed(api) {
        }
      });
    },
-    { onlyStream: true, id: "discourse-lazy-videos" }
+    { onlyStream: true }
  );
 }

--- a/plugins/discourse-local-dates/assets/javascripts/initializers/discourse-local-dates.js
+++ b/plugins/discourse-local-dates/assets/javascripts/initializers/discourse-local-dates.js
@ -149,19 +149,16 @@ function initializeDiscourseLocalDates(api) {
    site_name: siteSettings.title,
  });

-  api.decorateCookedElement(
-    (elem, helper) => {
-      const dates = elem.querySelectorAll(".discourse-local-date");
+  api.decorateCookedElement((elem, helper) => {
+    const dates = elem.querySelectorAll(".discourse-local-date");

-      applyLocalDates(dates, siteSettings);
+    applyLocalDates(dates, siteSettings);

-      const topicTitle = helper?.getModel()?.topic?.title;
-      dates.forEach((date) => {
-        date.dataset.title = date.dataset.title || topicTitle || defaultTitle;
-      });
-    },
-    { id: "discourse-local-date" }
-  );
+    const topicTitle = helper?.getModel()?.topic?.title;
+    dates.forEach((date) => {
+      date.dataset.title = date.dataset.title || topicTitle || defaultTitle;
+    });
+  });

  api.onToolbarCreate((toolbar) => {
    toolbar.addButton({
--- a/plugins/poll/assets/javascripts/discourse/initializers/extend-for-poll.js
+++ b/plugins/poll/assets/javascripts/discourse/initializers/extend-for-poll.js
@ -131,7 +131,6 @@ function initializePolls(api) {
  api.includePostAttributes("polls", "polls_votes");
  api.decorateCookedElement(attachPolls, {
    onlyStream: true,
-    id: "discourse-poll",
  });
  api.cleanupStream(cleanUpPolls);