Skip to content

Commit

Permalink
tests: create unit test for UI input components
Browse files Browse the repository at this point in the history
rayane-barbosa committed Jun 14, 2024
1 parent fe84d9b commit 8d21645
Showing 3 changed files with 81 additions and 0 deletions.
20 changes: 20 additions & 0 deletions src/components/ui/components/input/input-masked.test.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,20 @@
import '@testing-library/jest-dom'
import { render, screen } from '@testing-library/react'
import React from 'react'
import { MaskedInput } from './input-masked'

describe('MaskedInput', () => {
it('renders without errors', () => {
render(<MaskedInput />)
expect(screen.getByRole('textbox')).toBeInTheDocument()
})
it('renders with custom class name', () => {
render(<MaskedInput className="custom-input" />)
expect(screen.getByRole('textbox')).toHaveClass('custom-input')
})
it('forwards ref to the input element', () => {
const ref = React.createRef<HTMLInputElement>()
render(<MaskedInput ref={ref} />)
expect(ref.current).toBeInstanceOf(HTMLInputElement)
})
})
30 changes: 30 additions & 0 deletions src/components/ui/components/input/input.test.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,30 @@
import '@testing-library/jest-dom'
import { fireEvent, render, screen } from '@testing-library/react'
import React from 'react'
import { Input } from './input'

describe('Input', () => {
test('renders without errors', () => {
render(<Input />)
expect(screen.getByRole('textbox')).toBeInTheDocument()
})

test('renders with custom class name', () => {
render(<Input className="custom-input" />)
expect(screen.getByRole('textbox')).toHaveClass('custom-input')
})

test('forwards ref to the input element', () => {
const ref = React.createRef<HTMLInputElement>()
render(<Input ref={ref} />)
expect(ref.current).toBeInstanceOf(HTMLInputElement)
})

test('triggers onChange event', () => {
const handleChange = jest.fn()
render(<Input onChange={handleChange} />)
fireEvent.change(screen.getByRole('textbox'), { target: { value: 'test' } })
expect(handleChange).toHaveBeenCalledTimes(1)
expect(handleChange).toHaveBeenCalledWith(expect.any(Object))
})
})
31 changes: 31 additions & 0 deletions src/components/ui/components/input/textearea.test.tsx
Original file line number Diff line number Diff line change
@@ -0,0 +1,31 @@
import '@testing-library/jest-dom'
import { render, screen } from '@testing-library/react'
import { Textarea } from './textarea'

describe('Textarea', () => {
test('renders without errors', () => {
render(<Textarea />)
const textareaElement = screen.getByRole('textbox')
expect(textareaElement).toBeInTheDocument()
})

test('renders with initial value', () => {
const initialValue = 'Hello World'
render(<Textarea value={initialValue} />)
const textareaElement = screen.getByRole('textbox') as HTMLTextAreaElement
expect(textareaElement.value).toBe(initialValue)
})
test('renders with placeholder', () => {
const placeholder = 'Enter your text'
render(<Textarea placeholder={placeholder} />)
const textareaElement = screen.getByRole('textbox') as HTMLTextAreaElement
expect(textareaElement.placeholder).toBe(placeholder)
})

test('renders with custom class', () => {
const customClass = 'custom-textarea'
render(<Textarea className={customClass} />)
const textareaElement = screen.getByRole('textbox')
expect(textareaElement).toHaveClass(customClass)
})
})

0 comments on commit 8d21645

Please sign in to comment.