Added tests

src/MantineBetterMenu/MantineBetterMenu.test.tsx

@@ -0,0 +1,55 @@
+import { MantineProvider } from '@mantine/core'
+import { render, screen } from '@testing-library/react'
+import { describe, expect, it } from 'vitest'
+
+import { MantineBetterMenusProvider } from './MantineBetterMenu'
+
+// Mock the MenuRenderer component since it likely has complex portal logic
+vi.mock('./MenuRenderer', () => ({
+  MenuRenderer: () => <div data-testid="menu-renderer">Menu Renderer</div>
+}))
+
+const TestWrapper = ({ children }: { children: React.ReactNode }) => (
+  <MantineProvider>
+    {children}
+  </MantineProvider>
+)
+
+describe('MantineBetterMenusProvider', () => {
+  it('renders children correctly', () => {
+    render(
+      <TestWrapper>
+        <MantineBetterMenusProvider>
+          <div data-testid="test-child">Test Child</div>
+        </MantineBetterMenusProvider>
+      </TestWrapper>
+    )
+
+    expect(screen.getByTestId('test-child')).toBeInTheDocument()
+  })
+
+  it('renders MenuRenderer component', () => {
+    render(
+      <TestWrapper>
+        <MantineBetterMenusProvider>
+          <div>Test</div>
+        </MantineBetterMenusProvider>
+      </TestWrapper>
+    )
+
+    expect(screen.getByTestId('menu-renderer')).toBeInTheDocument()
+  })
+
+  it('accepts providerID prop', () => {
+    render(
+      <TestWrapper>
+        <MantineBetterMenusProvider providerID="test-provider">
+          <div>Test</div>
+        </MantineBetterMenusProvider>
+      </TestWrapper>
+    )
+
+    // Component should render without errors
+    expect(screen.getByTestId('menu-renderer')).toBeInTheDocument()
+  })
+})

src/MantineBetterMenu/Store.test.tsx

@@ -0,0 +1,100 @@
+import { act, renderHook } from '@testing-library/react'
+import { beforeEach, describe, expect, it } from 'vitest'
+
+import { MantineBetterMenusStoreProvider, useMantineBetterMenus } from './Store'
+
+// Mock dependencies
+vi.mock('@warkypublic/artemis-kit', () => ({
+  getUUID: () => 'test-uuid-123'
+}))
+
+const createWrapper = () => {
+  return ({ children }: { children: React.ReactNode }) => (
+    <MantineBetterMenusStoreProvider>
+      {children}
+    </MantineBetterMenusStoreProvider>
+  )
+}
+
+describe('MantineBetterMenus Store', () => {
+  let wrapper: ReturnType<typeof createWrapper>
+
+  beforeEach(() => {
+    wrapper = createWrapper()
+  })
+
+  it('initializes with empty menus array', () => {
+    const { result } = renderHook(() => useMantineBetterMenus(), { wrapper })
+
+    expect(result.current.menus).toEqual([])
+  })
+
+  it('can show a menu', () => {
+    const { result } = renderHook(() => useMantineBetterMenus(), { wrapper })
+
+    act(() => {
+      result.current.show('test-menu', {
+        items: [{ label: 'Test Item' }],
+        x: 100,
+        y: 200
+      })
+    })
+
+    expect(result.current.menus).toHaveLength(1)
+    expect(result.current.menus[0]).toMatchObject({
+      id: 'test-menu',
+      items: [{ label: 'Test Item' }],
+      visible: true,
+      x: 100,
+      y: 200
+    })
+  })
+
+  it('can hide a menu', () => {
+    const { result } = renderHook(() => useMantineBetterMenus(), { wrapper })
+
+    // First show a menu
+    act(() => {
+      result.current.show('test-menu', { x: 100, y: 200 })
+    })
+
+    expect(result.current.menus[0].visible).toBe(true)
+
+    // Then hide it
+    act(() => {
+      result.current.hide('test-menu')
+    })
+
+    expect(result.current.menus[0].visible).toBe(false)
+  })
+
+  it('can update instance state', () => {
+    const { result } = renderHook(() => useMantineBetterMenus(), { wrapper })
+
+    // Show a menu
+    act(() => {
+      result.current.show('test-menu', { x: 100, y: 200 })
+    })
+
+    // Update its position
+    act(() => {
+      result.current.setInstanceState('test-menu', 'x', 300)
+    })
+
+    expect(result.current.menus[0].x).toBe(300)
+    expect(result.current.menus[0].y).toBe(200) // Should remain unchanged
+  })
+
+  it('handles multiple menus', () => {
+    const { result } = renderHook(() => useMantineBetterMenus(), { wrapper })
+
+    act(() => {
+      result.current.show('menu-1', { x: 100, y: 200 })
+      result.current.show('menu-2', { x: 300, y: 400 })
+    })
+
+    expect(result.current.menus).toHaveLength(2)
+    expect(result.current.menus.find(m => m.id === 'menu-1')).toBeDefined()
+    expect(result.current.menus.find(m => m.id === 'menu-2')).toBeDefined()
+  })
+})