Comfy-Org/ComfyUI_frontend
1
0
Fork 0
mirror of https://github.com/Comfy-Org/ComfyUI_frontend.git synced 2026-02-19 06:20:10 +00:00
Code Issues Packages Projects Releases Wiki Activity

[backport cloud/1.37] fix: Consistent keydown handling for EditableText and TagsInput escape key (#8238)

Browse Source 
Backport of #8204 to `cloud/1.37`.

Cherry-picked merge commit `7b701ad07b1c34d121448e21d6f8b5c13ef07d73`.

## Original PR Summary
This PR improves keyboard event handling consistency and fixes an issue
where pressing Escape in nested input components would unintentionally
close parent modals/dialogs.

### Changes
- **EditableText keyup → keydown Migration**: Changed `@keyup.enter` to
`@keydown.enter` and `@keyup.escape` to `@keydown.escape` for more
consistent and responsive feedback
- Updated corresponding unit tests to use `keydown` triggers

> **Note**: The TagsInput escape key handling changes from the original
PR are not included in this backport because the TagsInput component
(#8066) was added after the cloud/1.37 branch was created.

┆Issue is synchronized with this [Notion
page](https://www.notion.so/PR-8238-backport-cloud-1-37-fix-Consistent-keydown-handling-for-EditableText-and-TagsInput-esc-2f06d73d365081288e5ed0c656d78412)
by [Unito](https://www.unito.io)
This commit is contained in:
Alexander Brown
2026-01-21 19:33:28 -08:00
committed by GitHub
parent b8a103b30e
commit 7faf8e0ffd
4 changed files with 16 additions and 10 deletions
Download Patch File Download Diff File Expand all files Collapse all files

10
src/components/common/EditableText.test.ts
View File

@@ -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()
})