mirror of
https://github.com/utopia-os/utopia-ui.git
synced 2025-12-12 23:36:00 +00:00
feat(source): test text area input (#155)
* unit tests for text area input component
This commit is contained in:
parent
1de44c3e1c
commit
c1eafc9a0f
33
src/Components/Input/TextAreaInput.spec.tsx
Normal file
33
src/Components/Input/TextAreaInput.spec.tsx
Normal file
@ -0,0 +1,33 @@
|
||||
import { render, screen, fireEvent } from '@testing-library/react'
|
||||
import { describe, it, expect, beforeEach, vi } from 'vitest'
|
||||
|
||||
import { TextAreaInput } from './TextAreaInput'
|
||||
|
||||
describe('<TextAreaInput />', () => {
|
||||
let wrapper: ReturnType<typeof render>
|
||||
|
||||
const updateFormValue = vi.fn()
|
||||
|
||||
beforeEach(() => {
|
||||
vi.clearAllMocks()
|
||||
wrapper = render(<TextAreaInput defaultValue={''} updateFormValue={updateFormValue} />)
|
||||
})
|
||||
|
||||
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 defaultValue={''} labelTitle='My Title' />)
|
||||
expect(wrapper.container.firstChild).toMatchSnapshot()
|
||||
})
|
||||
})
|
||||
})
|
||||
@ -1,7 +1,5 @@
|
||||
import { useEffect, useRef, useState } from 'react'
|
||||
|
||||
import { useTags } from '#components/Map/hooks/useTags'
|
||||
|
||||
interface TextAreaProps {
|
||||
labelTitle?: string
|
||||
labelStyle?: string
|
||||
@ -14,8 +12,6 @@ interface TextAreaProps {
|
||||
updateFormValue?: (value: string) => void
|
||||
}
|
||||
|
||||
type KeyValue = Record<string, string>
|
||||
|
||||
/**
|
||||
* @category Input
|
||||
*/
|
||||
@ -33,14 +29,6 @@ export function TextAreaInput({
|
||||
const ref = useRef<HTMLTextAreaElement>(null)
|
||||
const [inputValue, setInputValue] = useState<string>(defaultValue)
|
||||
|
||||
const tags = useTags()
|
||||
|
||||
const values: KeyValue[] = []
|
||||
|
||||
tags.forEach((tag) => {
|
||||
values.push({ key: tag.name, value: tag.name, color: tag.color })
|
||||
})
|
||||
|
||||
useEffect(() => {
|
||||
setInputValue(defaultValue)
|
||||
}, [defaultValue])
|
||||
|
||||
@ -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>
|
||||
`;
|
||||
@ -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,
|
||||
},
|
||||
},
|
||||
},
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user