unit tests for text area input component

src/Components/Input/TextAreaInput.spec.tsx

@@ -0,0 +1,55 @@
+import { render, screen, fireEvent } from '@testing-library/react'
+import { describe, it, expect, beforeEach, vi } from 'vitest'
+
+import { TagsProvider } from '#components/Map/hooks/useTags'
+
+import { TextAreaInput } from './TextAreaInput'
+
+// import { useTags } from '#components/Map/hooks/useTags'
+
+// vi.mock('#components/Map/hooks/useTags')
+
+describe('<TextAreaInput />', () => {
+  let wrapper: ReturnType<typeof render>
+
+  const updateFormValue = vi.fn()
+
+  beforeEach(() => {
+    vi.clearAllMocks()
+    wrapper = render(
+      <TagsProvider
+        initialTags={[
+          {
+            color: '#b3242f',
+            date_created: '2024-11-09T07:57:04',
+            id: '03b41b63-4530-4754-95cf-0abf8f9db476',
+            map: '3af4863a-7435-4487-aad9-146563ee8e02',
+            name: 'Feuer',
+            offer_or_need: null,
+            user_created: null,
+          },
+        ]}
+      >
+        <TextAreaInput updateFormValue={updateFormValue} />
+      </TagsProvider>,
+    )
+  })
+
+  it('renders properly', () => {
+    expect(wrapper.container.firstChild).toMatchSnapshot()
+  })
+
+  describe('handleChange', () => {
+    it('calls updateFormValue with new value', () => {
+      fireEvent.change(screen.getByRole('textbox'), { target: { value: 'test' } })
+      expect(updateFormValue).toBeCalledWith('test')
+    })
+  })
+
+  describe('labelTitle', () => {
+    it('sets label', () => {
+      wrapper.rerender(<TextAreaInput labelTitle='My Title' />)
+      expect(wrapper.container.firstChild).toMatchSnapshot()
+    })
+  })
+})

src/Components/Input/__snapshots__/TextAreaInput.spec.tsx.snap

@@ -0,0 +1,34 @@
+// Vitest Snapshot v1, https://vitest.dev/guide/snapshot.html
+
+exports[`<TextAreaInput /> > labelTitle > sets label 1`] = `
+<div
+  class="tw-form-control tw-w-full "
+>
+  <label
+    class="tw-label"
+  >
+    <span
+      class="tw-label-text tw-text-base-content "
+    >
+      My Title
+    </span>
+  </label>
+  <textarea
+    class="tw-textarea tw-textarea-bordered tw-w-full tw-leading-5 "
+    placeholder=""
+    required=""
+  />
+</div>
+`;
+
+exports[`<TextAreaInput /> > renders properly 1`] = `
+<div
+  class="tw-form-control tw-w-full "
+>
+  <textarea
+    class="tw-textarea tw-textarea-bordered tw-w-full tw-leading-5 "
+    placeholder=""
+    required=""
+  />
+</div>
+`;

vite.config.ts

@@ -12,12 +12,12 @@ export default defineConfig({
     coverage: {
       all: true,
       include: ['src/**/*.{js,jsx,ts,tsx}'],
-      exclude: [...configDefaults.exclude],
+      exclude: [...configDefaults.exclude, 'src/**/*.cy.tsx'],
       thresholds: {
-        lines: 0,
-        functions: 61,
+        lines: 1,
+        functions: 59,
         branches: 62,
-        statements: 0,
+        statements: 1,
       },
     },
   },