fix: Self-referring aria-labelledby (#91)

Co-authored-by: Francesco Longo <[email protected]>

src/internal/analytics-metadata/__tests__/labels-utils.test.tsx

@@ -82,6 +82,15 @@ describe('getLabelFromElement', () => {
     const target = container.querySelector('#target');
     expect(getLabelFromElement(target as HTMLElement)).toEqual('second content');
   });
+  test('returns text content aria-labelledby refers to the element itself', () => {
+    const { container } = render(
+      <div id="target" aria-labelledby="target">
+        content
+      </div>
+    );
+    const target = container.querySelector('#target');
+    expect(getLabelFromElement(target as HTMLElement)).toEqual('content');
+  });
   test('returns empty string if aria-labelledby element does not exist', () => {
     const { container } = render(
       <div>

src/internal/analytics-metadata/labels-utils.ts

@@ -61,7 +61,9 @@ export const getLabelFromElement = (element: HTMLElement | null): string => {
   const ariaLabelledBy = element.getAttribute('aria-labelledby');
   if (ariaLabelledBy) {
     const elementWithLabel = document.querySelector(`[id="${ariaLabelledBy.split(' ')[0]}"]`);
-    return getLabelFromElement(elementWithLabel as HTMLElement);
+    if (elementWithLabel !== element) {
+      return getLabelFromElement(elementWithLabel as HTMLElement);
+    }
   }
 
   return element.textContent ? element.textContent.trim() : '';