56 lines
2.2 KiB
TypeScript
56 lines
2.2 KiB
TypeScript
|
|
/**
|
||
|
|
* InlineTextEditor Tests
|
||
|
|
*/
|
||
|
|
import { describe, it, expect, vi } from 'vitest';
|
||
|
|
import { render, screen, fireEvent } from '@testing-library/react';
|
||
|
|
import InlineTextEditor from '../src/components/InlineTextEditor';
|
||
|
|
|
||
|
|
describe('InlineTextEditor', () => {
|
||
|
|
it('should render with initial text', () => {
|
||
|
|
render(<InlineTextEditor initialText="Hello" onSubmit={() => {}} onCancel={() => {}} />);
|
||
|
|
const input = screen.getByDisplayValue('Hello');
|
||
|
|
expect(input).toBeDefined();
|
||
|
|
});
|
||
|
|
|
||
|
|
it('should call onSubmit with text when Enter is pressed', () => {
|
||
|
|
const onSubmit = vi.fn();
|
||
|
|
render(<InlineTextEditor initialText="Test" onSubmit={onSubmit} onCancel={() => {}} />);
|
||
|
|
const input = screen.getByDisplayValue('Test');
|
||
|
|
fireEvent.keyDown(input, { key: 'Enter' });
|
||
|
|
expect(onSubmit).toHaveBeenCalledWith('Test');
|
||
|
|
});
|
||
|
|
|
||
|
|
it('should call onCancel when Escape is pressed', () => {
|
||
|
|
const onCancel = vi.fn();
|
||
|
|
render(<InlineTextEditor initialText="Test" onSubmit={() => {}} onCancel={onCancel} />);
|
||
|
|
const input = screen.getByDisplayValue('Test');
|
||
|
|
fireEvent.keyDown(input, { key: 'Escape' });
|
||
|
|
expect(onCancel).toHaveBeenCalled();
|
||
|
|
});
|
||
|
|
|
||
|
|
it('should update text when typing', () => {
|
||
|
|
const onSubmit = vi.fn();
|
||
|
|
render(<InlineTextEditor initialText="" onSubmit={onSubmit} onCancel={() => {}} />);
|
||
|
|
const input = screen.getByRole('textbox') as HTMLInputElement;
|
||
|
|
fireEvent.change(input, { target: { value: 'New Text' } });
|
||
|
|
fireEvent.keyDown(input, { key: 'Enter' });
|
||
|
|
expect(onSubmit).toHaveBeenCalledWith('New Text');
|
||
|
|
});
|
||
|
|
|
||
|
|
it('should call onSubmit when confirm button is clicked', () => {
|
||
|
|
const onSubmit = vi.fn();
|
||
|
|
render(<InlineTextEditor initialText="Initial" onSubmit={onSubmit} onCancel={() => {}} />);
|
||
|
|
const confirmBtn = screen.getByText('Bestätigen (Enter)');
|
||
|
|
fireEvent.click(confirmBtn);
|
||
|
|
expect(onSubmit).toHaveBeenCalledWith('Initial');
|
||
|
|
});
|
||
|
|
|
||
|
|
it('should call onCancel when cancel button is clicked', () => {
|
||
|
|
const onCancel = vi.fn();
|
||
|
|
render(<InlineTextEditor initialText="" onSubmit={() => {}} onCancel={onCancel} />);
|
||
|
|
const cancelBtn = screen.getByText('Abbrechen (Esc)');
|
||
|
|
fireEvent.click(cancelBtn);
|
||
|
|
expect(onCancel).toHaveBeenCalled();
|
||
|
|
});
|
||
|
|
});
|