import { render, screen } from '@testing-library/react'
import type { ComponentType, PropsWithChildren } from 'react'
import { describe, expect, it, vi } from 'vitest'
import { TolariaSideMenu } from './tolariaBlockNoteSideMenu'
let capturedDragHandleMenu: ComponentType | null = null
vi.mock('@blocknote/react', () => ({
AddBlockButton: () => ,
DragHandleMenu: ({ children }: PropsWithChildren) => (
{children}
),
DragHandleButton: ({ dragHandleMenu }: { dragHandleMenu?: ComponentType }) => {
capturedDragHandleMenu = dragHandleMenu ?? null
return (
)
},
RemoveBlockItem: ({ children }: PropsWithChildren) => {children}
,
SideMenu: ({ children }: PropsWithChildren) => {children}
,
TableColumnHeaderItem: ({ children }: PropsWithChildren) => {children}
,
TableRowHeaderItem: ({ children }: PropsWithChildren) => {children}
,
useDictionary: () => ({
drag_handle: {
delete_menuitem: 'Delete',
header_row_menuitem: 'Header row',
header_column_menuitem: 'Header column',
colors_menuitem: 'Colors',
},
}),
}))
describe('TolariaSideMenu', () => {
it('replaces BlockNote block colors with markdown-safe drag-handle items', () => {
render()
expect(screen.getByTestId('side-menu')).toBeInTheDocument()
expect(capturedDragHandleMenu).not.toBeNull()
expect(screen.getAllByRole('button').map((button) => button.textContent)).toEqual([
'Open block menu',
'Add block',
])
const DragHandleMenuComponent = capturedDragHandleMenu!
render()
expect(screen.getByText('Delete')).toBeInTheDocument()
expect(screen.getByText('Header row')).toBeInTheDocument()
expect(screen.getByText('Header column')).toBeInTheDocument()
expect(screen.queryByText('Colors')).not.toBeInTheDocument()
})
})