diff --git a/src/components/common/EditableText.test.ts b/src/components/common/EditableText.test.ts
index 2d31123b9..df1ea5152 100644
--- a/src/components/common/EditableText.test.ts
+++ b/src/components/common/EditableText.test.ts
@@ -51,7 +51,7 @@ describe('EditableText', () => {
isEditing: true
})
await wrapper.findComponent(InputText).setValue('New Text')
- await wrapper.findComponent(InputText).trigger('keyup.enter')
+ await wrapper.findComponent(InputText).trigger('keydown.enter')
// Blur event should have been triggered
expect(wrapper.findComponent(InputText).element).not.toBe(
document.activeElement
@@ -79,7 +79,7 @@ describe('EditableText', () => {
await wrapper.findComponent(InputText).setValue('Modified Text')
// Press escape
- await wrapper.findComponent(InputText).trigger('keyup.escape')
+ await wrapper.findComponent(InputText).trigger('keydown.escape')
// Should emit cancel event
expect(wrapper.emitted('cancel')).toBeTruthy()
@@ -103,7 +103,7 @@ describe('EditableText', () => {
await wrapper.findComponent(InputText).setValue('Modified Text')
// Press escape (which triggers blur internally)
- await wrapper.findComponent(InputText).trigger('keyup.escape')
+ await wrapper.findComponent(InputText).trigger('keydown.escape')
// Manually trigger blur to simulate the blur that happens after escape
await wrapper.findComponent(InputText).trigger('blur')
@@ -120,7 +120,7 @@ describe('EditableText', () => {
isEditing: true
})
await enterWrapper.findComponent(InputText).setValue('Saved Text')
- await enterWrapper.findComponent(InputText).trigger('keyup.enter')
+ await enterWrapper.findComponent(InputText).trigger('keydown.enter')
// Trigger blur that happens after enter
await enterWrapper.findComponent(InputText).trigger('blur')
expect(enterWrapper.emitted('edit')).toBeTruthy()
@@ -133,7 +133,7 @@ describe('EditableText', () => {
isEditing: true
})
await escapeWrapper.findComponent(InputText).setValue('Cancelled Text')
- await escapeWrapper.findComponent(InputText).trigger('keyup.escape')
+ await escapeWrapper.findComponent(InputText).trigger('keydown.escape')
expect(escapeWrapper.emitted('cancel')).toBeTruthy()
expect(escapeWrapper.emitted('edit')).toBeFalsy()
})
diff --git a/src/components/common/EditableText.vue b/src/components/common/EditableText.vue
index 322d332a4..440935fb9 100644
--- a/src/components/common/EditableText.vue
+++ b/src/components/common/EditableText.vue
@@ -3,7 +3,7 @@
{{ modelValue }}
-
+
isEditing.value || isEmpty)
const { forwardRef, currentElement } = useForwardExpose()
const registerFocus = inject(tagsInputFocusKey, undefined)
+function handleEscape() {
+ currentElement.value?.blur()
+ isEditing.value = false
+}
+
onMounted(() => {
registerFocus?.(() => currentElement.value?.focus())
})
@@ -44,5 +49,6 @@ onUnmounted(() => {
className
)
"
+ @keydown.escape.stop="handleEscape"
/>
diff --git a/src/renderer/extensions/vueNodes/components/NodeHeader.test.ts b/src/renderer/extensions/vueNodes/components/NodeHeader.test.ts
index 0c755116b..a813e88af 100644
--- a/src/renderer/extensions/vueNodes/components/NodeHeader.test.ts
+++ b/src/renderer/extensions/vueNodes/components/NodeHeader.test.ts
@@ -154,7 +154,7 @@ describe('NodeHeader.vue', () => {
// Edit and confirm (EditableText uses blur or enter to emit)
const input = wrapper.get('[data-testid="node-title-input"]')
await input.setValue('My Custom Sampler')
- await input.trigger('keyup.enter')
+ await input.trigger('keydown.enter')
await input.trigger('blur')
// NodeHeader should emit update:title with trimmed value
@@ -169,7 +169,7 @@ describe('NodeHeader.vue', () => {
await wrapper.get('[data-testid="node-header-1"]').trigger('dblclick')
const input = wrapper.get('[data-testid="node-title-input"]')
await input.setValue('Should Not Save')
- await input.trigger('keyup.escape')
+ await input.trigger('keydown.escape')
// Should not emit update:title
expect(wrapper.emitted('update:title')).toBeFalsy()