refactor: rename byPass function to toggleBypass

This commit is contained in:
Johnpaul
2025-09-09 22:03:12 +01:00
parent b4aedfd66b
commit bb45f1d60d
2 changed files with 23 additions and 37 deletions

View File

@@ -27,10 +27,6 @@ vi.mock('@/utils/litegraphUtil', () => ({
})) }))
describe('BypassButton', () => { describe('BypassButton', () => {
let canvasStore: ReturnType<typeof useCanvasStore>
let commandStore: ReturnType<typeof useCommandStore>
let mockLGraphNode: MockLGraphNode
const i18n = createI18n({ const i18n = createI18n({
legacy: false, legacy: false,
locale: 'en', locale: 'en',
@@ -40,16 +36,18 @@ describe('BypassButton', () => {
bypassButton: { bypassButton: {
tooltip: 'Bypass/Unbypass Selected Nodes' tooltip: 'Bypass/Unbypass Selected Nodes'
} }
} },
'commands.Comfy_Canvas_ToggleSelectedNodes_Bypass.label':
'Toggle Bypass Selected Nodes'
} }
} }
}) })
beforeEach(() => { beforeEach(() => {
setActivePinia(createPinia()) setActivePinia(createPinia())
canvasStore = useCanvasStore() // canvasStore = useCanvasStore()
commandStore = useCommandStore() // commandStore = useCommandStore()
mockLGraphNode = new MockLGraphNode() // mockLGraphNode = new MockLGraphNode()
vi.clearAllMocks() vi.clearAllMocks()
}) })
@@ -67,6 +65,9 @@ describe('BypassButton', () => {
} }
it('should render bypass button', () => { it('should render bypass button', () => {
const canvasStore = useCanvasStore()
const mockLGraphNode = new MockLGraphNode()
canvasStore.selectedItems = [mockLGraphNode] canvasStore.selectedItems = [mockLGraphNode]
const wrapper = mountComponent() const wrapper = mountComponent()
const button = wrapper.find('button') const button = wrapper.find('button')
@@ -74,6 +75,9 @@ describe('BypassButton', () => {
}) })
it('should have correct test id', () => { it('should have correct test id', () => {
const canvasStore = useCanvasStore()
const mockLGraphNode = new MockLGraphNode()
canvasStore.selectedItems = [mockLGraphNode] canvasStore.selectedItems = [mockLGraphNode]
const wrapper = mountComponent() const wrapper = mountComponent()
const button = wrapper.find('[data-testid="bypass-button"]') const button = wrapper.find('[data-testid="bypass-button"]')
@@ -81,6 +85,10 @@ describe('BypassButton', () => {
}) })
it('should execute bypass command when clicked', async () => { it('should execute bypass command when clicked', async () => {
const canvasStore = useCanvasStore()
const commandStore = useCommandStore()
const mockLGraphNode = new MockLGraphNode()
canvasStore.selectedItems = [mockLGraphNode] canvasStore.selectedItems = [mockLGraphNode]
const executeSpy = vi.spyOn(commandStore, 'execute').mockResolvedValue() const executeSpy = vi.spyOn(commandStore, 'execute').mockResolvedValue()
@@ -92,35 +100,13 @@ describe('BypassButton', () => {
) )
}) })
it('should show normal styling when node is not bypassed', () => {
const normalNode = { ...mockLGraphNode, mode: LGraphEventMode.ALWAYS }
canvasStore.selectedItems = [normalNode]
const wrapper = mountComponent()
const button = wrapper.find('button')
expect(button.classes()).not.toContain(
'dark-theme:[&:not(:active)]:!bg-[#262729]'
)
})
it('should show bypassed styling when node is bypassed', async () => {
const bypassedNode = { ...mockLGraphNode, mode: LGraphEventMode.BYPASS }
canvasStore.selectedItems = [bypassedNode]
vi.spyOn(commandStore, 'execute').mockResolvedValue()
const wrapper = mountComponent()
// Click to trigger the reactivity update
await wrapper.find('button').trigger('click')
await wrapper.vm.$nextTick()
const button = wrapper.find('button')
expect(button.exists()).toBe(true)
})
it('should handle multiple selected items', () => { it('should handle multiple selected items', () => {
const canvasStore = useCanvasStore()
const commandStore = useCommandStore()
const mockLGraphNode = new MockLGraphNode()
vi.spyOn(commandStore, 'execute').mockResolvedValue() vi.spyOn(commandStore, 'execute').mockResolvedValue()
canvasStore.selectedItems = [mockLGraphNode, mockLGraphNode] canvasStore.selectedItems = [mockLGraphNode, new MockLGraphNode()]
const wrapper = mountComponent() const wrapper = mountComponent()
const button = wrapper.find('button') const button = wrapper.find('button')
expect(button.exists()).toBe(true) expect(button.exists()).toBe(true)

View File

@@ -13,7 +13,7 @@
'dark-theme:[&:not(:active)]:!bg-[#262729] [&:not(:active)]:!bg-[#E7E6E6]': 'dark-theme:[&:not(:active)]:!bg-[#262729] [&:not(:active)]:!bg-[#E7E6E6]':
isBypassed isBypassed
}" }"
@click="byPass" @click="toggleBypass"
> >
<template #icon> <template #icon>
<i-lucide:ban class="w-4 h-4" /> <i-lucide:ban class="w-4 h-4" />
@@ -34,7 +34,7 @@ const commandStore = useCommandStore()
const { hasAnySelection } = useSelectionState() const { hasAnySelection } = useSelectionState()
const isBypassed = ref(false) const isBypassed = ref(false)
const byPass = async () => { const toggleBypass = async () => {
await commandStore.execute('Comfy.Canvas.ToggleSelectedNodes.Bypass') await commandStore.execute('Comfy.Canvas.ToggleSelectedNodes.Bypass')
} }
</script> </script>