Address code review feedback - improve naming and fix race conditions

Co-authored-by: mattcosta7 <8616962+mattcosta7@users.noreply.github.com>

Author: Copilot

src/lazy-define.ts

@@ -25,14 +25,14 @@ const firstInteraction = new Promise<void>(resolve => {
 })
 
 const visible = async (tagName: string): Promise<void> => {
-  const makeViewportMonitor = (itemsToMonitor: Element[]) => {
-    return new Promise<void>(signalComplete => {
-      const viewMonitor = new IntersectionObserver(
-        viewEvents => {
-          for (const viewEvent of viewEvents) {
-            if (viewEvent.isIntersecting) {
-              signalComplete()
-              viewMonitor.disconnect()
+  const observeIntersection = (elements: Element[]) => {
+    return new Promise<void>(resolve => {
+      const observer = new IntersectionObserver(
+        entries => {
+          for (const entry of entries) {
+            if (entry.isIntersecting) {
+              resolve()
+              observer.disconnect()
               return
             }
           }
@@ -46,45 +46,44 @@ const visible = async (tagName: string): Promise<void> => {
           threshold: 0.01
         }
       )
-      for (const monitoredItem of itemsToMonitor) {
-        viewMonitor.observe(monitoredItem)
+      for (const element of elements) {
+        observer.observe(element)
       }
     })
   }
 
-  const makeElementHunter = () => {
-    return new Promise<Element[]>(deliverCapturedElements => {
-      const domHunter = new MutationObserver(capturedChanges => {
-        for (const capturedChange of capturedChanges) {
-          const capturedNodes = Array.from(capturedChange.addedNodes)
-          for (const capturedNode of capturedNodes) {
-            if (!(capturedNode instanceof Element)) continue
-
-            const directHit = capturedNode.matches(tagName) ? capturedNode : null
-            const nestedHit = capturedNode.querySelector(tagName)
-            const successfulHit = directHit || nestedHit
-
-            if (successfulHit) {
-              domHunter.disconnect()
-              deliverCapturedElements(Array.from(document.querySelectorAll(tagName)))
+  const waitForElement = () => {
+    return new Promise<Element[]>(resolve => {
+      const observer = new MutationObserver(mutations => {
+        for (const mutation of mutations) {
+          const addedNodes = Array.from(mutation.addedNodes)
+          for (const node of addedNodes) {
+            if (!(node instanceof Element)) continue
+
+            const isMatch = node.matches(tagName)
+            const descendant = node.querySelector(tagName)
+
+            if (isMatch || descendant) {
+              observer.disconnect()
+              resolve(Array.from(document.querySelectorAll(tagName)))
               return
             }
           }
         }
       })
 
-      domHunter.observe(document.documentElement, {childList: true, subtree: true})
+      observer.observe(document.documentElement, {childList: true, subtree: true})
     })
   }
 
-  const immediateFinds = Array.from(document.querySelectorAll(tagName))
+  const existingElements = Array.from(document.querySelectorAll(tagName))
 
-  if (immediateFinds.length > 0) {
-    return makeViewportMonitor(immediateFinds)
+  if (existingElements.length > 0) {
+    return observeIntersection(existingElements)
   }
 
-  const delayedFinds = await makeElementHunter()
-  return makeViewportMonitor(delayedFinds)
+  const foundElements = await waitForElement()
+  return observeIntersection(foundElements)
 }
 
 const strategies: Record<string, Strategy> = {

test/lazy-define.ts

@@ -119,13 +119,13 @@ describe('lazyDefine', () => {
     it('waits for element to be added to DOM before observing', async () => {
       const onDefine = spy()
       lazyDefine('late-visible-element', onDefine)
-      
+
       await animationFrame()
       expect(onDefine).to.be.callCount(0)
 
       // Add the element later
       await fixture(html`<late-visible-element data-load-on="visible"></late-visible-element>`)
-      
+
       await animationFrame()
       expect(onDefine).to.be.callCount(1)
     })
@@ -137,8 +137,8 @@ describe('lazyDefine', () => {
       lazyDefine('race-test-element', onDefine)
 
       // Create multiple elements to trigger multiple scans
-      const el1 = await fixture(html`<race-test-element></race-test-element>`)
-      const el2 = await fixture(html`<race-test-element></race-test-element>`)
+      await fixture(html`<race-test-element></race-test-element>`)
+      await fixture(html`<race-test-element></race-test-element>`)
 
       await animationFrame()
       await animationFrame()
@@ -162,7 +162,7 @@ describe('lazyDefine', () => {
       // Register second callback after element is already triggered
       lazyDefine('late-reg-element', onDefine2)
       await animationFrame()
-      
+
       // Second callback should be executed immediately
       expect(onDefine2).to.be.callCount(1)
     })
@@ -190,7 +190,7 @@ describe('lazyDefine', () => {
         // Both callbacks should be called despite first one throwing
         expect(onDefine1).to.be.callCount(1)
         expect(onDefine2).to.be.callCount(1)
-        
+
         // Error should have been reported
         expect(errors.length).to.be.greaterThan(0)
       } finally {