chore: Add missing Unordered and Ordered List tests (#1117)

Co-authored-by: Vincent Smedinga <[email protected]>

packages/react/src/OrderedList/OrderedList.test.tsx

@@ -19,6 +19,22 @@ describe('Ordered list', () => {
     expect(component).toHaveClass('amsterdam-ordered-list')
   })
 
+  it('renders a no markers class', () => {
+    render(<OrderedList markers={false} />)
+
+    const component = screen.getByRole('list')
+
+    expect(component).toHaveClass('amsterdam-ordered-list--no-markers')
+  })
+
+  it('renders an inverse color class', () => {
+    render(<OrderedList inverseColor />)
+
+    const component = screen.getByRole('list')
+
+    expect(component).toHaveClass('amsterdam-ordered-list--inverse-color')
+  })
+
   it('renders an additional class name', () => {
     render(<OrderedList className="extra" />)
 
@@ -27,6 +43,24 @@ describe('Ordered list', () => {
     expect(component).toHaveClass('amsterdam-ordered-list extra')
   })
 
+  it('renders its subcomponent', () => {
+    const listItems = ['Item 1', 'Item 2', 'Item 3']
+
+    const { container } = render(
+      <OrderedList>
+        {listItems.map((item, index) => (
+          <OrderedList.Item key={index}>{item}</OrderedList.Item>
+        ))}
+      </OrderedList>,
+    )
+
+    const list = screen.getByRole('list')
+    const items = container.querySelectorAll('.amsterdam-ordered-list__item')
+
+    expect(list).toBeInTheDocument()
+    expect(items.length).toBe(3)
+  })
+
   it('supports ForwardRef in React', () => {
     const ref = createRef<HTMLOListElement>()
 

packages/react/src/UnorderedList/UnorderedList.test.tsx

@@ -19,6 +19,22 @@ describe('Unordered list', () => {
     expect(component).toHaveClass('amsterdam-unordered-list')
   })
 
+  it('renders a no markers class', () => {
+    render(<UnorderedList markers={false} />)
+
+    const component = screen.getByRole('list')
+
+    expect(component).toHaveClass('amsterdam-unordered-list--no-markers')
+  })
+
+  it('renders an inverse color class', () => {
+    render(<UnorderedList inverseColor />)
+
+    const component = screen.getByRole('list')
+
+    expect(component).toHaveClass('amsterdam-unordered-list--inverse-color')
+  })
+
   it('renders an additional class name', () => {
     render(<UnorderedList className="extra" />)
 
@@ -27,6 +43,24 @@ describe('Unordered list', () => {
     expect(component).toHaveClass('amsterdam-unordered-list extra')
   })
 
+  it('renders its subcomponent', () => {
+    const listItems = ['Item 1', 'Item 2', 'Item 3']
+
+    const { container } = render(
+      <UnorderedList>
+        {listItems.map((item, index) => (
+          <UnorderedList.Item key={index}>{item}</UnorderedList.Item>
+        ))}
+      </UnorderedList>,
+    )
+
+    const list = screen.getByRole('list')
+    const items = container.querySelectorAll('.amsterdam-unordered-list__item')
+
+    expect(list).toBeInTheDocument()
+    expect(items.length).toBe(3)
+  })
+
   it('supports ForwardRef in React', () => {
     const ref = createRef<HTMLUListElement>()