@pie-lib/drag 4.0.3-next.36 → 4.0.3-next.38

package/src/__tests__/drag-provider.test.jsx

@@ -1,313 +0,0 @@
-import React from 'react';
-import { render, screen } from '@testing-library/react';
-import { DragProvider } from '../drag-provider';
-
-jest.mock('@dnd-kit/core', () => ({
-  DndContext: ({ children, onDragStart, onDragEnd, sensors, collisionDetection, modifiers, autoScroll }) => (
-    <div
-      data-testid="dnd-context"
-      data-has-sensors={!!sensors}
-      data-has-collision-detection={!!collisionDetection}
-      data-has-modifiers={!!modifiers}
-      data-has-auto-scroll={!!autoScroll}
-      data-on-drag-start={typeof onDragStart === 'function' ? 'function' : 'undefined'}
-      data-on-drag-end={typeof onDragEnd === 'function' ? 'function' : 'undefined'}
-    >
-      {children}
-    </div>
-  ),
-  PointerSensor: 'PointerSensor',
-  KeyboardSensor: 'KeyboardSensor',
-  useSensor: jest.fn((sensor, config) => ({ sensor, config })),
-  useSensors: jest.fn((...sensors) => sensors),
-}));
-
-describe('DragProvider', () => {
-  const defaultProps = {
-    children: <div data-testid="test-child">Test Content</div>,
-  };
-
-  beforeEach(() => {
-    jest.clearAllMocks();
-  });
-
-  describe('rendering', () => {
-    it('should render children correctly', () => {
-      render(<DragProvider {...defaultProps} />);
-      expect(screen.getByTestId('test-child')).toBeInTheDocument();
-      expect(screen.getByText('Test Content')).toBeInTheDocument();
-    });
-
-    it('should render multiple children', () => {
-      render(
-        <DragProvider>
-          <div data-testid="child-1">Child 1</div>
-          <div data-testid="child-2">Child 2</div>
-        </DragProvider>,
-      );
-      expect(screen.getByTestId('child-1')).toBeInTheDocument();
-      expect(screen.getByTestId('child-2')).toBeInTheDocument();
-    });
-
-    it('should wrap children in DndContext', () => {
-      render(<DragProvider {...defaultProps} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toBeInTheDocument();
-      expect(dndContext).toContainElement(screen.getByTestId('test-child'));
-    });
-
-    it('should render with complex children', () => {
-      render(
-        <DragProvider>
-          <div>
-            <span data-testid="nested">Nested</span>
-            <ul>
-              <li data-testid="list-item">Item</li>
-            </ul>
-          </div>
-        </DragProvider>,
-      );
-      expect(screen.getByTestId('nested')).toBeInTheDocument();
-      expect(screen.getByTestId('list-item')).toBeInTheDocument();
-    });
-  });
-
-  describe('DndContext props', () => {
-    it('should pass sensors to DndContext', () => {
-      render(<DragProvider {...defaultProps} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-has-sensors', 'true');
-    });
-
-    it('should pass onDragStart handler to DndContext', () => {
-      const onDragStart = jest.fn();
-      render(<DragProvider {...defaultProps} onDragStart={onDragStart} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-on-drag-start', 'function');
-    });
-
-    it('should pass onDragEnd handler to DndContext', () => {
-      const onDragEnd = jest.fn();
-      render(<DragProvider {...defaultProps} onDragEnd={onDragEnd} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-on-drag-end', 'function');
-    });
-
-    it('should pass collisionDetection to DndContext', () => {
-      const collisionDetection = jest.fn();
-      render(<DragProvider {...defaultProps} collisionDetection={collisionDetection} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-has-collision-detection', 'true');
-    });
-
-    it('should pass modifiers to DndContext', () => {
-      const modifiers = [jest.fn()];
-      render(<DragProvider {...defaultProps} modifiers={modifiers} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-has-modifiers', 'true');
-    });
-
-    it('should pass autoScroll to DndContext', () => {
-      const autoScroll = { enabled: true };
-      render(<DragProvider {...defaultProps} autoScroll={autoScroll} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-has-auto-scroll', 'true');
-    });
-
-    it('should pass all props to DndContext', () => {
-      const onDragStart = jest.fn();
-      const onDragEnd = jest.fn();
-      const collisionDetection = jest.fn();
-      const modifiers = [jest.fn()];
-      const autoScroll = { enabled: true };
-
-      render(
-        <DragProvider
-          {...defaultProps}
-          onDragStart={onDragStart}
-          onDragEnd={onDragEnd}
-          collisionDetection={collisionDetection}
-          modifiers={modifiers}
-          autoScroll={autoScroll}
-        />,
-      );
-
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-on-drag-start', 'function');
-      expect(dndContext).toHaveAttribute('data-on-drag-end', 'function');
-      expect(dndContext).toHaveAttribute('data-has-collision-detection', 'true');
-      expect(dndContext).toHaveAttribute('data-has-modifiers', 'true');
-      expect(dndContext).toHaveAttribute('data-has-auto-scroll', 'true');
-    });
-  });
-
-  describe('optional props', () => {
-    it('should work without onDragStart', () => {
-      expect(() => {
-        render(<DragProvider {...defaultProps} />);
-      }).not.toThrow();
-    });
-
-    it('should work without onDragEnd', () => {
-      expect(() => {
-        render(<DragProvider {...defaultProps} />);
-      }).not.toThrow();
-    });
-
-    it('should work without collisionDetection', () => {
-      render(<DragProvider {...defaultProps} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-has-collision-detection', 'false');
-    });
-
-    it('should work without modifiers', () => {
-      render(<DragProvider {...defaultProps} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-has-modifiers', 'false');
-    });
-
-    it('should work without autoScroll', () => {
-      render(<DragProvider {...defaultProps} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-has-auto-scroll', 'false');
-    });
-  });
-
-  describe('sensors setup', () => {
-    it('should initialize PointerSensor with activation constraint', () => {
-      const { useSensor } = require('@dnd-kit/core');
-      render(<DragProvider {...defaultProps} />);
-
-      expect(useSensor).toHaveBeenCalledWith('PointerSensor', { activationConstraint: { distance: 8 } });
-    });
-
-    it('should initialize KeyboardSensor', () => {
-      const { useSensor } = require('@dnd-kit/core');
-      render(<DragProvider {...defaultProps} />);
-
-      expect(useSensor).toHaveBeenCalledWith('KeyboardSensor');
-    });
-
-    it('should combine sensors with useSensors', () => {
-      const { useSensors } = require('@dnd-kit/core');
-      render(<DragProvider {...defaultProps} />);
-
-      expect(useSensors).toHaveBeenCalled();
-    });
-  });
-
-  describe('re-rendering', () => {
-    it('should update children when they change', () => {
-      const { rerender } = render(<DragProvider {...defaultProps} />);
-      expect(screen.getByText('Test Content')).toBeInTheDocument();
-
-      rerender(
-        <DragProvider>
-          <div data-testid="new-child">New Content</div>
-        </DragProvider>,
-      );
-      expect(screen.getByText('New Content')).toBeInTheDocument();
-      expect(screen.queryByText('Test Content')).not.toBeInTheDocument();
-    });
-
-    it('should update handlers when they change', () => {
-      const onDragStart1 = jest.fn();
-      const onDragStart2 = jest.fn();
-
-      const { rerender } = render(<DragProvider {...defaultProps} onDragStart={onDragStart1} />);
-
-      rerender(<DragProvider {...defaultProps} onDragStart={onDragStart2} />);
-
-      // Should still have the handler attribute
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-on-drag-start', 'function');
-    });
-  });
-
-  describe('edge cases', () => {
-    it('should handle fragment children', () => {
-      render(
-        <DragProvider>
-          <>
-            <div data-testid="fragment-child-1">First</div>
-            <div data-testid="fragment-child-2">Second</div>
-          </>
-        </DragProvider>,
-      );
-      expect(screen.getByTestId('fragment-child-1')).toBeInTheDocument();
-      expect(screen.getByTestId('fragment-child-2')).toBeInTheDocument();
-    });
-
-    it('should handle null children within array', () => {
-      render(
-        <DragProvider>
-          {[
-            <div key="1" data-testid="valid-child">
-              Valid
-            </div>,
-            null,
-            <div key="2" data-testid="another-valid">
-              Another
-            </div>,
-          ]}
-        </DragProvider>,
-      );
-      expect(screen.getByTestId('valid-child')).toBeInTheDocument();
-      expect(screen.getByTestId('another-valid')).toBeInTheDocument();
-    });
-
-    it('should handle empty modifiers array', () => {
-      render(<DragProvider {...defaultProps} modifiers={[]} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-has-modifiers', 'true');
-    });
-
-    it('should handle multiple modifier functions', () => {
-      const modifiers = [jest.fn(), jest.fn(), jest.fn()];
-      render(<DragProvider {...defaultProps} modifiers={modifiers} />);
-      const dndContext = screen.getByTestId('dnd-context');
-      expect(dndContext).toHaveAttribute('data-has-modifiers', 'true');
-    });
-  });
-
-  describe('prop types validation', () => {
-    // Suppress console errors for prop type validation tests
-    const originalError = console.error;
-    beforeAll(() => {
-      console.error = jest.fn();
-    });
-    afterAll(() => {
-      console.error = originalError;
-    });
-
-    it('should accept valid children prop', () => {
-      expect(() => {
-        render(<DragProvider {...defaultProps} />);
-      }).not.toThrow();
-    });
-
-    it('should accept function props for callbacks', () => {
-      expect(() => {
-        render(<DragProvider {...defaultProps} onDragStart={jest.fn()} onDragEnd={jest.fn()} />);
-      }).not.toThrow();
-    });
-
-    it('should accept function prop for collisionDetection', () => {
-      expect(() => {
-        render(<DragProvider {...defaultProps} collisionDetection={jest.fn()} />);
-      }).not.toThrow();
-    });
-
-    it('should accept array of functions for modifiers', () => {
-      expect(() => {
-        render(<DragProvider {...defaultProps} modifiers={[jest.fn(), jest.fn()]} />);
-      }).not.toThrow();
-    });
-
-    it('should accept object for autoScroll', () => {
-      expect(() => {
-        render(<DragProvider {...defaultProps} autoScroll={{ enabled: true }} />);
-      }).not.toThrow();
-    });
-  });
-});

package/src/__tests__/placeholder.test.jsx

@@ -1,107 +0,0 @@
-import { render, screen } from '@testing-library/react';
-import React from 'react';
-import { PlaceHolder } from '../placeholder';
-
-describe('placeholder', () => {
-  const renderComponent = (extras = {}) => {
-    const props = { ...extras };
-    return render(<PlaceHolder {...props}>Foo</PlaceHolder>);
-  };
-
-  describe('rendering', () => {
-    it('renders children content', () => {
-      renderComponent();
-      expect(screen.getByText('Foo')).toBeInTheDocument();
-    });
-
-    it('renders with regular placeholder class', () => {
-      const { container } = renderComponent();
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveClass('placeholder');
-    });
-
-    it('applies over class when isOver is true', () => {
-      const { container } = renderComponent({ isOver: true });
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveClass('over');
-    });
-
-    it('applies disabled class when disabled is true', () => {
-      const { container } = renderComponent({ disabled: true });
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveClass('disabled');
-    });
-
-    it('applies custom className', () => {
-      const { container } = renderComponent({ className: 'bar' });
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveClass('bar');
-      expect(placeholder).toHaveClass('placeholder');
-    });
-
-    it('applies choice type class', () => {
-      const { container } = renderComponent({ type: 'choice' });
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveClass('choice');
-    });
-
-    it('applies board class when choiceBoard is true', () => {
-      const { container } = renderComponent({ choiceBoard: true });
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveClass('board');
-    });
-
-    it('applies categorizeBoard class when choiceBoard and isCategorize are true', () => {
-      const { container } = renderComponent({ choiceBoard: true, isCategorize: true });
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveClass('categorizeBoard');
-    });
-
-    it('applies verticalPool class when isVerticalPool is true', () => {
-      const { container } = renderComponent({ isVerticalPool: true });
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveClass('verticalPool');
-    });
-  });
-
-  describe('grid styles', () => {
-    it('applies grid column styles', () => {
-      const { container } = renderComponent({
-        grid: { columns: 3 },
-      });
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveStyle({ gridTemplateColumns: 'repeat(3, 1fr)' });
-    });
-
-    it('applies grid row styles with default value', () => {
-      const { container } = renderComponent({
-        grid: { rows: 2 },
-      });
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveStyle({ gridTemplateRows: 'repeat(2, 1fr)' });
-    });
-
-    it('applies grid row styles with custom rowsRepeatValue', () => {
-      const { container } = renderComponent({
-        grid: {
-          rows: 2,
-          columns: 1,
-          rowsRepeatValue: 'min-content',
-        },
-      });
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveStyle({
-        gridTemplateRows: 'repeat(2, min-content)',
-        gridTemplateColumns: 'repeat(1, 1fr)',
-      });
-    });
-  });
-
-  describe('min height', () => {
-    it('applies minHeight style when provided', () => {
-      const { container } = renderComponent({ minHeight: 200 });
-      const placeholder = container.firstChild;
-      expect(placeholder).toHaveStyle({ minHeight: '200px' });
-    });
-  });
-});