diff --git a/src/renderer/src/components/DraggableList/__tests__/DraggableList.test.tsx b/src/renderer/src/components/DraggableList/__tests__/DraggableList.test.tsx
index d6c1aa7b21..2d61583787 100644
--- a/src/renderer/src/components/DraggableList/__tests__/DraggableList.test.tsx
+++ b/src/renderer/src/components/DraggableList/__tests__/DraggableList.test.tsx
@@ -29,20 +29,6 @@ vi.mock('@hello-pangea/dnd', () => {
}
})
-// mock antd list 只做简单渲染
-vi.mock('antd', () => ({
- __esModule: true,
- List: ({ dataSource, renderItem }: any) => (
-
- {dataSource.map((item: any, idx: number) => (
-
- {renderItem(item, idx)}
-
- ))}
-
- )
-}))
-
declare global {
interface Window {
triggerOnDragEnd: (result?: any, provided?: any) => void
@@ -73,14 +59,15 @@ describe('DraggableList', () => {
const list = [{ id: 'a', name: 'A' }]
const style = { background: 'red' }
const listStyle = { color: 'blue' }
- render(
+ const { container } = render(
{}}>
{(item) => {item.name}
}
)
// 检查 style 是否传递到外层容器
- const virtualList = screen.getByTestId('virtual-list')
- expect(virtualList.parentElement).toHaveStyle({ background: 'red' })
+ const listContainer = container.querySelector('.draggable-list-container')
+ expect(listContainer).not.toBeNull()
+ expect(listContainer?.parentElement).toHaveStyle({ background: 'red' })
})
it('should render nothing when list is empty', () => {
diff --git a/src/renderer/src/components/DraggableList/__tests__/__snapshots__/DraggableList.test.tsx.snap b/src/renderer/src/components/DraggableList/__tests__/__snapshots__/DraggableList.test.tsx.snap
index f85a3e07bd..75f9e74875 100644
--- a/src/renderer/src/components/DraggableList/__tests__/__snapshots__/DraggableList.test.tsx.snap
+++ b/src/renderer/src/components/DraggableList/__tests__/__snapshots__/DraggableList.test.tsx.snap
@@ -10,56 +10,44 @@ exports[`DraggableList > snapshot > should match snapshot 1`] = `
>
diff --git a/src/renderer/src/components/DraggableList/list.tsx b/src/renderer/src/components/DraggableList/list.tsx
index 4452cee4c9..b0e87bd2d2 100644
--- a/src/renderer/src/components/DraggableList/list.tsx
+++ b/src/renderer/src/components/DraggableList/list.tsx
@@ -9,14 +9,13 @@ import {
ResponderProvided
} from '@hello-pangea/dnd'
import { droppableReorder } from '@renderer/utils'
-import { List, ListProps } from 'antd'
-import { FC } from 'react'
+import { FC, HTMLAttributes } from 'react'
interface Props
{
list: T[]
style?: React.CSSProperties
listStyle?: React.CSSProperties
- listProps?: ListProps
+ listProps?: HTMLAttributes
children: (item: T, index: number) => React.ReactNode
onUpdate: (list: T[]) => void
onDragStart?: OnDragStartResponder
@@ -52,10 +51,8 @@ const DraggableList: FC> = ({
{(provided) => (
-
{
+
+ {list.map((item, index) => {
const id = item.id || item
return (
@@ -74,8 +71,8 @@ const DraggableList: FC> = ({
)}
)
- }}
- />
+ })}
+
{provided.placeholder}
)}