From 9c4c4be386909b265bb5e6e82271d4b6b09876f3 Mon Sep 17 00:00:00 2001
From: Joakim Bjerknes <joakbjerk@gmail.com>
Date: Tue, 16 Jan 2024 14:01:35 +0100
Subject: [PATCH] prevent accordion from opening on label click

---
 .../src/components/table/TableAccordion.tsx   |  1 +
 .../table/__tests__/TableAccordion.test.tsx   | 28 ++++++++++++++++++-
 2 files changed, 28 insertions(+), 1 deletion(-)

diff --git a/packages/dnb-eufemia/src/components/table/TableAccordion.tsx b/packages/dnb-eufemia/src/components/table/TableAccordion.tsx
index 9985e3a3d84..122a5a8b4c3 100644
--- a/packages/dnb-eufemia/src/components/table/TableAccordion.tsx
+++ b/packages/dnb-eufemia/src/components/table/TableAccordion.tsx
@@ -171,6 +171,7 @@ export function useTableAccordion({
        * https://developer.mozilla.org/en-US/docs/Web/API/Document/activeElement
        */
       target.tagName !== 'INPUT' &&
+      target.tagName !== 'LABEL' &&
       /**
        * Let the user select text,
        * without triggering the accordion.
diff --git a/packages/dnb-eufemia/src/components/table/__tests__/TableAccordion.test.tsx b/packages/dnb-eufemia/src/components/table/__tests__/TableAccordion.test.tsx
index 5f992223bba..47c4f130850 100644
--- a/packages/dnb-eufemia/src/components/table/__tests__/TableAccordion.test.tsx
+++ b/packages/dnb-eufemia/src/components/table/__tests__/TableAccordion.test.tsx
@@ -311,7 +311,10 @@ describe('TableAccordion', () => {
         <tbody>
           <Tr>
             <Td>
-              <input type="text" />
+              <label>
+                Label
+                <input type="text" />
+              </label>
               <button>button</button>
             </Td>
             <Td.AccordionContent>accordion content</Td.AccordionContent>
@@ -321,6 +324,7 @@ describe('TableAccordion', () => {
     )
 
     const trElement = document.querySelector('tr')
+    const labelElement = document.querySelector('label')
     const inputElem = trElement.querySelector('input')
     const buttonElem = trElement.querySelector('button')
 
@@ -350,6 +354,12 @@ describe('TableAccordion', () => {
       'dnb-table__tr--expanded'
     )
 
+    fireEvent.click(labelElement)
+
+    expect(Array.from(trElement.classList)).not.toContain(
+      'dnb-table__tr--expanded'
+    )
+
     fireEvent.click(buttonElem)
 
     expect(Array.from(trElement.classList)).toContain(
@@ -390,6 +400,22 @@ describe('TableAccordion', () => {
       'dnb-table__tr--expanded'
     )
 
+    jest
+      .spyOn(document, 'activeElement', 'get')
+      .mockReturnValue(labelElement)
+
+    fireEvent.keyDown(labelElement, { keyCode: 13 }) // enter
+
+    expect(Array.from(trElement.classList)).not.toContain(
+      'dnb-table__tr--expanded'
+    )
+
+    fireEvent.keyDown(labelElement, { keyCode: 32 }) // space
+
+    expect(Array.from(trElement.classList)).not.toContain(
+      'dnb-table__tr--expanded'
+    )
+
     jest.spyOn(document, 'activeElement', 'get').mockReturnValue(null)
   })