55 lines
1.6 KiB
TypeScript
55 lines
1.6 KiB
TypeScript
import { render, screen } from '@testing-library/react';
|
|
import { describe, it, expect } from 'vitest';
|
|
import { Textarea } from './textarea';
|
|
|
|
describe('Textarea Component', () => {
|
|
it('renders textarea', () => {
|
|
render(<Textarea placeholder="Enter text" />);
|
|
|
|
const textarea = screen.getByPlaceholderText('Enter text');
|
|
expect(textarea).toBeInTheDocument();
|
|
expect(textarea).toHaveClass('bg-kodo-graphite');
|
|
});
|
|
|
|
it('renders with label', () => {
|
|
render(<Textarea label="Description" />);
|
|
|
|
const label = screen.getByText('Description');
|
|
expect(label).toBeInTheDocument();
|
|
|
|
const textarea = screen.getByLabelText('Description');
|
|
expect(textarea).toBeInTheDocument();
|
|
});
|
|
|
|
it('displays error message', () => {
|
|
render(<Textarea error="This field is required" />);
|
|
|
|
const error = screen.getByText('This field is required');
|
|
expect(error).toBeInTheDocument();
|
|
expect(error).toHaveClass('text-kodo-red');
|
|
|
|
const textarea = screen.getByRole('textbox');
|
|
expect(textarea).toHaveClass('border-kodo-red');
|
|
});
|
|
|
|
it('applies custom className', () => {
|
|
render(<Textarea className="custom-textarea" />);
|
|
|
|
const textarea = screen.getByRole('textbox');
|
|
expect(textarea).toHaveClass('custom-textarea');
|
|
});
|
|
|
|
it('handles disabled state', () => {
|
|
render(<Textarea disabled />);
|
|
|
|
const textarea = screen.getByRole('textbox');
|
|
expect(textarea).toBeDisabled();
|
|
});
|
|
|
|
it('handles value prop', () => {
|
|
render(<Textarea value="Test value" readOnly />);
|
|
|
|
const textarea = screen.getByRole('textbox');
|
|
expect(textarea).toHaveValue('Test value');
|
|
});
|
|
});
|