From da60a1ca46051a4963ea7b699a1dd69219b645c1 Mon Sep 17 00:00:00 2001 From: Colin Jeanne Date: Mon, 8 Oct 2018 08:39:14 -0700 Subject: [PATCH] Allow Option+Space to be handled on OSX Chrome Currently pressing Option+Space in Chrome on OSX will cause a non breaking space to always be inserted into the editor. This behavior ignores any key bindings that the editor has set. This change moves the logic which adds the non breaking space to after the point that the key binding function has been run in order to give editors a chance to handle this behavior on their own. --- src/component/handlers/edit/editOnKeyDown.js | 25 +++++++++++--------- 1 file changed, 14 insertions(+), 11 deletions(-) diff --git a/src/component/handlers/edit/editOnKeyDown.js b/src/component/handlers/edit/editOnKeyDown.js index ebab158450..362ef125a0 100644 --- a/src/component/handlers/edit/editOnKeyDown.js +++ b/src/component/handlers/edit/editOnKeyDown.js @@ -148,19 +148,9 @@ function editOnKeyDown(editor: DraftEditor, e: SyntheticKeyboardEvent<>): void { } break; case Keys.SPACE: - // Handling for OSX where option + space scrolls. + // Prevent Chrome on OSX behavior where option + space scrolls. if (isChrome && isOptionKeyCommand(e)) { e.preventDefault(); - // Insert a nbsp into the editor. - const contentState = DraftModifier.replaceText( - editorState.getCurrentContent(), - editorState.getSelection(), - '\u00a0', - ); - editor.update( - EditorState.push(editorState, contentState, 'insert-characters'), - ); - return; } } @@ -168,6 +158,19 @@ function editOnKeyDown(editor: DraftEditor, e: SyntheticKeyboardEvent<>): void { // If no command is specified, allow keydown event to continue. if (!command) { + if (keyCode === Keys.SPACE && isChrome && isOptionKeyCommand(e)) { + // The default keydown event has already been prevented in order to stop + // Chrome from scrolling. Insert a nbsp into the editor as OSX would for + // other browsers. + const contentState = DraftModifier.replaceText( + editorState.getCurrentContent(), + editorState.getSelection(), + '\u00a0', + ); + editor.update( + EditorState.push(editorState, contentState, 'insert-characters'), + ); + } return; }