forked from cardosofelipe/fast-next-template
test(agents): add tests for AgentTypeForm enhancements
Added unit tests to cover new AgentTypeForm features: - Category & Display fields (category select, sort order, icon, color) - Typical Tasks management (add, remove, and prevent duplicates) - Collaboration Hints management (add, remove, lowercase, and prevent duplicates) This ensures thorough validation of recent form updates.
This commit is contained in:
@@ -575,4 +575,213 @@ describe('AgentTypeForm', () => {
|
||||
expect(screen.getByText('Edit Agent Type')).toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
describe('Category & Display Fields', () => {
|
||||
it('renders category and display section', () => {
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
expect(screen.getByText('Category & Display')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('shows category select', () => {
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
expect(screen.getByLabelText(/category/i)).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('shows sort order input', () => {
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
expect(screen.getByLabelText(/sort order/i)).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('shows icon input', () => {
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
expect(screen.getByLabelText(/icon/i)).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('shows color input', () => {
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
expect(screen.getByLabelText(/color/i)).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('pre-fills category fields in edit mode', () => {
|
||||
render(<AgentTypeForm {...defaultProps} agentType={mockAgentType} />);
|
||||
|
||||
const iconInput = screen.getByLabelText(/icon/i) as HTMLInputElement;
|
||||
expect(iconInput.value).toBe('git-branch');
|
||||
|
||||
const sortOrderInput = screen.getByLabelText(/sort order/i) as HTMLInputElement;
|
||||
expect(sortOrderInput.value).toBe('40');
|
||||
});
|
||||
});
|
||||
|
||||
describe('Typical Tasks Management', () => {
|
||||
it('shows typical tasks section', () => {
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
expect(screen.getByText('Typical Tasks')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('adds typical task when add button is clicked', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
|
||||
const taskInput = screen.getByPlaceholderText(/e.g., design system architecture/i);
|
||||
await user.type(taskInput, 'Write documentation');
|
||||
// Click the second "Add" button (for typical tasks)
|
||||
const addButtons = screen.getAllByRole('button', { name: /^add$/i });
|
||||
await user.click(addButtons[1]);
|
||||
|
||||
expect(screen.getByText('Write documentation')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('adds typical task on enter key', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
|
||||
const taskInput = screen.getByPlaceholderText(/e.g., design system architecture/i);
|
||||
await user.type(taskInput, 'Write documentation{Enter}');
|
||||
|
||||
expect(screen.getByText('Write documentation')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('removes typical task when X button is clicked', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} agentType={mockAgentType} />);
|
||||
|
||||
// Should have existing typical task
|
||||
expect(screen.getByText('Design system architecture')).toBeInTheDocument();
|
||||
|
||||
// Click remove button
|
||||
const removeButton = screen.getByRole('button', {
|
||||
name: /remove design system architecture/i,
|
||||
});
|
||||
await user.click(removeButton);
|
||||
|
||||
expect(screen.queryByText('Design system architecture')).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('does not add duplicate typical tasks', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} agentType={mockAgentType} />);
|
||||
|
||||
// Agent type already has 'Design system architecture'
|
||||
const taskInput = screen.getByPlaceholderText(/e.g., design system architecture/i);
|
||||
await user.type(taskInput, 'Design system architecture');
|
||||
const addButtons = screen.getAllByRole('button', { name: /^add$/i });
|
||||
await user.click(addButtons[1]);
|
||||
|
||||
// Should still only have one badge
|
||||
const badges = screen.getAllByText('Design system architecture');
|
||||
expect(badges).toHaveLength(1);
|
||||
});
|
||||
|
||||
it('does not add empty typical task', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
|
||||
// Click the second "Add" button (for typical tasks) without typing
|
||||
const addButtons = screen.getAllByRole('button', { name: /^add$/i });
|
||||
await user.click(addButtons[1]);
|
||||
|
||||
// No badges should be added (check that there's no remove button for typical tasks)
|
||||
expect(
|
||||
screen.queryByRole('button', { name: /remove write documentation/i })
|
||||
).not.toBeInTheDocument();
|
||||
});
|
||||
});
|
||||
|
||||
describe('Collaboration Hints Management', () => {
|
||||
it('shows collaboration hints section', () => {
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
expect(screen.getByText('Collaboration Hints')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('adds collaboration hint when add button is clicked', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
|
||||
const hintInput = screen.getByPlaceholderText(/e.g., backend-engineer/i);
|
||||
await user.type(hintInput, 'devops-engineer');
|
||||
// Click the third "Add" button (for collaboration hints)
|
||||
const addButtons = screen.getAllByRole('button', { name: /^add$/i });
|
||||
await user.click(addButtons[2]);
|
||||
|
||||
expect(screen.getByText('devops-engineer')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('adds collaboration hint on enter key', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
|
||||
const hintInput = screen.getByPlaceholderText(/e.g., backend-engineer/i);
|
||||
await user.type(hintInput, 'devops-engineer{Enter}');
|
||||
|
||||
expect(screen.getByText('devops-engineer')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('removes collaboration hint when X button is clicked', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} agentType={mockAgentType} />);
|
||||
|
||||
// Should have existing collaboration hint
|
||||
expect(screen.getByText('backend-engineer')).toBeInTheDocument();
|
||||
|
||||
// Click remove button
|
||||
const removeButton = screen.getByRole('button', { name: /remove backend-engineer/i });
|
||||
await user.click(removeButton);
|
||||
|
||||
expect(screen.queryByText('backend-engineer')).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('converts collaboration hints to lowercase', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
|
||||
const hintInput = screen.getByPlaceholderText(/e.g., backend-engineer/i);
|
||||
await user.type(hintInput, 'DevOps-Engineer');
|
||||
const addButtons = screen.getAllByRole('button', { name: /^add$/i });
|
||||
await user.click(addButtons[2]);
|
||||
|
||||
expect(screen.getByText('devops-engineer')).toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('does not add duplicate collaboration hints', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} agentType={mockAgentType} />);
|
||||
|
||||
// Agent type already has 'backend-engineer'
|
||||
const hintInput = screen.getByPlaceholderText(/e.g., backend-engineer/i);
|
||||
await user.type(hintInput, 'backend-engineer');
|
||||
const addButtons = screen.getAllByRole('button', { name: /^add$/i });
|
||||
await user.click(addButtons[2]);
|
||||
|
||||
// Should still only have one badge
|
||||
const badges = screen.getAllByText('backend-engineer');
|
||||
expect(badges).toHaveLength(1);
|
||||
});
|
||||
|
||||
it('does not add empty collaboration hint', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
|
||||
// Click the third "Add" button (for collaboration hints) without typing
|
||||
const addButtons = screen.getAllByRole('button', { name: /^add$/i });
|
||||
await user.click(addButtons[2]);
|
||||
|
||||
// No badges should be added
|
||||
expect(
|
||||
screen.queryByRole('button', { name: /remove devops-engineer/i })
|
||||
).not.toBeInTheDocument();
|
||||
});
|
||||
|
||||
it('clears input after adding collaboration hint', async () => {
|
||||
const user = userEvent.setup();
|
||||
render(<AgentTypeForm {...defaultProps} />);
|
||||
|
||||
const hintInput = screen.getByPlaceholderText(/e.g., backend-engineer/i) as HTMLInputElement;
|
||||
await user.type(hintInput, 'devops-engineer');
|
||||
const addButtons = screen.getAllByRole('button', { name: /^add$/i });
|
||||
await user.click(addButtons[2]);
|
||||
|
||||
expect(hintInput.value).toBe('');
|
||||
});
|
||||
});
|
||||
});
|
||||
|
||||
Reference in New Issue
Block a user