From 3d290f3286389ca8797f6a81f7649a770a0e547c Mon Sep 17 00:00:00 2001
From: Grzegorz Ziolkowski <grzegorz@gziolo.pl>
Date: Thu, 8 Aug 2019 14:39:05 +0200
Subject: [PATCH] Accessibility: Move focus back to the modal dialog to More
 Menu when it was used to get there

---
 packages/components/src/dropdown/index.js          |  8 ++++++--
 .../src/components/header/more-menu/index.js       |  2 +-
 .../components/header/options-menu-item/index.js   |  3 +--
 .../keyboard-shortcuts-help-menu-item/index.js     |  3 +--
 .../src/plugins/manage-blocks-menu-item/index.js   | 14 ++++----------
 5 files changed, 13 insertions(+), 17 deletions(-)

diff --git a/packages/components/src/dropdown/index.js b/packages/components/src/dropdown/index.js
index e198b239e32ca..6c5cffa6e5e4b 100644
--- a/packages/components/src/dropdown/index.js
+++ b/packages/components/src/dropdown/index.js
@@ -49,10 +49,14 @@ class Dropdown extends Component {
 	 * Closes the dropdown if a focus leaves the dropdown wrapper. This is
 	 * intentionally distinct from `onClose` since focus loss from the popover
 	 * is expected to occur when using the Dropdown's toggle button, in which
-	 * case the correct behavior is to keep the dropdown closed.
+	 * case the correct behavior is to keep the dropdown closed. The same applies
+	 * in case when focus is moved to the modal dialog.
 	 */
 	closeIfFocusOutside() {
-		if ( ! this.containerRef.current.contains( document.activeElement ) ) {
+		if (
+			! this.containerRef.current.contains( document.activeElement ) &&
+			! document.activeElement.closest( '[role="dialog"]' )
+		) {
 			this.close();
 		}
 	}
diff --git a/packages/edit-post/src/components/header/more-menu/index.js b/packages/edit-post/src/components/header/more-menu/index.js
index 16d9b16afb77a..88a28f50f2a7e 100644
--- a/packages/edit-post/src/components/header/more-menu/index.js
+++ b/packages/edit-post/src/components/header/more-menu/index.js
@@ -29,7 +29,7 @@ const MoreMenu = () => (
 				<PluginMoreMenuGroup.Slot fillProps={ { onClose } } />
 				<ToolsMoreMenuGroup.Slot fillProps={ { onClose } } />
 				<MenuGroup>
-					<OptionsMenuItem onSelect={ onClose } />
+					<OptionsMenuItem />
 				</MenuGroup>
 			</>
 		) }
diff --git a/packages/edit-post/src/components/header/options-menu-item/index.js b/packages/edit-post/src/components/header/options-menu-item/index.js
index 812da4a7e49b3..193dba373936d 100644
--- a/packages/edit-post/src/components/header/options-menu-item/index.js
+++ b/packages/edit-post/src/components/header/options-menu-item/index.js
@@ -5,11 +5,10 @@ import { withDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import { MenuItem } from '@wordpress/components';
 
-export function OptionsMenuItem( { openModal, onSelect } ) {
+export function OptionsMenuItem( { openModal } ) {
 	return (
 		<MenuItem
 			onClick={ () => {
-				onSelect();
 				openModal( 'edit-post/options' );
 			} }
 		>
diff --git a/packages/edit-post/src/plugins/keyboard-shortcuts-help-menu-item/index.js b/packages/edit-post/src/plugins/keyboard-shortcuts-help-menu-item/index.js
index 92587f90f3afa..e066626567252 100644
--- a/packages/edit-post/src/plugins/keyboard-shortcuts-help-menu-item/index.js
+++ b/packages/edit-post/src/plugins/keyboard-shortcuts-help-menu-item/index.js
@@ -6,11 +6,10 @@ import { withDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 import { displayShortcut } from '@wordpress/keycodes';
 
-export function KeyboardShortcutsHelpMenuItem( { openModal, onSelect } ) {
+export function KeyboardShortcutsHelpMenuItem( { openModal } ) {
 	return (
 		<MenuItem
 			onClick={ () => {
-				onSelect();
 				openModal( 'edit-post/keyboard-shortcut-help' );
 			} }
 			shortcut={ displayShortcut.access( 'h' ) }
diff --git a/packages/edit-post/src/plugins/manage-blocks-menu-item/index.js b/packages/edit-post/src/plugins/manage-blocks-menu-item/index.js
index c304d69a3f238..fff70dd41a8da 100644
--- a/packages/edit-post/src/plugins/manage-blocks-menu-item/index.js
+++ b/packages/edit-post/src/plugins/manage-blocks-menu-item/index.js
@@ -1,8 +1,3 @@
-/**
- * External dependencies
- */
-import { flow } from 'lodash';
-
 /**
  * WordPress dependencies
  */
@@ -10,13 +5,12 @@ import { MenuItem } from '@wordpress/components';
 import { withDispatch } from '@wordpress/data';
 import { __ } from '@wordpress/i18n';
 
-export function ManageBlocksMenuItem( { onSelect, openModal } ) {
+export function ManageBlocksMenuItem( { openModal } ) {
 	return (
 		<MenuItem
-			onClick={ flow( [
-				onSelect,
-				() => openModal( 'edit-post/manage-blocks' ),
-			] ) }
+			onClick={ () => {
+				openModal( 'edit-post/manage-blocks' );
+			} }
 		>
 			{ __( 'Block Manager' ) }
 		</MenuItem>