From 70f20f84dcb0eb41dcea1619639c995b84205300 Mon Sep 17 00:00:00 2001
From: alimpens <a.limpens@amsterdam.nl>
Date: Wed, 11 Dec 2024 11:54:51 +0100
Subject: [PATCH] Add HeaderNarrowScreenOnlyGridCell tests

---
 .../HeaderNarrowScreenOnlyGridCell.test.tsx   | 49 +++++++++++++++++++
 1 file changed, 49 insertions(+)
 create mode 100644 packages/react/src/Header/HeaderNarrowScreenOnlyGridCell.test.tsx

diff --git a/packages/react/src/Header/HeaderNarrowScreenOnlyGridCell.test.tsx b/packages/react/src/Header/HeaderNarrowScreenOnlyGridCell.test.tsx
new file mode 100644
index 0000000000..ed4331feb2
--- /dev/null
+++ b/packages/react/src/Header/HeaderNarrowScreenOnlyGridCell.test.tsx
@@ -0,0 +1,49 @@
+import { render } from '@testing-library/react'
+import { createRef } from 'react'
+import { HeaderNarrowScreenOnlyGridCell } from './HeaderNarrowScreenOnlyGridCell'
+import '@testing-library/jest-dom'
+
+describe('HeaderNarrowScreenOnlyGridCell', () => {
+  it('renders', () => {
+    const { container } = render(<HeaderNarrowScreenOnlyGridCell />)
+
+    const component = container.querySelector(':only-child')
+
+    expect(component).toBeInTheDocument()
+    expect(component).toBeVisible()
+  })
+
+  it('renders a Grid.Cell', () => {
+    const { container } = render(<HeaderNarrowScreenOnlyGridCell />)
+
+    const component = container.querySelector(':only-child')
+
+    expect(component).toHaveClass('ams-grid__cell')
+  })
+
+  it('renders a design system BEM class name', () => {
+    const { container } = render(<HeaderNarrowScreenOnlyGridCell />)
+
+    const component = container.querySelector(':only-child')
+
+    expect(component).toHaveClass('ams-header__narrow-screen-only-grid-cell')
+  })
+
+  it('renders an additional class name', () => {
+    const { container } = render(<HeaderNarrowScreenOnlyGridCell className="extra" />)
+
+    const component = container.querySelector(':only-child')
+
+    expect(component).toHaveClass('ams-header__narrow-screen-only-grid-cell extra')
+  })
+
+  it('supports ForwardRef in React', () => {
+    const ref = createRef<HTMLDivElement>()
+
+    const { container } = render(<HeaderNarrowScreenOnlyGridCell ref={ref} />)
+
+    const component = container.querySelector(':only-child')
+
+    expect(ref.current).toBe(component)
+  })
+})