diff --git a/packages/react/src/FieldSet/FieldSet.test.tsx b/packages/react/src/FieldSet/FieldSet.test.tsx
index 07c2b18a7f..a58e8ba6e5 100644
--- a/packages/react/src/FieldSet/FieldSet.test.tsx
+++ b/packages/react/src/FieldSet/FieldSet.test.tsx
@@ -79,7 +79,7 @@ describe('FieldSet', () => {
     expect(legend).toHaveTextContent('Legend (not required)')
   })
 
-  it('renders the provided hint text after the legend when `optional` is set to `false`', () => {
+  it('renders the provided hint text after the legend while `optional` is set to `false`', () => {
     const { container } = render(<FieldSet legend="Legend" optional={false} hint="required" />)
 
     const legend = container.querySelector('legend')
diff --git a/packages/react/src/Hint/Hint.test.tsx b/packages/react/src/Hint/Hint.test.tsx
index e8472de131..74ea281ead 100644
--- a/packages/react/src/Hint/Hint.test.tsx
+++ b/packages/react/src/Hint/Hint.test.tsx
@@ -5,7 +5,7 @@ import '@testing-library/jest-dom'
 
 describe('Hint', () => {
   it('renders', () => {
-    const { container } = render(<Hint />)
+    const { container } = render(<Hint hint="hint" />)
 
     const component = container.querySelector(':only-child')
 
@@ -14,7 +14,7 @@ describe('Hint', () => {
   })
 
   it('renders a design system BEM class name', () => {
-    const { container } = render(<Hint />)
+    const { container } = render(<Hint optional />)
 
     const component = container.querySelector(':only-child')
 
@@ -22,7 +22,7 @@ describe('Hint', () => {
   })
 
   it('renders an additional class name', () => {
-    const { container } = render(<Hint className="extra" />)
+    const { container } = render(<Hint optional className="extra" />)
 
     const component = container.querySelector(':only-child')
 
@@ -42,32 +42,32 @@ describe('Hint', () => {
   it('renders the provided hint text', () => {
     const { container } = render(<Hint hint="hint text" />)
 
-    const hint = container.querySelector('span.ams-hint')
+    const component = container.querySelector(':only-child')
 
-    expect(hint).toHaveTextContent('(hint text)')
+    expect(component).toHaveTextContent('(hint text)')
   })
 
   it('renders the default hint text', () => {
     const { container } = render(<Hint optional={true} />)
 
-    const label = container.querySelector('label:only-child')
+    const component = container.querySelector(':only-child')
 
-    expect(label).toHaveTextContent('Label (niet verplicht)')
+    expect(component).toHaveTextContent('(niet verplicht)')
   })
 
   it('renders the provided hint text when `optional` is set to `false`', () => {
     const { container } = render(<Hint optional={true} hint="not required" />)
 
-    const label = container.querySelector('label:only-child')
+    const component = container.querySelector(':only-child')
 
-    expect(label).toHaveTextContent('Label (not required)')
+    expect(component).toHaveTextContent('(not required)')
   })
 
-  it('renders the provided hint text "required" marked as not optional', () => {
+  it('renders the provided hint text "required" while also being marked as not optional', () => {
     const { container } = render(<Hint optional={false} hint="required" />)
 
-    const label = container.querySelector('label:only-child')
+    const component = container.querySelector(':only-child')
 
-    expect(label).toHaveTextContent('Label (required)')
+    expect(component).toHaveTextContent('(required)')
   })
 })
diff --git a/packages/react/src/Hint/Hint.tsx b/packages/react/src/Hint/Hint.tsx
index a9d00112bf..ac49e2f823 100644
--- a/packages/react/src/Hint/Hint.tsx
+++ b/packages/react/src/Hint/Hint.tsx
@@ -16,9 +16,9 @@ export type HintProps = PropsWithChildren<HTMLAttributes<HTMLElement>> & {
 
 const getHintText = ({ hint, optional }: HintProps) => {
   if (hint) {
-    return <Hint hint={hint} />
+    return hint
   } else if (optional) {
-    return <Hint hint="niet verplicht" />
+    return 'niet verplicht'
   }
 
   return null
diff --git a/packages/react/src/Label/Label.test.tsx b/packages/react/src/Label/Label.test.tsx
index d95e58be54..1b6b9eff37 100644
--- a/packages/react/src/Label/Label.test.tsx
+++ b/packages/react/src/Label/Label.test.tsx
@@ -123,7 +123,7 @@ describe('Label', () => {
     expect(label).toHaveTextContent('Label (not required)')
   })
 
-  it('renders the provided hint text "required" after the label marked as not optional', () => {
+  it('renders the provided hint text after the label while `optional` is set to `false`', () => {
     const { container } = render(
       <Label htmlFor="form-control" optional={false} hint="required">
         Label