From d27e478ff00f1920bcaf2989f3db7b8ae7336d2a Mon Sep 17 00:00:00 2001 From: Lena Morita Date: Fri, 3 Jun 2022 23:00:35 +0900 Subject: [PATCH] Writing flow: Fix focus trap on certain input types --- .../components/writing-flow/use-arrow-nav.js | 20 +++++++++++++++++-- 1 file changed, 18 insertions(+), 2 deletions(-) diff --git a/packages/block-editor/src/components/writing-flow/use-arrow-nav.js b/packages/block-editor/src/components/writing-flow/use-arrow-nav.js index d02233650c392f..502c1f997d5fbb 100644 --- a/packages/block-editor/src/components/writing-flow/use-arrow-nav.js +++ b/packages/block-editor/src/components/writing-flow/use-arrow-nav.js @@ -43,9 +43,25 @@ export function isNavigationCandidate( element, keyCode, hasModifier ) { return true; } - // Native inputs should not navigate horizontally. const { tagName } = element; - return tagName !== 'INPUT' && tagName !== 'TEXTAREA'; + + // Native inputs should not navigate horizontally, unless they are simple types that don't need left/right arrow keys. + if ( tagName === 'INPUT' ) { + const simpleInputTypes = [ + 'button', + 'checkbox', + 'color', + 'file', + 'image', + 'radio', + 'reset', + 'submit', + ]; + return simpleInputTypes.includes( element.getAttribute( 'type' ) ); + } + + // Native textareas should not navigate horizontally. + return tagName !== 'TEXTAREA'; } /**