From 88d991fa95126e961b9b47efefab567579468bdb Mon Sep 17 00:00:00 2001
From: Alex Iglesias <alexiglesias@finsweet.com>
Date: Thu, 11 Dec 2025 12:45:04 +0100
Subject: [PATCH] fix: re-check for scripts after DOM loaded to find
 unprocessed entities

---
 .changeset/four-turtles-kneel.md      |  5 ++++
 packages/attributes/src/attributes.ts | 43 +++++++++++++++------------
 2 files changed, 29 insertions(+), 19 deletions(-)
 create mode 100644 .changeset/four-turtles-kneel.md

diff --git a/.changeset/four-turtles-kneel.md b/.changeset/four-turtles-kneel.md
new file mode 100644
index 000000000..6752a45eb
--- /dev/null
+++ b/.changeset/four-turtles-kneel.md
@@ -0,0 +1,5 @@
+---
+'@finsweet/attributes': patch
+---
+
+fix: re-check for scripts after DOM loaded to find unprocessed entities
diff --git a/packages/attributes/src/attributes.ts b/packages/attributes/src/attributes.ts
index 035d277cf..da745fa71 100644
--- a/packages/attributes/src/attributes.ts
+++ b/packages/attributes/src/attributes.ts
@@ -66,13 +66,14 @@ const init = () => {
  * Inits all Attributes that are defined in the current script
  * or in the DOM if fs-attributes-auto is enabled.
  */
-const initAttributes = () => {
+const initAttributes = async () => {
   let autoLoad = false;
 
-  const scripts = document.querySelectorAll<HTMLScriptElement>(`script[type="module"][src="${import.meta.url}"]`);
+  const getScripts = () =>
+    document.querySelectorAll<HTMLScriptElement>(`script[type="module"][src="${import.meta.url}"]`);
 
-  for (const script of scripts) {
-    if (window.FinsweetAttributes.scripts.includes(script)) continue;
+  const initScript = (script: HTMLScriptElement) => {
+    if (window.FinsweetAttributes.scripts.includes(script)) return;
 
     window.FinsweetAttributes.scripts.push(script);
 
@@ -84,29 +85,33 @@ const initAttributes = () => {
 
       initAttribute(key);
     }
-  }
+  };
+
+  getScripts().forEach(initScript);
+
+  await waitDOMReady();
+
+  getScripts().forEach(initScript);
 
   if (!autoLoad) return;
 
-  waitDOMReady().then(() => {
-    const usedAttributes = new Set<FinsweetAttributeKey>();
-    const allElements = document.querySelectorAll('*');
+  const usedAttributes = new Set<FinsweetAttributeKey>();
+  const allElements = document.querySelectorAll('*');
 
-    for (const element of allElements) {
-      for (const name of element.getAttributeNames()) {
-        const fsMatch = name.match(/^fs-([^-]+)/);
-        const key = fsMatch?.[1] as FinsweetAttributeKey | undefined;
+  for (const element of allElements) {
+    for (const name of element.getAttributeNames()) {
+      const fsMatch = name.match(/^fs-([^-]+)/);
+      const key = fsMatch?.[1] as FinsweetAttributeKey | undefined;
 
-        if (key && ATTRIBUTE_KEYS.has(key)) {
-          usedAttributes.add(key);
-        }
+      if (key && ATTRIBUTE_KEYS.has(key)) {
+        usedAttributes.add(key);
       }
     }
+  }
 
-    for (const attribute of usedAttributes) {
-      initAttribute(attribute);
-    }
-  });
+  for (const attribute of usedAttributes) {
+    initAttribute(attribute);
+  }
 };
 
 /**