fix: memoize onBeforeDelete and fix test mock selectors
Extract onBeforeDelete into useCallback to avoid new fn ref each render. Fix useThemeStore/useCanvasStore mocks to call the selector fn rather than ignoring it, and reset mockZoom in beforeEach.
This commit is contained in:
@@ -73,6 +73,11 @@ export function CanvasContainer({ onConnect: onConnectProp, onEdgeDoubleClick, o
|
|||||||
onNodeDoubleClick?.(node)
|
onNodeDoubleClick?.(node)
|
||||||
}, [onNodeDoubleClick])
|
}, [onNodeDoubleClick])
|
||||||
|
|
||||||
|
const handleBeforeDelete = useCallback(async () => {
|
||||||
|
snapshotHistory()
|
||||||
|
return true
|
||||||
|
}, [snapshotHistory])
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className="w-full h-full" style={{ background: theme.colors.canvasBackground }}>
|
<div className="w-full h-full" style={{ background: theme.colors.canvasBackground }}>
|
||||||
<ReactFlow
|
<ReactFlow
|
||||||
@@ -89,7 +94,7 @@ export function CanvasContainer({ onConnect: onConnectProp, onEdgeDoubleClick, o
|
|||||||
nodeTypes={nodeTypes}
|
nodeTypes={nodeTypes}
|
||||||
edgeTypes={edgeTypes}
|
edgeTypes={edgeTypes}
|
||||||
deleteKeyCode={['Backspace', 'Delete']}
|
deleteKeyCode={['Backspace', 'Delete']}
|
||||||
onBeforeDelete={async () => { snapshotHistory(); return true }}
|
onBeforeDelete={handleBeforeDelete}
|
||||||
selectionOnDrag={lassoMode}
|
selectionOnDrag={lassoMode}
|
||||||
panOnDrag={lassoMode ? [1, 2] : true}
|
panOnDrag={lassoMode ? [1, 2] : true}
|
||||||
panActivationKeyCode="Space"
|
panActivationKeyCode="Space"
|
||||||
|
|||||||
@@ -1,4 +1,4 @@
|
|||||||
import { describe, it, expect, vi } from 'vitest'
|
import { describe, it, expect, vi, beforeEach } from 'vitest'
|
||||||
import { render, screen } from '@testing-library/react'
|
import { render, screen } from '@testing-library/react'
|
||||||
import { Server } from 'lucide-react'
|
import { Server } from 'lucide-react'
|
||||||
import { BaseNode } from '../nodes/BaseNode'
|
import { BaseNode } from '../nodes/BaseNode'
|
||||||
@@ -16,11 +16,11 @@ vi.mock('@xyflow/react', () => ({
|
|||||||
}))
|
}))
|
||||||
|
|
||||||
vi.mock('@/stores/themeStore', () => ({
|
vi.mock('@/stores/themeStore', () => ({
|
||||||
useThemeStore: () => 'dark',
|
useThemeStore: (sel: (s: { activeTheme: string }) => unknown) => sel({ activeTheme: 'dark' }),
|
||||||
}))
|
}))
|
||||||
|
|
||||||
vi.mock('@/stores/canvasStore', () => ({
|
vi.mock('@/stores/canvasStore', () => ({
|
||||||
useCanvasStore: () => ({ hideIp: false }),
|
useCanvasStore: (sel: (s: { hideIp: boolean }) => unknown) => sel({ hideIp: false }),
|
||||||
}))
|
}))
|
||||||
|
|
||||||
vi.mock('@/utils/themes', () => ({
|
vi.mock('@/utils/themes', () => ({
|
||||||
@@ -89,6 +89,8 @@ function renderBaseNode(data: Partial<NodeData>) {
|
|||||||
}
|
}
|
||||||
|
|
||||||
describe('BaseNode — borderWidth zoom scaling', () => {
|
describe('BaseNode — borderWidth zoom scaling', () => {
|
||||||
|
beforeEach(() => { mockZoom = 1 })
|
||||||
|
|
||||||
it('borderWidth is 1px at zoom=1', () => {
|
it('borderWidth is 1px at zoom=1', () => {
|
||||||
mockZoom = 1
|
mockZoom = 1
|
||||||
const { container } = renderBaseNode({})
|
const { container } = renderBaseNode({})
|
||||||
|
|||||||
Reference in New Issue
Block a user