@jmruthers/pace-core 0.6.6 → 0.6.8

package/src/components/DataTable/components/__tests__/ExpandButton.test.tsx

@@ -1,462 +0,0 @@
-/**
- * @file ExpandButton Component Tests
- * @package @jmruthers/pace-core
- * @module Components/DataTable/Components/__tests__
- * @since 0.4.35
- * 
- * Comprehensive test suite for ExpandButton component following testing guidelines.
- * Tests cover all major functionality, edge cases, and user interactions.
- */
-
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import userEvent from '@testing-library/user-event';
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
-import { ExpandButton, ExpandButtonMinimal } from '../ExpandButton';
-
-// Mock lucide-react icons
-vi.mock('lucide-react', () => ({
-  ChevronRightIcon: ({ className }: { className?: string }) => (
-    <div data-testid="chevron-right-icon" className={className}>ChevronRight</div>
-  ),
-  ChevronDownIcon: ({ className }: { className?: string }) => (
-    <div data-testid="chevron-down-icon" className={className}>ChevronDown</div>
-  ),
-}));
-
-describe('[component] ExpandButton', () => {
-  const baseProps = {
-    rowId: 'row-1',
-    isExpanded: false,
-    hasChildren: true,
-    onClick: vi.fn(),
-  };
-
-  beforeEach(() => {
-    vi.clearAllMocks();
-  });
-
-  afterEach(() => {
-    vi.clearAllMocks();
-  });
-
-  describe('Rendering', () => {
-    it('returns null when hasChildren is false', () => {
-      const { container } = render(
-        <ExpandButton
-          {...baseProps}
-          hasChildren={false}
-        />
-      );
-
-      expect(container.firstChild).toBeNull();
-    });
-
-    it('renders button when hasChildren is true', () => {
-      render(<ExpandButton {...baseProps} />);
-
-      expect(screen.getByRole('button')).toBeInTheDocument();
-    });
-
-    it('renders ChevronRight icon when not expanded', () => {
-      render(<ExpandButton {...baseProps} isExpanded={false} />);
-
-      expect(screen.getByTestId('chevron-right-icon')).toBeInTheDocument();
-      expect(screen.queryByTestId('chevron-down-icon')).not.toBeInTheDocument();
-    });
-
-    it('renders ChevronDown icon when expanded', () => {
-      render(<ExpandButton {...baseProps} isExpanded={true} />);
-
-      expect(screen.getByTestId('chevron-down-icon')).toBeInTheDocument();
-      expect(screen.queryByTestId('chevron-right-icon')).not.toBeInTheDocument();
-    });
-
-    it('has correct testId attribute', () => {
-      render(<ExpandButton {...baseProps} rowId="test-row-123" />);
-
-      const button = screen.getByRole('button');
-      expect(button).toHaveAttribute('data-testid', 'expand-button-test-row-123');
-    });
-  });
-
-  describe('User Interactions', () => {
-    it('calls onClick when button is clicked', async () => {
-      const user = userEvent.setup();
-      const handleClick = vi.fn();
-
-      render(
-        <ExpandButton
-          {...baseProps}
-          onClick={handleClick}
-        />
-      );
-
-      const button = screen.getByRole('button');
-      await user.click(button);
-
-      expect(handleClick).toHaveBeenCalledTimes(1);
-    });
-
-    it('calls onClick when Enter key is pressed', async () => {
-      const user = userEvent.setup();
-      const handleClick = vi.fn();
-
-      render(
-        <ExpandButton
-          {...baseProps}
-          onClick={handleClick}
-        />
-      );
-
-      const button = screen.getByRole('button');
-      button.focus();
-      await user.keyboard('{Enter}');
-
-      expect(handleClick).toHaveBeenCalledTimes(1);
-    });
-
-    it('calls onClick when Space key is pressed', async () => {
-      const user = userEvent.setup();
-      const handleClick = vi.fn();
-
-      render(
-        <ExpandButton
-          {...baseProps}
-          onClick={handleClick}
-        />
-      );
-
-      const button = screen.getByRole('button');
-      button.focus();
-      await user.keyboard(' ');
-
-      expect(handleClick).toHaveBeenCalledTimes(1);
-    });
-
-    it('stops event propagation on click', async () => {
-      const user = userEvent.setup();
-      const handleClick = vi.fn();
-      const handleParentClick = vi.fn();
-
-      render(
-        <div onClick={handleParentClick}>
-          <ExpandButton
-            {...baseProps}
-            onClick={handleClick}
-          />
-        </div>
-      );
-
-      const button = screen.getByRole('button');
-      await user.click(button);
-
-      expect(handleClick).toHaveBeenCalledTimes(1);
-      expect(handleParentClick).not.toHaveBeenCalled();
-    });
-
-    it('stops event propagation on keyboard events', async () => {
-      const user = userEvent.setup();
-      const handleClick = vi.fn();
-      const handleParentKeyDown = vi.fn();
-
-      render(
-        <div onKeyDown={handleParentKeyDown}>
-          <ExpandButton
-            {...baseProps}
-            onClick={handleClick}
-          />
-        </div>
-      );
-
-      const button = screen.getByRole('button');
-      button.focus();
-      await user.keyboard('{Enter}');
-
-      expect(handleClick).toHaveBeenCalledTimes(1);
-      expect(handleParentKeyDown).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('Accessibility', () => {
-    it('has aria-label for collapsed state', () => {
-      render(<ExpandButton {...baseProps} isExpanded={false} />);
-
-      const button = screen.getByRole('button');
-      expect(button).toHaveAttribute('aria-label', 'Expand row');
-    });
-
-    it('has aria-label for expanded state', () => {
-      render(<ExpandButton {...baseProps} isExpanded={true} />);
-
-      const button = screen.getByRole('button');
-      expect(button).toHaveAttribute('aria-label', 'Collapse row');
-    });
-
-    it('has aria-expanded attribute', () => {
-      render(<ExpandButton {...baseProps} isExpanded={false} />);
-
-      const button = screen.getByRole('button');
-      expect(button).toHaveAttribute('aria-expanded', 'false');
-    });
-
-    it('updates aria-expanded when state changes', () => {
-      const { rerender } = render(<ExpandButton {...baseProps} isExpanded={false} />);
-
-      let button = screen.getByRole('button');
-      expect(button).toHaveAttribute('aria-expanded', 'false');
-
-      rerender(<ExpandButton {...baseProps} isExpanded={true} />);
-
-      button = screen.getByRole('button');
-      expect(button).toHaveAttribute('aria-expanded', 'true');
-    });
-  });
-
-  describe('Styling', () => {
-    it('applies custom className', () => {
-      render(
-        <ExpandButton
-          {...baseProps}
-          className="custom-class"
-        />
-      );
-
-      const button = screen.getByRole('button');
-      expect(button.className).toContain('custom-class');
-    });
-
-    it('has proper button styling classes', () => {
-      render(<ExpandButton {...baseProps} />);
-
-      const button = screen.getByRole('button');
-      expect(button.className).toContain('inline-flex');
-      expect(button.className).toContain('items-center');
-      expect(button.className).toContain('justify-center');
-    });
-  });
-
-  describe('Edge Cases', () => {
-    it('handles rapid clicks', async () => {
-      const user = userEvent.setup();
-      const handleClick = vi.fn();
-
-      render(
-        <ExpandButton
-          {...baseProps}
-          onClick={handleClick}
-        />
-      );
-
-      const button = screen.getByRole('button');
-      await user.click(button);
-      await user.click(button);
-      await user.click(button);
-
-      expect(handleClick).toHaveBeenCalledTimes(3);
-    });
-
-    it('handles undefined onClick gracefully', () => {
-      expect(() => {
-        render(
-          <ExpandButton
-            {...baseProps}
-            onClick={undefined as any}
-          />
-        );
-      }).not.toThrow();
-    });
-
-    it('handles empty rowId', () => {
-      render(
-        <ExpandButton
-          {...baseProps}
-          rowId=""
-        />
-      );
-
-      const button = screen.getByRole('button');
-      expect(button).toHaveAttribute('data-testid', 'expand-button-');
-    });
-  });
-});
-
-describe('[component] ExpandButtonMinimal', () => {
-  const baseProps = {
-    rowId: 'row-1',
-    isExpanded: false,
-    hasChildren: true,
-    onClick: vi.fn(),
-  };
-
-  beforeEach(() => {
-    vi.clearAllMocks();
-  });
-
-  afterEach(() => {
-    vi.clearAllMocks();
-  });
-
-  describe('Rendering', () => {
-    it('returns null when hasChildren is false', () => {
-      const { container } = render(
-        <ExpandButtonMinimal
-          {...baseProps}
-          hasChildren={false}
-        />
-      );
-
-      expect(container.firstChild).toBeNull();
-    });
-
-    it('renders button when hasChildren is true', () => {
-      render(<ExpandButtonMinimal {...baseProps} />);
-
-      expect(screen.getByRole('button')).toBeInTheDocument();
-    });
-
-    it('renders minus sign when expanded', () => {
-      render(<ExpandButtonMinimal {...baseProps} isExpanded={true} />);
-
-      expect(screen.getByText('−')).toBeInTheDocument();
-      expect(screen.queryByText('+')).not.toBeInTheDocument();
-    });
-
-    it('renders plus sign when not expanded', () => {
-      render(<ExpandButtonMinimal {...baseProps} isExpanded={false} />);
-
-      expect(screen.getByText('+')).toBeInTheDocument();
-      expect(screen.queryByText('−')).not.toBeInTheDocument();
-    });
-
-    it('has correct testId attribute', () => {
-      render(<ExpandButtonMinimal {...baseProps} rowId="test-row-456" />);
-
-      const button = screen.getByRole('button');
-      expect(button).toHaveAttribute('data-testid', 'expand-button-minimal-test-row-456');
-    });
-  });
-
-  describe('User Interactions', () => {
-    it('calls onClick when button is clicked', async () => {
-      const user = userEvent.setup();
-      const handleClick = vi.fn();
-
-      render(
-        <ExpandButtonMinimal
-          {...baseProps}
-          onClick={handleClick}
-        />
-      );
-
-      const button = screen.getByRole('button');
-      await user.click(button);
-
-      expect(handleClick).toHaveBeenCalledTimes(1);
-    });
-
-    it('calls onClick when Enter key is pressed', async () => {
-      const user = userEvent.setup();
-      const handleClick = vi.fn();
-
-      render(
-        <ExpandButtonMinimal
-          {...baseProps}
-          onClick={handleClick}
-        />
-      );
-
-      const button = screen.getByRole('button');
-      button.focus();
-      await user.keyboard('{Enter}');
-
-      expect(handleClick).toHaveBeenCalledTimes(1);
-    });
-
-    it('calls onClick when Space key is pressed', async () => {
-      const user = userEvent.setup();
-      const handleClick = vi.fn();
-
-      render(
-        <ExpandButtonMinimal
-          {...baseProps}
-          onClick={handleClick}
-        />
-      );
-
-      const button = screen.getByRole('button');
-      button.focus();
-      await user.keyboard(' ');
-
-      expect(handleClick).toHaveBeenCalledTimes(1);
-    });
-
-    it('stops event propagation on click', async () => {
-      const user = userEvent.setup();
-      const handleClick = vi.fn();
-      const handleParentClick = vi.fn();
-
-      render(
-        <div onClick={handleParentClick}>
-          <ExpandButtonMinimal
-            {...baseProps}
-            onClick={handleClick}
-          />
-        </div>
-      );
-
-      const button = screen.getByRole('button');
-      await user.click(button);
-
-      expect(handleClick).toHaveBeenCalledTimes(1);
-      expect(handleParentClick).not.toHaveBeenCalled();
-    });
-  });
-
-  describe('Accessibility', () => {
-    it('has aria-label for collapsed state', () => {
-      render(<ExpandButtonMinimal {...baseProps} isExpanded={false} />);
-
-      const button = screen.getByRole('button');
-      expect(button).toHaveAttribute('aria-label', 'Expand row');
-    });
-
-    it('has aria-label for expanded state', () => {
-      render(<ExpandButtonMinimal {...baseProps} isExpanded={true} />);
-
-      const button = screen.getByRole('button');
-      expect(button).toHaveAttribute('aria-label', 'Collapse row');
-    });
-
-    it('has aria-expanded attribute', () => {
-      render(<ExpandButtonMinimal {...baseProps} isExpanded={false} />);
-
-      const button = screen.getByRole('button');
-      expect(button).toHaveAttribute('aria-expanded', 'false');
-    });
-  });
-
-  describe('Styling', () => {
-    it('applies custom className', () => {
-      render(
-        <ExpandButtonMinimal
-          {...baseProps}
-          className="custom-class"
-        />
-      );
-
-      const button = screen.getByRole('button');
-      expect(button.className).toContain('custom-class');
-    });
-
-    it('has proper button styling classes', () => {
-      render(<ExpandButtonMinimal {...baseProps} />);
-
-      const button = screen.getByRole('button');
-      expect(button.className).toContain('inline-flex');
-      expect(button.className).toContain('items-center');
-      expect(button.className).toContain('justify-center');
-    });
-  });
-});
-