From d9df115c0bb6c484c3d3907e3f373a00aebc683b Mon Sep 17 00:00:00 2001 From: sahejkm Date: Thu, 16 May 2024 03:15:48 +0800 Subject: [PATCH 1/9] [Lexical]Replace code with key to check KeyboardEvents --- .../src/plugins/TestRecorderPlugin/index.tsx | 2 +- .../src/plugins/TypingPerfPlugin/index.ts | 4 +- .../src/__tests__/utils/index.ts | 4 +- packages/lexical/src/LexicalEvents.ts | 64 ++++---- packages/lexical/src/LexicalUtils.ts | 140 +++++++++--------- 5 files changed, 106 insertions(+), 108 deletions(-) diff --git a/packages/lexical-playground/src/plugins/TestRecorderPlugin/index.tsx b/packages/lexical-playground/src/plugins/TestRecorderPlugin/index.tsx index 3af7e33d67a..92cdd4a51be 100644 --- a/packages/lexical-playground/src/plugins/TestRecorderPlugin/index.tsx +++ b/packages/lexical-playground/src/plugins/TestRecorderPlugin/index.tsx @@ -95,7 +95,7 @@ const formatStep = (step: Step) => { }; export function isSelectAll(event: KeyboardEvent): boolean { - return event.code === 'KeyA' && (IS_APPLE ? event.metaKey : event.ctrlKey); + return event.key === 'A' && (IS_APPLE ? event.metaKey : event.ctrlKey); } // stolen from LexicalSelection-test diff --git a/packages/lexical-playground/src/plugins/TypingPerfPlugin/index.ts b/packages/lexical-playground/src/plugins/TypingPerfPlugin/index.ts index 01780f7a7ff..535a9dd1bb4 100644 --- a/packages/lexical-playground/src/plugins/TypingPerfPlugin/index.ts +++ b/packages/lexical-playground/src/plugins/TypingPerfPlugin/index.ts @@ -83,9 +83,9 @@ export default function TypingPerfPlugin(): JSX.Element | null { }; const keyDownHandler = function keyDownHandler(event: KeyboardEvent) { - const keyCode = event.code; + const key = event.key; - if (keyCode === 'Backspace' || keyCode === 'Enter') { + if (key === 'Backspace' || key === 'Enter') { measureEventStart(); } }; diff --git a/packages/lexical-selection/src/__tests__/utils/index.ts b/packages/lexical-selection/src/__tests__/utils/index.ts index 648c533c09a..b8317d56b3e 100644 --- a/packages/lexical-selection/src/__tests__/utils/index.ts +++ b/packages/lexical-selection/src/__tests__/utils/index.ts @@ -781,8 +781,8 @@ export async function applySelectionInputs( new KeyboardEvent('keydown', { bubbles: true, cancelable: true, - code: 'KeyZ', ctrlKey: true, + key: 'z', keyCode: 90, }), ); @@ -794,8 +794,8 @@ export async function applySelectionInputs( new KeyboardEvent('keydown', { bubbles: true, cancelable: true, - code: 'KeyZ', ctrlKey: true, + key: 'z', keyCode: 90, shiftKey: true, }), diff --git a/packages/lexical/src/LexicalEvents.ts b/packages/lexical/src/LexicalEvents.ts index 0216eb8d5b2..932af7698d6 100644 --- a/packages/lexical/src/LexicalEvents.ts +++ b/packages/lexical/src/LexicalEvents.ts @@ -516,7 +516,7 @@ function $canRemoveText( function isPossiblyAndroidKeyPress(timeStamp: number): boolean { return ( - lastKeyCode === 'Delete' && + lastKeyCode === '229' && timeStamp < lastKeyDownTimeStamp + ANDROID_COMPOSITION_LATENCY ); } @@ -994,101 +994,101 @@ function onCompositionEnd( function onKeyDown(event: KeyboardEvent, editor: LexicalEditor): void { lastKeyDownTimeStamp = event.timeStamp; - lastKeyCode = event.code; + lastKeyCode = event.key; if (editor.isComposing()) { return; } - const {code, shiftKey, ctrlKey, metaKey, altKey} = event; + const {key, shiftKey, ctrlKey, metaKey, altKey} = event; if (dispatchCommand(editor, KEY_DOWN_COMMAND, event)) { return; } - if (isMoveForward(code, ctrlKey, altKey, metaKey)) { + if (isMoveForward(key, ctrlKey, altKey, metaKey)) { dispatchCommand(editor, KEY_ARROW_RIGHT_COMMAND, event); - } else if (isMoveToEnd(code, ctrlKey, shiftKey, altKey, metaKey)) { + } else if (isMoveToEnd(key, ctrlKey, shiftKey, altKey, metaKey)) { dispatchCommand(editor, MOVE_TO_END, event); - } else if (isMoveBackward(code, ctrlKey, altKey, metaKey)) { + } else if (isMoveBackward(key, ctrlKey, altKey, metaKey)) { dispatchCommand(editor, KEY_ARROW_LEFT_COMMAND, event); - } else if (isMoveToStart(code, ctrlKey, shiftKey, altKey, metaKey)) { + } else if (isMoveToStart(key, ctrlKey, shiftKey, altKey, metaKey)) { dispatchCommand(editor, MOVE_TO_START, event); - } else if (isMoveUp(code, ctrlKey, metaKey)) { + } else if (isMoveUp(key, ctrlKey, metaKey)) { dispatchCommand(editor, KEY_ARROW_UP_COMMAND, event); - } else if (isMoveDown(code, ctrlKey, metaKey)) { + } else if (isMoveDown(key, ctrlKey, metaKey)) { dispatchCommand(editor, KEY_ARROW_DOWN_COMMAND, event); - } else if (isLineBreak(code, shiftKey)) { + } else if (isLineBreak(key, shiftKey)) { isInsertLineBreak = true; dispatchCommand(editor, KEY_ENTER_COMMAND, event); - } else if (isSpace(code)) { + } else if (isSpace(key)) { dispatchCommand(editor, KEY_SPACE_COMMAND, event); - } else if (isOpenLineBreak(code, ctrlKey)) { + } else if (isOpenLineBreak(key, ctrlKey)) { event.preventDefault(); isInsertLineBreak = true; dispatchCommand(editor, INSERT_LINE_BREAK_COMMAND, true); - } else if (isParagraph(code, shiftKey)) { + } else if (isParagraph(key, shiftKey)) { isInsertLineBreak = false; dispatchCommand(editor, KEY_ENTER_COMMAND, event); - } else if (isDeleteBackward(code, altKey, metaKey, ctrlKey)) { - if (isBackspace(code)) { + } else if (isDeleteBackward(key, altKey, metaKey, ctrlKey)) { + if (isBackspace(key)) { dispatchCommand(editor, KEY_BACKSPACE_COMMAND, event); } else { event.preventDefault(); dispatchCommand(editor, DELETE_CHARACTER_COMMAND, true); } - } else if (isEscape(code)) { + } else if (isEscape(key)) { dispatchCommand(editor, KEY_ESCAPE_COMMAND, event); - } else if (isDeleteForward(code, ctrlKey, shiftKey, altKey, metaKey)) { - if (isDelete(code)) { + } else if (isDeleteForward(key, ctrlKey, shiftKey, altKey, metaKey)) { + if (isDelete(key)) { dispatchCommand(editor, KEY_DELETE_COMMAND, event); } else { event.preventDefault(); dispatchCommand(editor, DELETE_CHARACTER_COMMAND, false); } - } else if (isDeleteWordBackward(code, altKey, ctrlKey)) { + } else if (isDeleteWordBackward(key, altKey, ctrlKey)) { event.preventDefault(); dispatchCommand(editor, DELETE_WORD_COMMAND, true); - } else if (isDeleteWordForward(code, altKey, ctrlKey)) { + } else if (isDeleteWordForward(key, altKey, ctrlKey)) { event.preventDefault(); dispatchCommand(editor, DELETE_WORD_COMMAND, false); - } else if (isDeleteLineBackward(code, metaKey)) { + } else if (isDeleteLineBackward(key, metaKey)) { event.preventDefault(); dispatchCommand(editor, DELETE_LINE_COMMAND, true); - } else if (isDeleteLineForward(code, metaKey)) { + } else if (isDeleteLineForward(key, metaKey)) { event.preventDefault(); dispatchCommand(editor, DELETE_LINE_COMMAND, false); - } else if (isBold(code, altKey, metaKey, ctrlKey)) { + } else if (isBold(key, altKey, metaKey, ctrlKey)) { event.preventDefault(); dispatchCommand(editor, FORMAT_TEXT_COMMAND, 'bold'); - } else if (isUnderline(code, altKey, metaKey, ctrlKey)) { + } else if (isUnderline(key, altKey, metaKey, ctrlKey)) { event.preventDefault(); dispatchCommand(editor, FORMAT_TEXT_COMMAND, 'underline'); - } else if (isItalic(code, altKey, metaKey, ctrlKey)) { + } else if (isItalic(key, altKey, metaKey, ctrlKey)) { event.preventDefault(); dispatchCommand(editor, FORMAT_TEXT_COMMAND, 'italic'); - } else if (isTab(code, altKey, ctrlKey, metaKey)) { + } else if (isTab(key, altKey, ctrlKey, metaKey)) { dispatchCommand(editor, KEY_TAB_COMMAND, event); - } else if (isUndo(code, shiftKey, metaKey, ctrlKey)) { + } else if (isUndo(key, shiftKey, metaKey, ctrlKey)) { event.preventDefault(); dispatchCommand(editor, UNDO_COMMAND, undefined); - } else if (isRedo(code, shiftKey, metaKey, ctrlKey)) { + } else if (isRedo(key, shiftKey, metaKey, ctrlKey)) { event.preventDefault(); dispatchCommand(editor, REDO_COMMAND, undefined); } else { const prevSelection = editor._editorState._selection; if ($isNodeSelection(prevSelection)) { - if (isCopy(code, shiftKey, metaKey, ctrlKey)) { + if (isCopy(key, shiftKey, metaKey, ctrlKey)) { event.preventDefault(); dispatchCommand(editor, COPY_COMMAND, event); - } else if (isCut(code, shiftKey, metaKey, ctrlKey)) { + } else if (isCut(key, shiftKey, metaKey, ctrlKey)) { event.preventDefault(); dispatchCommand(editor, CUT_COMMAND, event); - } else if (isSelectAll(code, metaKey, ctrlKey)) { + } else if (isSelectAll(key, metaKey, ctrlKey)) { event.preventDefault(); dispatchCommand(editor, SELECT_ALL_COMMAND, event); } // FF does it well (no need to override behavior) - } else if (!IS_FIREFOX && isSelectAll(code, metaKey, ctrlKey)) { + } else if (!IS_FIREFOX && isSelectAll(key, metaKey, ctrlKey)) { event.preventDefault(); dispatchCommand(editor, SELECT_ALL_COMMAND, event); } diff --git a/packages/lexical/src/LexicalUtils.ts b/packages/lexical/src/LexicalUtils.ts index 7fb995868f7..b81e62ce1a2 100644 --- a/packages/lexical/src/LexicalUtils.ts +++ b/packages/lexical/src/LexicalUtils.ts @@ -763,82 +763,82 @@ export function $shouldInsertTextAfterOrBeforeTextNode( } export function isTab( - code: string, + key: string, altKey: boolean, ctrlKey: boolean, metaKey: boolean, ): boolean { - return code === 'Tab' && !altKey && !ctrlKey && !metaKey; + return key === '9' && !altKey && !ctrlKey && !metaKey; } export function isBold( - code: string, + key: string, altKey: boolean, metaKey: boolean, ctrlKey: boolean, ): boolean { - return code === 'KeyB' && !altKey && controlOrMeta(metaKey, ctrlKey); + return key === 'B' && !altKey && controlOrMeta(metaKey, ctrlKey); } export function isItalic( - code: string, + key: string, altKey: boolean, metaKey: boolean, ctrlKey: boolean, ): boolean { - return code === 'KeyI' && !altKey && controlOrMeta(metaKey, ctrlKey); + return key === 'I' && !altKey && controlOrMeta(metaKey, ctrlKey); } export function isUnderline( - code: string, + key: string, altKey: boolean, metaKey: boolean, ctrlKey: boolean, ): boolean { - return code === 'KeyU' && !altKey && controlOrMeta(metaKey, ctrlKey); + return key === 'U' && !altKey && controlOrMeta(metaKey, ctrlKey); } -export function isParagraph(code: string, shiftKey: boolean): boolean { - return isReturn(code) && !shiftKey; +export function isParagraph(key: string, shiftKey: boolean): boolean { + return isReturn(key) && !shiftKey; } -export function isLineBreak(keyCode: string, shiftKey: boolean): boolean { - return isReturn(keyCode) && shiftKey; +export function isLineBreak(key: string, shiftKey: boolean): boolean { + return isReturn(key) && shiftKey; } // Inserts a new line after the selection -export function isOpenLineBreak(code: string, ctrlKey: boolean): boolean { +export function isOpenLineBreak(key: string, ctrlKey: boolean): boolean { // 79 = KeyO - return IS_APPLE && ctrlKey && code === 'KeyO'; + return IS_APPLE && ctrlKey && key === 'O'; } export function isDeleteWordBackward( - code: string, + key: string, altKey: boolean, ctrlKey: boolean, ): boolean { - return isBackspace(code) && (IS_APPLE ? altKey : ctrlKey); + return isBackspace(key) && (IS_APPLE ? altKey : ctrlKey); } export function isDeleteWordForward( - code: string, + key: string, altKey: boolean, ctrlKey: boolean, ): boolean { - return isDelete(code) && (IS_APPLE ? altKey : ctrlKey); + return isDelete(key) && (IS_APPLE ? altKey : ctrlKey); } -export function isDeleteLineBackward(code: string, metaKey: boolean): boolean { - return IS_APPLE && metaKey && isBackspace(code); +export function isDeleteLineBackward(key: string, metaKey: boolean): boolean { + return IS_APPLE && metaKey && isBackspace(key); } -export function isDeleteLineForward(code: string, metaKey: boolean): boolean { - return IS_APPLE && metaKey && isDelete(code); +export function isDeleteLineForward(key: string, metaKey: boolean): boolean { + return IS_APPLE && metaKey && isDelete(key); } export function isDeleteBackward( - code: string, + key: string, altKey: boolean, metaKey: boolean, ctrlKey: boolean, @@ -847,16 +847,16 @@ export function isDeleteBackward( if (altKey || metaKey) { return false; } - return isBackspace(code) || (code === 'KeyH' && ctrlKey); + return isBackspace(key) || (key === 'H' && ctrlKey); } if (ctrlKey || altKey || metaKey) { return false; } - return isBackspace(code); + return isBackspace(key); } export function isDeleteForward( - code: string, + key: string, ctrlKey: boolean, shiftKey: boolean, altKey: boolean, @@ -866,39 +866,37 @@ export function isDeleteForward( if (shiftKey || altKey || metaKey) { return false; } - return isDelete(code) || (code === 'KeyD' && ctrlKey); + return isDelete(key) || (key === 'D' && ctrlKey); } if (ctrlKey || altKey || metaKey) { return false; } - return isDelete(code); + return isDelete(key); } export function isUndo( - code: string, + key: string, shiftKey: boolean, metaKey: boolean, ctrlKey: boolean, ): boolean { - return code === 'KeyZ' && !shiftKey && controlOrMeta(metaKey, ctrlKey); + return key === 'Z' && !shiftKey && controlOrMeta(metaKey, ctrlKey); } export function isRedo( - code: string, + key: string, shiftKey: boolean, metaKey: boolean, ctrlKey: boolean, ): boolean { if (IS_APPLE) { - return code === 'KeyZ' && metaKey && shiftKey; + return key === 'Z' && metaKey && shiftKey; } - return ( - (code === 'KeyY' && ctrlKey) || (code === 'KeyZ' && ctrlKey && shiftKey) - ); + return (key === 'Y' && ctrlKey) || (key === 'Z' && ctrlKey && shiftKey); } export function isCopy( - code: string, + key: string, shiftKey: boolean, metaKey: boolean, ctrlKey: boolean, @@ -906,7 +904,7 @@ export function isCopy( if (shiftKey) { return false; } - if (code === 'KeyC') { + if (key === 'C') { return IS_APPLE ? metaKey : ctrlKey; } @@ -914,7 +912,7 @@ export function isCopy( } export function isCut( - code: string, + key: string, shiftKey: boolean, metaKey: boolean, ctrlKey: boolean, @@ -922,81 +920,81 @@ export function isCut( if (shiftKey) { return false; } - if (code === 'KeyX') { + if (key === 'X') { return IS_APPLE ? metaKey : ctrlKey; } return false; } -function isArrowLeft(code: string): boolean { - return code === 'ArrowLeft'; +function isArrowLeft(key: string): boolean { + return key === 'ArrowLeft'; } -function isArrowRight(code: string): boolean { - return code === 'ArrowRight'; +function isArrowRight(key: string): boolean { + return key === 'ArrowRight'; } -function isArrowUp(code: string): boolean { - return code === 'ArrowUp'; +function isArrowUp(key: string): boolean { + return key === 'ArrowUp'; } -function isArrowDown(code: string): boolean { - return code === 'ArrowDown'; +function isArrowDown(key: string): boolean { + return key === 'ArrowDown'; } export function isMoveBackward( - code: string, + key: string, ctrlKey: boolean, altKey: boolean, metaKey: boolean, ): boolean { - return isArrowLeft(code) && !ctrlKey && !metaKey && !altKey; + return isArrowLeft(key) && !ctrlKey && !metaKey && !altKey; } export function isMoveToStart( - code: string, + key: string, ctrlKey: boolean, shiftKey: boolean, altKey: boolean, metaKey: boolean, ): boolean { - return isArrowLeft(code) && !altKey && !shiftKey && (ctrlKey || metaKey); + return isArrowLeft(key) && !altKey && !shiftKey && (ctrlKey || metaKey); } export function isMoveForward( - code: string, + key: string, ctrlKey: boolean, altKey: boolean, metaKey: boolean, ): boolean { - return isArrowRight(code) && !ctrlKey && !metaKey && !altKey; + return isArrowRight(key) && !ctrlKey && !metaKey && !altKey; } export function isMoveToEnd( - code: string, + key: string, ctrlKey: boolean, shiftKey: boolean, altKey: boolean, metaKey: boolean, ): boolean { - return isArrowRight(code) && !altKey && !shiftKey && (ctrlKey || metaKey); + return isArrowRight(key) && !altKey && !shiftKey && (ctrlKey || metaKey); } export function isMoveUp( - code: string, + key: string, ctrlKey: boolean, metaKey: boolean, ): boolean { - return isArrowUp(code) && !ctrlKey && !metaKey; + return isArrowUp(key) && !ctrlKey && !metaKey; } export function isMoveDown( - code: string, + key: string, ctrlKey: boolean, metaKey: boolean, ): boolean { - return isArrowDown(code) && !ctrlKey && !metaKey; + return isArrowDown(key) && !ctrlKey && !metaKey; } export function isModifier( @@ -1008,8 +1006,8 @@ export function isModifier( return ctrlKey || shiftKey || altKey || metaKey; } -export function isSpace(code: string): boolean { - return code === 'Space'; +export function isSpace(key: string): boolean { + return key === ' '; } export function controlOrMeta(metaKey: boolean, ctrlKey: boolean): boolean { @@ -1019,28 +1017,28 @@ export function controlOrMeta(metaKey: boolean, ctrlKey: boolean): boolean { return ctrlKey; } -export function isReturn(code: string): boolean { - return code === 'Enter'; +export function isReturn(key: string): boolean { + return key === 'Enter'; } -export function isBackspace(code: string): boolean { - return code === 'Backspace'; +export function isBackspace(key: string): boolean { + return key === 'Backspace'; } -export function isEscape(code: string): boolean { - return code === 'Escape'; +export function isEscape(key: string): boolean { + return key === 'Escape'; } -export function isDelete(code: string): boolean { - return code === 'Delete'; +export function isDelete(key: string): boolean { + return key === 'Delete'; } export function isSelectAll( - code: string, + key: string, metaKey: boolean, ctrlKey: boolean, ): boolean { - return code === 'KeyA' && controlOrMeta(metaKey, ctrlKey); + return key === 'A' && controlOrMeta(metaKey, ctrlKey); } export function $selectAll(): void { From dce86c0044abb17a6237ac302d2842ad946d743d Mon Sep 17 00:00:00 2001 From: sahejkm Date: Thu, 16 May 2024 03:24:05 +0800 Subject: [PATCH 2/9] . --- packages/lexical-selection/src/__tests__/utils/index.ts | 4 ++-- packages/lexical/src/LexicalEvents.ts | 2 +- 2 files changed, 3 insertions(+), 3 deletions(-) diff --git a/packages/lexical-selection/src/__tests__/utils/index.ts b/packages/lexical-selection/src/__tests__/utils/index.ts index b8317d56b3e..540d3f897cb 100644 --- a/packages/lexical-selection/src/__tests__/utils/index.ts +++ b/packages/lexical-selection/src/__tests__/utils/index.ts @@ -782,7 +782,7 @@ export async function applySelectionInputs( bubbles: true, cancelable: true, ctrlKey: true, - key: 'z', + key: 'Z', keyCode: 90, }), ); @@ -795,7 +795,7 @@ export async function applySelectionInputs( bubbles: true, cancelable: true, ctrlKey: true, - key: 'z', + key: 'Z', keyCode: 90, shiftKey: true, }), diff --git a/packages/lexical/src/LexicalEvents.ts b/packages/lexical/src/LexicalEvents.ts index 932af7698d6..a8c7991edab 100644 --- a/packages/lexical/src/LexicalEvents.ts +++ b/packages/lexical/src/LexicalEvents.ts @@ -516,7 +516,7 @@ function $canRemoveText( function isPossiblyAndroidKeyPress(timeStamp: number): boolean { return ( - lastKeyCode === '229' && + lastKeyCode === 'PageUp' && timeStamp < lastKeyDownTimeStamp + ANDROID_COMPOSITION_LATENCY ); } From 8f1efbcab77e63fdb95bd7073244ab91e33e1208 Mon Sep 17 00:00:00 2001 From: sahejkm Date: Thu, 16 May 2024 03:31:57 +0800 Subject: [PATCH 3/9] . --- packages/lexical/src/LexicalUtils.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/lexical/src/LexicalUtils.ts b/packages/lexical/src/LexicalUtils.ts index b81e62ce1a2..c2759400542 100644 --- a/packages/lexical/src/LexicalUtils.ts +++ b/packages/lexical/src/LexicalUtils.ts @@ -768,7 +768,7 @@ export function isTab( ctrlKey: boolean, metaKey: boolean, ): boolean { - return key === '9' && !altKey && !ctrlKey && !metaKey; + return key === 'Tab' && !altKey && !ctrlKey && !metaKey; } export function isBold( From fea7c2befe386ac14bd26bec3c66010fb16e212a Mon Sep 17 00:00:00 2001 From: sahejkm Date: Thu, 16 May 2024 03:42:36 +0800 Subject: [PATCH 4/9] . --- .../src/plugins/TestRecorderPlugin/index.tsx | 5 ++++- packages/lexical/src/LexicalUtils.ts | 14 +++++++++----- 2 files changed, 13 insertions(+), 6 deletions(-) diff --git a/packages/lexical-playground/src/plugins/TestRecorderPlugin/index.tsx b/packages/lexical-playground/src/plugins/TestRecorderPlugin/index.tsx index 92cdd4a51be..838568397f3 100644 --- a/packages/lexical-playground/src/plugins/TestRecorderPlugin/index.tsx +++ b/packages/lexical-playground/src/plugins/TestRecorderPlugin/index.tsx @@ -95,7 +95,10 @@ const formatStep = (step: Step) => { }; export function isSelectAll(event: KeyboardEvent): boolean { - return event.key === 'A' && (IS_APPLE ? event.metaKey : event.ctrlKey); + return ( + event.key.toLowerCase() === 'a' && + (IS_APPLE ? event.metaKey : event.ctrlKey) + ); } // stolen from LexicalSelection-test diff --git a/packages/lexical/src/LexicalUtils.ts b/packages/lexical/src/LexicalUtils.ts index c2759400542..e8345186e1e 100644 --- a/packages/lexical/src/LexicalUtils.ts +++ b/packages/lexical/src/LexicalUtils.ts @@ -777,7 +777,9 @@ export function isBold( metaKey: boolean, ctrlKey: boolean, ): boolean { - return key === 'B' && !altKey && controlOrMeta(metaKey, ctrlKey); + return ( + key.toLowerCase() === 'b' && !altKey && controlOrMeta(metaKey, ctrlKey) + ); } export function isItalic( @@ -786,7 +788,9 @@ export function isItalic( metaKey: boolean, ctrlKey: boolean, ): boolean { - return key === 'I' && !altKey && controlOrMeta(metaKey, ctrlKey); + return ( + key.toLowerCase() === 'i' && !altKey && controlOrMeta(metaKey, ctrlKey) + ); } export function isUnderline( @@ -810,7 +814,7 @@ export function isLineBreak(key: string, shiftKey: boolean): boolean { export function isOpenLineBreak(key: string, ctrlKey: boolean): boolean { // 79 = KeyO - return IS_APPLE && ctrlKey && key === 'O'; + return IS_APPLE && ctrlKey && key.toLowerCase() === 'o'; } export function isDeleteWordBackward( @@ -904,7 +908,7 @@ export function isCopy( if (shiftKey) { return false; } - if (key === 'C') { + if (key.toLowerCase() === 'c') { return IS_APPLE ? metaKey : ctrlKey; } @@ -920,7 +924,7 @@ export function isCut( if (shiftKey) { return false; } - if (key === 'X') { + if (key.toLowerCase() === 'x') { return IS_APPLE ? metaKey : ctrlKey; } From d3bfb7aa2a81dee7d17f58bd5bd088e648c49565 Mon Sep 17 00:00:00 2001 From: sahejkm Date: Thu, 16 May 2024 03:47:17 +0800 Subject: [PATCH 5/9] . --- packages/lexical/src/LexicalUtils.ts | 17 +++++++++++------ 1 file changed, 11 insertions(+), 6 deletions(-) diff --git a/packages/lexical/src/LexicalUtils.ts b/packages/lexical/src/LexicalUtils.ts index e8345186e1e..c1410793190 100644 --- a/packages/lexical/src/LexicalUtils.ts +++ b/packages/lexical/src/LexicalUtils.ts @@ -851,7 +851,7 @@ export function isDeleteBackward( if (altKey || metaKey) { return false; } - return isBackspace(key) || (key === 'H' && ctrlKey); + return isBackspace(key) || (key.toLowerCase() === 'h' && ctrlKey); } if (ctrlKey || altKey || metaKey) { return false; @@ -870,7 +870,7 @@ export function isDeleteForward( if (shiftKey || altKey || metaKey) { return false; } - return isDelete(key) || (key === 'D' && ctrlKey); + return isDelete(key) || (key.toLowerCase() === 'd' && ctrlKey); } if (ctrlKey || altKey || metaKey) { return false; @@ -884,7 +884,9 @@ export function isUndo( metaKey: boolean, ctrlKey: boolean, ): boolean { - return key === 'Z' && !shiftKey && controlOrMeta(metaKey, ctrlKey); + return ( + key.toLowerCase() === 'z' && !shiftKey && controlOrMeta(metaKey, ctrlKey) + ); } export function isRedo( @@ -894,9 +896,12 @@ export function isRedo( ctrlKey: boolean, ): boolean { if (IS_APPLE) { - return key === 'Z' && metaKey && shiftKey; + return key.toLowerCase() === 'z' && metaKey && shiftKey; } - return (key === 'Y' && ctrlKey) || (key === 'Z' && ctrlKey && shiftKey); + return ( + (key.toLowerCase() === 'y' && ctrlKey) || + (key.toLowerCase() === 'z' && ctrlKey && shiftKey) + ); } export function isCopy( @@ -1042,7 +1047,7 @@ export function isSelectAll( metaKey: boolean, ctrlKey: boolean, ): boolean { - return key === 'A' && controlOrMeta(metaKey, ctrlKey); + return key.toLowerCase() === 'a' && controlOrMeta(metaKey, ctrlKey); } export function $selectAll(): void { From 4bbe939a302bc39a483533565180e870967e4566 Mon Sep 17 00:00:00 2001 From: sahejkm Date: Thu, 16 May 2024 18:38:09 +0800 Subject: [PATCH 6/9] Fix test --- .../lexical-playground/__tests__/e2e/TextFormatting.spec.mjs | 1 - packages/lexical-selection/src/__tests__/utils/index.ts | 4 ++-- 2 files changed, 2 insertions(+), 3 deletions(-) diff --git a/packages/lexical-playground/__tests__/e2e/TextFormatting.spec.mjs b/packages/lexical-playground/__tests__/e2e/TextFormatting.spec.mjs index 281a84444aa..034a6d0fcdf 100644 --- a/packages/lexical-playground/__tests__/e2e/TextFormatting.spec.mjs +++ b/packages/lexical-playground/__tests__/e2e/TextFormatting.spec.mjs @@ -1142,7 +1142,6 @@ test.describe('TextFormatting', () => {
Yellow flower in tilt shift lens diff --git a/packages/lexical-selection/src/__tests__/utils/index.ts b/packages/lexical-selection/src/__tests__/utils/index.ts index 540d3f897cb..b8317d56b3e 100644 --- a/packages/lexical-selection/src/__tests__/utils/index.ts +++ b/packages/lexical-selection/src/__tests__/utils/index.ts @@ -782,7 +782,7 @@ export async function applySelectionInputs( bubbles: true, cancelable: true, ctrlKey: true, - key: 'Z', + key: 'z', keyCode: 90, }), ); @@ -795,7 +795,7 @@ export async function applySelectionInputs( bubbles: true, cancelable: true, ctrlKey: true, - key: 'Z', + key: 'z', keyCode: 90, shiftKey: true, }), From f95a296bd046a75c7f29313afd24f357e9e06ee2 Mon Sep 17 00:00:00 2001 From: sahejkm Date: Thu, 16 May 2024 18:50:21 +0800 Subject: [PATCH 7/9] fix test --- .../lexical-playground/__tests__/e2e/TextFormatting.spec.mjs | 1 + packages/lexical/src/LexicalEvents.ts | 2 +- 2 files changed, 2 insertions(+), 1 deletion(-) diff --git a/packages/lexical-playground/__tests__/e2e/TextFormatting.spec.mjs b/packages/lexical-playground/__tests__/e2e/TextFormatting.spec.mjs index 034a6d0fcdf..281a84444aa 100644 --- a/packages/lexical-playground/__tests__/e2e/TextFormatting.spec.mjs +++ b/packages/lexical-playground/__tests__/e2e/TextFormatting.spec.mjs @@ -1142,6 +1142,7 @@ test.describe('TextFormatting', () => {
Yellow flower in tilt shift lens diff --git a/packages/lexical/src/LexicalEvents.ts b/packages/lexical/src/LexicalEvents.ts index a8c7991edab..fb4bca87979 100644 --- a/packages/lexical/src/LexicalEvents.ts +++ b/packages/lexical/src/LexicalEvents.ts @@ -516,7 +516,7 @@ function $canRemoveText( function isPossiblyAndroidKeyPress(timeStamp: number): boolean { return ( - lastKeyCode === 'PageUp' && + lastKeyCode === 'Dead' && timeStamp < lastKeyDownTimeStamp + ANDROID_COMPOSITION_LATENCY ); } From 325b4ecd485c315f205857fd807140de196946b6 Mon Sep 17 00:00:00 2001 From: sahejkm Date: Thu, 16 May 2024 19:12:24 +0800 Subject: [PATCH 8/9] Fix test --- packages/lexical/src/LexicalUtils.ts | 4 +++- 1 file changed, 3 insertions(+), 1 deletion(-) diff --git a/packages/lexical/src/LexicalUtils.ts b/packages/lexical/src/LexicalUtils.ts index c1410793190..52c5b81ea41 100644 --- a/packages/lexical/src/LexicalUtils.ts +++ b/packages/lexical/src/LexicalUtils.ts @@ -799,7 +799,9 @@ export function isUnderline( metaKey: boolean, ctrlKey: boolean, ): boolean { - return key === 'U' && !altKey && controlOrMeta(metaKey, ctrlKey); + return ( + key.toLowerCase() === 'u' && !altKey && controlOrMeta(metaKey, ctrlKey) + ); } export function isParagraph(key: string, shiftKey: boolean): boolean { From 51ab4128f306ec6f482cc8df1a0d0b3836cf2864 Mon Sep 17 00:00:00 2001 From: sahejkm Date: Fri, 17 May 2024 10:26:41 +0800 Subject: [PATCH 9/9] Fix keycode value from mdn reference --- packages/lexical/src/LexicalEvents.ts | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/packages/lexical/src/LexicalEvents.ts b/packages/lexical/src/LexicalEvents.ts index fb4bca87979..e81ce0a5124 100644 --- a/packages/lexical/src/LexicalEvents.ts +++ b/packages/lexical/src/LexicalEvents.ts @@ -516,7 +516,7 @@ function $canRemoveText( function isPossiblyAndroidKeyPress(timeStamp: number): boolean { return ( - lastKeyCode === 'Dead' && + lastKeyCode === 'MediaLast' && timeStamp < lastKeyDownTimeStamp + ANDROID_COMPOSITION_LATENCY ); }