Skip to content

Commit 6a33ccf

Browse files
authored
Fix #6051 Deprecate keycode to code (#6054)
1 parent 1814043 commit 6a33ccf

File tree

5 files changed

+127
-123
lines changed

5 files changed

+127
-123
lines changed

packages/lexical-playground/src/plugins/TestRecorderPlugin/index.tsx

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -95,7 +95,7 @@ const formatStep = (step: Step) => {
9595
};
9696

9797
export function isSelectAll(event: KeyboardEvent): boolean {
98-
return event.keyCode === 65 && (IS_APPLE ? event.metaKey : event.ctrlKey);
98+
return event.code === 'KeyA' && (IS_APPLE ? event.metaKey : event.ctrlKey);
9999
}
100100

101101
// stolen from LexicalSelection-test

packages/lexical-playground/src/plugins/TypingPerfPlugin/index.ts

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -83,9 +83,9 @@ export default function TypingPerfPlugin(): JSX.Element | null {
8383
};
8484

8585
const keyDownHandler = function keyDownHandler(event: KeyboardEvent) {
86-
const keyCode = event.keyCode;
86+
const keyCode = event.code;
8787

88-
if (keyCode === 8 || keyCode === 13) {
88+
if (keyCode === 'Backspace' || keyCode === 'Enter') {
8989
measureEventStart();
9090
}
9191
};

packages/lexical-selection/src/__tests__/utils/index.ts

Lines changed: 10 additions & 6 deletions
Original file line numberDiff line numberDiff line change
@@ -781,8 +781,8 @@ export async function applySelectionInputs(
781781
new KeyboardEvent('keydown', {
782782
bubbles: true,
783783
cancelable: true,
784+
code: 'KeyZ',
784785
ctrlKey: true,
785-
key: 'z',
786786
keyCode: 90,
787787
}),
788788
);
@@ -794,8 +794,8 @@ export async function applySelectionInputs(
794794
new KeyboardEvent('keydown', {
795795
bubbles: true,
796796
cancelable: true,
797+
code: 'KeyZ',
797798
ctrlKey: true,
798-
key: 'z',
799799
keyCode: 90,
800800
shiftKey: true,
801801
}),
@@ -877,15 +877,15 @@ export async function applySelectionInputs(
877877
}
878878
}
879879

880-
export function setAnchorPoint(
880+
export function $setAnchorPoint(
881881
point: Pick<PointType, 'type' | 'offset' | 'key'>,
882882
) {
883883
const selection = $getSelection();
884884

885885
if (!$isRangeSelection(selection)) {
886886
const dummyTextNode = $createTextNode();
887887
dummyTextNode.select();
888-
return setAnchorPoint(point);
888+
return $setAnchorPoint(point);
889889
}
890890

891891
if ($isNodeSelection(selection)) {
@@ -897,16 +897,18 @@ export function setAnchorPoint(
897897
anchor.offset = point.offset;
898898
anchor.key = point.key;
899899
}
900+
/** @deprecated renamed to $setAnchorPoint by @lexical/eslint-plugin rules-of-lexical */
901+
export const setAnchorPoint = $setAnchorPoint;
900902

901-
export function setFocusPoint(
903+
export function $setFocusPoint(
902904
point: Pick<PointType, 'type' | 'offset' | 'key'>,
903905
) {
904906
const selection = $getSelection();
905907

906908
if (!$isRangeSelection(selection)) {
907909
const dummyTextNode = $createTextNode();
908910
dummyTextNode.select();
909-
return setFocusPoint(point);
911+
return $setFocusPoint(point);
910912
}
911913

912914
if ($isNodeSelection(selection)) {
@@ -918,3 +920,5 @@ export function setFocusPoint(
918920
focus.offset = point.offset;
919921
focus.key = point.key;
920922
}
923+
/** @deprecated renamed to $setFocusPoint by @lexical/eslint-plugin rules-of-lexical */
924+
export const setFocusPoint = $setFocusPoint;

packages/lexical/src/LexicalEvents.ts

Lines changed: 37 additions & 37 deletions
Original file line numberDiff line numberDiff line change
@@ -162,7 +162,7 @@ if (CAN_USE_BEFORE_INPUT) {
162162
}
163163

164164
let lastKeyDownTimeStamp = 0;
165-
let lastKeyCode = 0;
165+
let lastKeyCode: null | string = null;
166166
let lastBeforeInputInsertTextTimeStamp = 0;
167167
let unprocessedBeforeInputData: null | string = null;
168168
const rootElementsRegistered = new WeakMap<Document, number>();
@@ -513,7 +513,7 @@ function $canRemoveText(
513513

514514
function isPossiblyAndroidKeyPress(timeStamp: number): boolean {
515515
return (
516-
lastKeyCode === 229 &&
516+
lastKeyCode === 'Delete' &&
517517
timeStamp < lastKeyDownTimeStamp + ANDROID_COMPOSITION_LATENCY
518518
);
519519
}
@@ -817,7 +817,7 @@ function onInput(event: InputEvent, editor: LexicalEditor): void {
817817
// to ensure to disable composition before dispatching the
818818
// insertText command for when changing the sequence for FF.
819819
if (isFirefoxEndingComposition) {
820-
onCompositionEndImpl(editor, data);
820+
$onCompositionEndImpl(editor, data);
821821
isFirefoxEndingComposition = false;
822822
}
823823
const anchor = selection.anchor;
@@ -873,7 +873,7 @@ function onInput(event: InputEvent, editor: LexicalEditor): void {
873873

874874
// onInput always fires after onCompositionEnd for FF.
875875
if (isFirefoxEndingComposition) {
876-
onCompositionEndImpl(editor, data || undefined);
876+
$onCompositionEndImpl(editor, data || undefined);
877877
isFirefoxEndingComposition = false;
878878
}
879879
}
@@ -923,7 +923,7 @@ function onCompositionStart(
923923
});
924924
}
925925

926-
function onCompositionEndImpl(editor: LexicalEditor, data?: string): void {
926+
function $onCompositionEndImpl(editor: LexicalEditor, data?: string): void {
927927
const compositionKey = editor._compositionKey;
928928
$setCompositionKey(null);
929929

@@ -984,108 +984,108 @@ function onCompositionEnd(
984984
isFirefoxEndingComposition = true;
985985
} else {
986986
updateEditor(editor, () => {
987-
onCompositionEndImpl(editor, event.data);
987+
$onCompositionEndImpl(editor, event.data);
988988
});
989989
}
990990
}
991991

992992
function onKeyDown(event: KeyboardEvent, editor: LexicalEditor): void {
993993
lastKeyDownTimeStamp = event.timeStamp;
994-
lastKeyCode = event.keyCode;
994+
lastKeyCode = event.code;
995995
if (editor.isComposing()) {
996996
return;
997997
}
998998

999-
const {keyCode, shiftKey, ctrlKey, metaKey, altKey} = event;
999+
const {code, shiftKey, ctrlKey, metaKey, altKey} = event;
10001000

10011001
if (dispatchCommand(editor, KEY_DOWN_COMMAND, event)) {
10021002
return;
10031003
}
10041004

1005-
if (isMoveForward(keyCode, ctrlKey, altKey, metaKey)) {
1005+
if (isMoveForward(code, ctrlKey, altKey, metaKey)) {
10061006
dispatchCommand(editor, KEY_ARROW_RIGHT_COMMAND, event);
1007-
} else if (isMoveToEnd(keyCode, ctrlKey, shiftKey, altKey, metaKey)) {
1007+
} else if (isMoveToEnd(code, ctrlKey, shiftKey, altKey, metaKey)) {
10081008
dispatchCommand(editor, MOVE_TO_END, event);
1009-
} else if (isMoveBackward(keyCode, ctrlKey, altKey, metaKey)) {
1009+
} else if (isMoveBackward(code, ctrlKey, altKey, metaKey)) {
10101010
dispatchCommand(editor, KEY_ARROW_LEFT_COMMAND, event);
1011-
} else if (isMoveToStart(keyCode, ctrlKey, shiftKey, altKey, metaKey)) {
1011+
} else if (isMoveToStart(code, ctrlKey, shiftKey, altKey, metaKey)) {
10121012
dispatchCommand(editor, MOVE_TO_START, event);
1013-
} else if (isMoveUp(keyCode, ctrlKey, metaKey)) {
1013+
} else if (isMoveUp(code, ctrlKey, metaKey)) {
10141014
dispatchCommand(editor, KEY_ARROW_UP_COMMAND, event);
1015-
} else if (isMoveDown(keyCode, ctrlKey, metaKey)) {
1015+
} else if (isMoveDown(code, ctrlKey, metaKey)) {
10161016
dispatchCommand(editor, KEY_ARROW_DOWN_COMMAND, event);
1017-
} else if (isLineBreak(keyCode, shiftKey)) {
1017+
} else if (isLineBreak(code, shiftKey)) {
10181018
isInsertLineBreak = true;
10191019
dispatchCommand(editor, KEY_ENTER_COMMAND, event);
1020-
} else if (isSpace(keyCode)) {
1020+
} else if (isSpace(code)) {
10211021
dispatchCommand(editor, KEY_SPACE_COMMAND, event);
1022-
} else if (isOpenLineBreak(keyCode, ctrlKey)) {
1022+
} else if (isOpenLineBreak(code, ctrlKey)) {
10231023
event.preventDefault();
10241024
isInsertLineBreak = true;
10251025
dispatchCommand(editor, INSERT_LINE_BREAK_COMMAND, true);
1026-
} else if (isParagraph(keyCode, shiftKey)) {
1026+
} else if (isParagraph(code, shiftKey)) {
10271027
isInsertLineBreak = false;
10281028
dispatchCommand(editor, KEY_ENTER_COMMAND, event);
1029-
} else if (isDeleteBackward(keyCode, altKey, metaKey, ctrlKey)) {
1030-
if (isBackspace(keyCode)) {
1029+
} else if (isDeleteBackward(code, altKey, metaKey, ctrlKey)) {
1030+
if (isBackspace(code)) {
10311031
dispatchCommand(editor, KEY_BACKSPACE_COMMAND, event);
10321032
} else {
10331033
event.preventDefault();
10341034
dispatchCommand(editor, DELETE_CHARACTER_COMMAND, true);
10351035
}
1036-
} else if (isEscape(keyCode)) {
1036+
} else if (isEscape(code)) {
10371037
dispatchCommand(editor, KEY_ESCAPE_COMMAND, event);
1038-
} else if (isDeleteForward(keyCode, ctrlKey, shiftKey, altKey, metaKey)) {
1039-
if (isDelete(keyCode)) {
1038+
} else if (isDeleteForward(code, ctrlKey, shiftKey, altKey, metaKey)) {
1039+
if (isDelete(code)) {
10401040
dispatchCommand(editor, KEY_DELETE_COMMAND, event);
10411041
} else {
10421042
event.preventDefault();
10431043
dispatchCommand(editor, DELETE_CHARACTER_COMMAND, false);
10441044
}
1045-
} else if (isDeleteWordBackward(keyCode, altKey, ctrlKey)) {
1045+
} else if (isDeleteWordBackward(code, altKey, ctrlKey)) {
10461046
event.preventDefault();
10471047
dispatchCommand(editor, DELETE_WORD_COMMAND, true);
1048-
} else if (isDeleteWordForward(keyCode, altKey, ctrlKey)) {
1048+
} else if (isDeleteWordForward(code, altKey, ctrlKey)) {
10491049
event.preventDefault();
10501050
dispatchCommand(editor, DELETE_WORD_COMMAND, false);
1051-
} else if (isDeleteLineBackward(keyCode, metaKey)) {
1051+
} else if (isDeleteLineBackward(code, metaKey)) {
10521052
event.preventDefault();
10531053
dispatchCommand(editor, DELETE_LINE_COMMAND, true);
1054-
} else if (isDeleteLineForward(keyCode, metaKey)) {
1054+
} else if (isDeleteLineForward(code, metaKey)) {
10551055
event.preventDefault();
10561056
dispatchCommand(editor, DELETE_LINE_COMMAND, false);
1057-
} else if (isBold(keyCode, altKey, metaKey, ctrlKey)) {
1057+
} else if (isBold(code, altKey, metaKey, ctrlKey)) {
10581058
event.preventDefault();
10591059
dispatchCommand(editor, FORMAT_TEXT_COMMAND, 'bold');
1060-
} else if (isUnderline(keyCode, altKey, metaKey, ctrlKey)) {
1060+
} else if (isUnderline(code, altKey, metaKey, ctrlKey)) {
10611061
event.preventDefault();
10621062
dispatchCommand(editor, FORMAT_TEXT_COMMAND, 'underline');
1063-
} else if (isItalic(keyCode, altKey, metaKey, ctrlKey)) {
1063+
} else if (isItalic(code, altKey, metaKey, ctrlKey)) {
10641064
event.preventDefault();
10651065
dispatchCommand(editor, FORMAT_TEXT_COMMAND, 'italic');
1066-
} else if (isTab(keyCode, altKey, ctrlKey, metaKey)) {
1066+
} else if (isTab(code, altKey, ctrlKey, metaKey)) {
10671067
dispatchCommand(editor, KEY_TAB_COMMAND, event);
1068-
} else if (isUndo(keyCode, shiftKey, metaKey, ctrlKey)) {
1068+
} else if (isUndo(code, shiftKey, metaKey, ctrlKey)) {
10691069
event.preventDefault();
10701070
dispatchCommand(editor, UNDO_COMMAND, undefined);
1071-
} else if (isRedo(keyCode, shiftKey, metaKey, ctrlKey)) {
1071+
} else if (isRedo(code, shiftKey, metaKey, ctrlKey)) {
10721072
event.preventDefault();
10731073
dispatchCommand(editor, REDO_COMMAND, undefined);
10741074
} else {
10751075
const prevSelection = editor._editorState._selection;
10761076
if ($isNodeSelection(prevSelection)) {
1077-
if (isCopy(keyCode, shiftKey, metaKey, ctrlKey)) {
1077+
if (isCopy(code, shiftKey, metaKey, ctrlKey)) {
10781078
event.preventDefault();
10791079
dispatchCommand(editor, COPY_COMMAND, event);
1080-
} else if (isCut(keyCode, shiftKey, metaKey, ctrlKey)) {
1080+
} else if (isCut(code, shiftKey, metaKey, ctrlKey)) {
10811081
event.preventDefault();
10821082
dispatchCommand(editor, CUT_COMMAND, event);
1083-
} else if (isSelectAll(keyCode, metaKey, ctrlKey)) {
1083+
} else if (isSelectAll(code, metaKey, ctrlKey)) {
10841084
event.preventDefault();
10851085
dispatchCommand(editor, SELECT_ALL_COMMAND, event);
10861086
}
10871087
// FF does it well (no need to override behavior)
1088-
} else if (!IS_FIREFOX && isSelectAll(keyCode, metaKey, ctrlKey)) {
1088+
} else if (!IS_FIREFOX && isSelectAll(code, metaKey, ctrlKey)) {
10891089
event.preventDefault();
10901090
dispatchCommand(editor, SELECT_ALL_COMMAND, event);
10911091
}

0 commit comments

Comments
 (0)