fix: avoid "list" role elements in Listbox

Author: Robbert

.changeset/twenty-bees-train.md

@@ -0,0 +1,5 @@
+---
+"@utrecht/listbox-react": patch
+---
+
+Fix Listbox to only render "listbox" and "option" roles, and no "list" role from the `<ul>`.

packages/components-react/listbox-react/src/index.test.tsx

@@ -30,6 +30,20 @@ describe('Listbox', () => {
     expect(listbox).toBeInTheDocument();
   });
 
+  it('renders no list role element', () => {
+    render(<Listbox />);
+
+    let list;
+
+    try {
+      list = screen.getByRole('list');
+    } catch (e) {
+      expect(e).toBeDefined();
+    }
+
+    expect(list).not.toBeDefined();
+  });
+
   it('renders a design system BEM block class name', () => {
     const { container } = render(<Listbox />);
 

packages/components-react/listbox-react/src/index.tsx

@@ -50,7 +50,9 @@ export const Listbox = forwardRef(
       {...restProps}
       ref={ref}
     >
-      <ul className="utrecht-listbox__list">{children}</ul>
+      <ul className="utrecht-listbox__list" role="none">
+        {children}
+      </ul>
     </div>
   ),
 );