From 74841def16cb642fdacf0feb2a632ed1d63b4c5f Mon Sep 17 00:00:00 2001
From: Chandler Prall <chandler.prall@gmail.com>
Date: Wed, 25 Nov 2020 07:28:06 -0700
Subject: [PATCH] Revert "[EuiPopover] Default to ownFocus (#4228)"

This reverts commit da291a13f1a5ab3bb71620492f7c7acd45c4d629.
---
 CHANGELOG.md                                  |   1 -
 src-docs/src/views/color_picker/containers.js |   1 +
 src-docs/src/views/combo_box/containers.js    |   1 +
 .../src/views/datagrid/control_columns.js     |   6 +-
 src-docs/src/views/datagrid/datagrid.js       |   3 +-
 src-docs/src/views/expression/columns.js      |   2 +
 src-docs/src/views/expression/expression.js   |   2 +
 .../src/views/filter_group/filter_group.js    |   1 +
 .../views/filter_group/filter_group_multi.js  |   1 +
 .../src/views/form_layouts/inline_popover.js  |   2 +
 src-docs/src/views/header/header.js           |   3 +
 src-docs/src/views/header/header_alert.js     |   1 +
 .../views/header/header_elastic_pattern.js    |   3 +
 src-docs/src/views/popover/popover.js         |   1 +
 .../views/popover/popover_anchor_position.js  |  12 ++
 src-docs/src/views/popover/popover_block.js   |   1 +
 .../src/views/popover/popover_container.js    |   1 +
 src-docs/src/views/popover/popover_example.js |   9 +-
 src-docs/src/views/popover/popover_fixed.js   |   1 +
 .../popover/popover_htmlelement_anchor.js     |   1 +
 .../views/popover/popover_panel_class_name.js |   1 +
 .../src/views/popover/popover_with_title.js   |   3 +
 .../popover/popover_with_title_padding.js     |   6 +
 src-docs/src/views/popover/trap_focus.js      |   1 -
 .../collapsed_item_actions.test.tsx.snap      |   2 +-
 .../in_memory_table.test.tsx.snap             | 105 ++++++++++--------
 src/components/datagrid/column_selector.tsx   |   1 +
 src/components/datagrid/column_sorting.tsx    |   2 +
 .../datagrid/data_grid_cell_popover.tsx       |   1 +
 src/components/datagrid/style_selector.tsx    |   1 +
 .../date_popover/date_popover_button.tsx      |   1 +
 .../quick_select_popover.tsx                  |   3 +-
 .../header/header_links/header_links.tsx      |   1 +
 .../__snapshots__/popover.test.tsx.snap       | 103 ++++-------------
 src/components/popover/popover.test.tsx       |   7 +-
 src/components/popover/popover.tsx            |   2 +-
 .../filters/field_value_selection_filter.tsx  |   1 +
 .../table/mobile/table_sort_mobile.tsx        |   1 +
 src/components/tour/tour_step.tsx             |   1 -
 39 files changed, 151 insertions(+), 145 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index b01c4acb162..ff92480b3ee 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -46,7 +46,6 @@
 
 - Added `EuiColorPaletteDisplay` component ([#3865](https://github.com/elastic/eui/pull/3865))
 - Added `initialFocusedItemIndex` support to `EuiContextMenuPanelDescriptor` ([#4223](https://github.com/elastic/eui/pull/4223))
-- Updated the default of the `EuiPopover`s `ownFocus` prop from `false` to `true` ([#4228](https://github.com/elastic/eui/pull/4228))
 - Added `role="alert"` and `aria-live="assertive"` to `EuiForm`'s `EuiCallOut` for the errors ([#4238](https://github.com/elastic/eui/pull/4238))
 - Added `menuDown` and `menuUp` glyphs to `EuiIcon` ([#4244](https://github.com/elastic/eui/pull/4244))
 - Removed spacer after `childrenBetween` in `EuiInMemoryTable` ([#4248](https://github.com/elastic/eui/pull/4248))
diff --git a/src-docs/src/views/color_picker/containers.js b/src-docs/src/views/color_picker/containers.js
index eb654f4933b..7e70312e2bc 100644
--- a/src-docs/src/views/color_picker/containers.js
+++ b/src-docs/src/views/color_picker/containers.js
@@ -98,6 +98,7 @@ export default () => {
       <EuiFormRow label="Unruly focus management">
         <EuiPopover
           id="popover"
+          ownFocus={true}
           button={button}
           isOpen={isPopoverOpen}
           closePopover={closePopover}>
diff --git a/src-docs/src/views/combo_box/containers.js b/src-docs/src/views/combo_box/containers.js
index 135bc3b9845..de12e482761 100644
--- a/src-docs/src/views/combo_box/containers.js
+++ b/src-docs/src/views/combo_box/containers.js
@@ -146,6 +146,7 @@ export default () => {
 
       <EuiPopover
         id="popover"
+        ownFocus
         button={button}
         isOpen={isPopoverOpen}
         closePopover={closePopover}>
diff --git a/src-docs/src/views/datagrid/control_columns.js b/src-docs/src/views/datagrid/control_columns.js
index 2128386fc8b..46efe053ece 100644
--- a/src-docs/src/views/datagrid/control_columns.js
+++ b/src-docs/src/views/datagrid/control_columns.js
@@ -95,7 +95,8 @@ const SelectionButton = () => {
             selected
           </EuiButtonEmpty>
         }
-        closePopover={() => setIsPopoverOpen(false)}>
+        closePopover={() => setIsPopoverOpen(false)}
+        ownFocus={true}>
         <EuiPopoverTitle>
           {selectedRows.size} {selectedRows.size > 1 ? 'items' : 'item'}
         </EuiPopoverTitle>
@@ -264,7 +265,8 @@ const trailingControlColumns = [
                 onClick={() => setIsPopoverOpen(!isPopoverOpen)}
               />
             }
-            closePopover={() => setIsPopoverOpen(false)}>
+            closePopover={() => setIsPopoverOpen(false)}
+            ownFocus={true}>
             <EuiPopoverTitle>Actions</EuiPopoverTitle>
             <div style={{ width: 150 }}>
               <button onClick={() => {}} component="span">
diff --git a/src-docs/src/views/datagrid/datagrid.js b/src-docs/src/views/datagrid/datagrid.js
index 6adf770236e..7024a855e75 100644
--- a/src-docs/src/views/datagrid/datagrid.js
+++ b/src-docs/src/views/datagrid/datagrid.js
@@ -179,7 +179,8 @@ const trailingControlColumns = [
                 onClick={() => setIsPopoverOpen(!isPopoverOpen)}
               />
             }
-            closePopover={() => setIsPopoverOpen(false)}>
+            closePopover={() => setIsPopoverOpen(false)}
+            ownFocus={true}>
             <EuiPopoverTitle>Actions</EuiPopoverTitle>
             <div style={{ width: 150 }}>
               <button onClick={() => {}} component="span">
diff --git a/src-docs/src/views/expression/columns.js b/src-docs/src/views/expression/columns.js
index 4e93a4169b8..b5bed2035bf 100644
--- a/src-docs/src/views/expression/columns.js
+++ b/src-docs/src/views/expression/columns.js
@@ -155,6 +155,7 @@ export default () => {
         }
         isOpen={example1.isOpen}
         closePopover={closeExample1}
+        ownFocus
         display="block"
         panelPaddingSize="s"
         anchorPosition="downLeft">
@@ -175,6 +176,7 @@ export default () => {
         }
         isOpen={example2.isOpen}
         closePopover={closeExample2}
+        ownFocus
         display="block"
         anchorPosition="downLeft">
         {renderPopover2()}
diff --git a/src-docs/src/views/expression/expression.js b/src-docs/src/views/expression/expression.js
index ca7730ee389..25ca938343b 100644
--- a/src-docs/src/views/expression/expression.js
+++ b/src-docs/src/views/expression/expression.js
@@ -143,6 +143,7 @@ export default () => {
           }
           isOpen={example1.isOpen}
           closePopover={closeExample1}
+          ownFocus
           panelPaddingSize="s"
           anchorPosition="downLeft">
           {renderPopover1()}
@@ -163,6 +164,7 @@ export default () => {
           }
           isOpen={example2.isOpen}
           closePopover={closeExample2}
+          ownFocus
           anchorPosition="downLeft">
           {renderPopover2()}
         </EuiPopover>
diff --git a/src-docs/src/views/filter_group/filter_group.js b/src-docs/src/views/filter_group/filter_group.js
index c8596e251a4..423d8d0098c 100644
--- a/src-docs/src/views/filter_group/filter_group.js
+++ b/src-docs/src/views/filter_group/filter_group.js
@@ -71,6 +71,7 @@ export default () => {
       </EuiFilterButton>
       <EuiPopover
         id="popover"
+        ownFocus
         button={button}
         isOpen={isPopoverOpen}
         closePopover={closePopover}
diff --git a/src-docs/src/views/filter_group/filter_group_multi.js b/src-docs/src/views/filter_group/filter_group_multi.js
index 33270402aa1..196493bf3c2 100644
--- a/src-docs/src/views/filter_group/filter_group_multi.js
+++ b/src-docs/src/views/filter_group/filter_group_multi.js
@@ -84,6 +84,7 @@ export default () => {
     <EuiFilterGroup>
       <EuiPopover
         id="popoverExampleMultiSelect"
+        ownFocus
         button={button}
         isOpen={isPopoverOpen}
         closePopover={closePopover}
diff --git a/src-docs/src/views/form_layouts/inline_popover.js b/src-docs/src/views/form_layouts/inline_popover.js
index 4e2345a9980..beb097f276b 100644
--- a/src-docs/src/views/form_layouts/inline_popover.js
+++ b/src-docs/src/views/form_layouts/inline_popover.js
@@ -112,6 +112,7 @@ export default () => {
     <div>
       <EuiPopover
         id="inlineFormPopover"
+        ownFocus
         button={button}
         isOpen={isPopoverOpen}
         closePopover={closePopover}>
@@ -120,6 +121,7 @@ export default () => {
       &emsp;
       <EuiPopover
         id="formPopover"
+        ownFocus
         button={button2}
         isOpen={isPopover2Open}
         closePopover={closePopover2}>
diff --git a/src-docs/src/views/header/header.js b/src-docs/src/views/header/header.js
index 025ffe09093..5ef03b12cb7 100644
--- a/src-docs/src/views/header/header.js
+++ b/src-docs/src/views/header/header.js
@@ -161,6 +161,7 @@ const HeaderUserMenu = () => {
   return (
     <EuiPopover
       id={id}
+      ownFocus
       button={button}
       isOpen={isOpen}
       anchorPosition="downRight"
@@ -285,6 +286,7 @@ const HeaderSpacesMenu = () => {
   return (
     <EuiPopover
       id={id}
+      ownFocus
       button={button}
       isOpen={isOpen}
       anchorPosition="downLeft"
@@ -356,6 +358,7 @@ const HeaderAppMenu = () => {
   return (
     <EuiPopover
       id={popoverId}
+      ownFocus
       button={button}
       isOpen={isOpen}
       anchorPosition="downRight"
diff --git a/src-docs/src/views/header/header_alert.js b/src-docs/src/views/header/header_alert.js
index ccd8fe42321..88e440e08b4 100644
--- a/src-docs/src/views/header/header_alert.js
+++ b/src-docs/src/views/header/header_alert.js
@@ -277,6 +277,7 @@ const HeaderUserMenu = () => {
   return (
     <EuiPopover
       id={id}
+      ownFocus
       repositionOnScroll
       button={button}
       isOpen={isOpen}
diff --git a/src-docs/src/views/header/header_elastic_pattern.js b/src-docs/src/views/header/header_elastic_pattern.js
index 606dae82ba6..3073341095e 100644
--- a/src-docs/src/views/header/header_elastic_pattern.js
+++ b/src-docs/src/views/header/header_elastic_pattern.js
@@ -145,6 +145,7 @@ export default ({ theme }) => {
   const userMenu = (
     <EuiPopover
       id="guideHeaderUserMenuExample"
+      ownFocus
       repositionOnScroll
       button={
         <EuiHeaderSectionItemButton
@@ -180,6 +181,7 @@ export default ({ theme }) => {
   const spacesMenu = (
     <EuiPopover
       id="guideHeaderSpacesMenuExample"
+      ownFocus
       repositionOnScroll
       button={
         <EuiHeaderSectionItemButton
@@ -215,6 +217,7 @@ export default ({ theme }) => {
   const deploymentMenu = (
     <EuiPopover
       id="guideHeaderDeploymentMenuExample"
+      ownFocus
       repositionOnScroll
       button={
         <EuiBadge
diff --git a/src-docs/src/views/popover/popover.js b/src-docs/src/views/popover/popover.js
index b6b0bbd2a9e..ba69af62976 100644
--- a/src-docs/src/views/popover/popover.js
+++ b/src-docs/src/views/popover/popover.js
@@ -17,6 +17,7 @@ export default () => {
 
   return (
     <EuiPopover
+      ownFocus
       button={button}
       isOpen={isPopoverOpen}
       closePopover={closePopover}>
diff --git a/src-docs/src/views/popover/popover_anchor_position.js b/src-docs/src/views/popover/popover_anchor_position.js
index 4942c58ffeb..526c442016e 100644
--- a/src-docs/src/views/popover/popover_anchor_position.js
+++ b/src-docs/src/views/popover/popover_anchor_position.js
@@ -86,6 +86,7 @@ export default () => {
       <EuiFlexGroup>
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -103,6 +104,7 @@ export default () => {
 
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -120,6 +122,7 @@ export default () => {
 
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -141,6 +144,7 @@ export default () => {
       <EuiFlexGroup>
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -158,6 +162,7 @@ export default () => {
 
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -175,6 +180,7 @@ export default () => {
 
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -196,6 +202,7 @@ export default () => {
       <EuiFlexGroup>
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -213,6 +220,7 @@ export default () => {
 
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -230,6 +238,7 @@ export default () => {
 
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -251,6 +260,7 @@ export default () => {
       <EuiFlexGroup>
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -268,6 +278,7 @@ export default () => {
 
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -285,6 +296,7 @@ export default () => {
 
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
diff --git a/src-docs/src/views/popover/popover_block.js b/src-docs/src/views/popover/popover_block.js
index ecb0c21913f..8eaa775f7d3 100644
--- a/src-docs/src/views/popover/popover_block.js
+++ b/src-docs/src/views/popover/popover_block.js
@@ -17,6 +17,7 @@ export default () => {
 
   return (
     <EuiPopover
+      ownFocus
       button={button}
       isOpen={isPopoverOpen}
       closePopover={closePopover}
diff --git a/src-docs/src/views/popover/popover_container.js b/src-docs/src/views/popover/popover_container.js
index 20b2edfe2da..48371f81a90 100644
--- a/src-docs/src/views/popover/popover_container.js
+++ b/src-docs/src/views/popover/popover_container.js
@@ -29,6 +29,7 @@ export default () => {
   return (
     <EuiPanel panelRef={setPanelRef}>
       <EuiPopover
+        ownFocus
         button={button}
         isOpen={isPopoverOpen}
         closePopover={closePopover}
diff --git a/src-docs/src/views/popover/popover_example.js b/src-docs/src/views/popover/popover_example.js
index f5418e77ff9..7d6fef277f2 100644
--- a/src-docs/src/views/popover/popover_example.js
+++ b/src-docs/src/views/popover/popover_example.js
@@ -59,6 +59,7 @@ const inputPopoverSource = require('!!raw-loader!./input_popover');
 const inputPopoverHtml = renderToHtml(PopoverBlock);
 
 const popOverSnippet = `<EuiPopover
+  ownFocus
   button={button}
   isOpen={isPopoverOpen}
   closePopover={closePopover}>
@@ -66,7 +67,6 @@ const popOverSnippet = `<EuiPopover
 </EuiPopover>`;
 
 const trapFocusSnippet = `<EuiPopover
-  ownFocus={false}
   button={button}
   isOpen={isPopoverOpen}
   closePopover={closePopover}>
@@ -74,6 +74,7 @@ const trapFocusSnippet = `<EuiPopover
 </EuiPopover>`;
 
 const popoverAnchorSnippet = `<EuiPopover
+  ownFocus
   button={button}
   isOpen={isPopoverOpen}
   closePopover={closePopover}
@@ -82,6 +83,7 @@ const popoverAnchorSnippet = `<EuiPopover
 </EuiPopover>`;
 
 const popoverWithTitleSnippet = `<EuiPopover
+  ownFocus
   button={button}
   isOpen={isPopoverOpen}
   closePopover={closePopover}>
@@ -91,6 +93,7 @@ const popoverWithTitleSnippet = `<EuiPopover
 </EuiPopover>`;
 
 const popoverPanelClassNameSnippet = `<EuiPopover
+  ownFocus
   button={button}
   isOpen={isPopoverOpen}
   closePopover={closePopover}
@@ -100,6 +103,7 @@ const popoverPanelClassNameSnippet = `<EuiPopover
 </EuiPopover>`;
 
 const popoverWithTitlePaddingSnippet = `<EuiPopover
+  ownFocus
   button={button}
   isOpen={isPopoverOpen}
   closePopover={closePopover}
@@ -110,6 +114,7 @@ const popoverWithTitlePaddingSnippet = `<EuiPopover
 </EuiPopover>`;
 
 const popoverContainerSnippet = `<EuiPopover
+  ownFocus
   button={button}
   isOpen={isPopoverOpen}
   closePopover={closePopover}
@@ -118,6 +123,7 @@ const popoverContainerSnippet = `<EuiPopover
 </EuiPopover>`;
 
 const popoverFixedSnippet = `<EuiPopover
+  ownFocus
   button={button}
   isOpen={isPopoverOpen}
   closePopover={closePopover}
@@ -126,6 +132,7 @@ const popoverFixedSnippet = `<EuiPopover
 </EuiPopover>`;
 
 const popoverBlockSnippet = `<EuiPopover
+  ownFocus
   button={button}
   isOpen={isPopoverOpen}
   closePopover={closePopover}
diff --git a/src-docs/src/views/popover/popover_fixed.js b/src-docs/src/views/popover/popover_fixed.js
index 2fdb020f764..a4c69f16b3b 100644
--- a/src-docs/src/views/popover/popover_fixed.js
+++ b/src-docs/src/views/popover/popover_fixed.js
@@ -28,6 +28,7 @@ export default () => {
       <EuiButton onClick={toggleExample}>Toggle example</EuiButton>
       {isExampleShown && (
         <EuiPopover
+          ownFocus
           button={button}
           isOpen={isPopoverOpen}
           closePopover={closePopover}
diff --git a/src-docs/src/views/popover/popover_htmlelement_anchor.js b/src-docs/src/views/popover/popover_htmlelement_anchor.js
index 8b70e232552..2b9359239bc 100644
--- a/src-docs/src/views/popover/popover_htmlelement_anchor.js
+++ b/src-docs/src/views/popover/popover_htmlelement_anchor.js
@@ -19,6 +19,7 @@ const PopoverApp = (props) => {
 
   return (
     <EuiWrappingPopover
+      ownFocus
       button={props.anchor}
       isOpen={isPopoverOpen}
       closePopover={closePopover}>
diff --git a/src-docs/src/views/popover/popover_panel_class_name.js b/src-docs/src/views/popover/popover_panel_class_name.js
index b5906d7cefd..b2595b1f8b8 100644
--- a/src-docs/src/views/popover/popover_panel_class_name.js
+++ b/src-docs/src/views/popover/popover_panel_class_name.js
@@ -11,6 +11,7 @@ export default () => {
 
   return (
     <EuiPopover
+      ownFocus
       button={
         <EuiButton
           iconType="arrowDown"
diff --git a/src-docs/src/views/popover/popover_with_title.js b/src-docs/src/views/popover/popover_with_title.js
index 4dc2fef7cab..9a0d17b6884 100644
--- a/src-docs/src/views/popover/popover_with_title.js
+++ b/src-docs/src/views/popover/popover_with_title.js
@@ -32,6 +32,7 @@ export default () => {
     <EuiFlexGroup>
       <EuiFlexItem grow={false}>
         <EuiPopover
+          ownFocus
           button={
             <EuiButton
               iconType="arrowDown"
@@ -57,6 +58,7 @@ export default () => {
 
       <EuiFlexItem grow={false}>
         <EuiPopover
+          ownFocus
           button={
             <EuiButton
               iconType="arrowDown"
@@ -86,6 +88,7 @@ export default () => {
 
       <EuiFlexItem grow={false}>
         <EuiPopover
+          ownFocus
           button={
             <EuiButton
               iconType="arrowDown"
diff --git a/src-docs/src/views/popover/popover_with_title_padding.js b/src-docs/src/views/popover/popover_with_title_padding.js
index 4d128a39ee9..9d137cc1757 100644
--- a/src-docs/src/views/popover/popover_with_title_padding.js
+++ b/src-docs/src/views/popover/popover_with_title_padding.js
@@ -49,6 +49,7 @@ export default () => {
         <EuiFlexItem grow={false}>
           <EuiPopover
             panelPaddingSize="s"
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -77,6 +78,7 @@ export default () => {
         <EuiFlexItem grow={false}>
           <EuiPopover
             panelPaddingSize="none"
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -106,6 +108,7 @@ export default () => {
       <EuiFlexGroup wrap={true}>
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -137,6 +140,7 @@ export default () => {
         <EuiFlexItem grow={false}>
           <EuiPopover
             panelPaddingSize="none"
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -168,6 +172,7 @@ export default () => {
       <EuiFlexGroup wrap={true}>
         <EuiFlexItem grow={false}>
           <EuiPopover
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
@@ -197,6 +202,7 @@ export default () => {
         <EuiFlexItem grow={false}>
           <EuiPopover
             panelPaddingSize="none"
+            ownFocus
             button={
               <EuiButton
                 iconType="arrowDown"
diff --git a/src-docs/src/views/popover/trap_focus.js b/src-docs/src/views/popover/trap_focus.js
index c1109085e1b..973943043ee 100644
--- a/src-docs/src/views/popover/trap_focus.js
+++ b/src-docs/src/views/popover/trap_focus.js
@@ -23,7 +23,6 @@ export default () => {
 
   return (
     <EuiPopover
-      ownFocus={false}
       button={button}
       isOpen={isPopoverOpen}
       closePopover={closePopover}
diff --git a/src/components/basic_table/__snapshots__/collapsed_item_actions.test.tsx.snap b/src/components/basic_table/__snapshots__/collapsed_item_actions.test.tsx.snap
index 2b51eb48c4a..0ecfdaf9f61 100644
--- a/src/components/basic_table/__snapshots__/collapsed_item_actions.test.tsx.snap
+++ b/src/components/basic_table/__snapshots__/collapsed_item_actions.test.tsx.snap
@@ -44,7 +44,7 @@ exports[`CollapsedItemActions render with href and _target provided 1`] = `
   hasArrow={true}
   id="id-actions"
   isOpen={true}
-  ownFocus={true}
+  ownFocus={false}
   panelPaddingSize="none"
   popoverRef={[Function]}
 >
diff --git a/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap b/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
index bd2a2fec925..08f28f3d581 100644
--- a/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
+++ b/src/components/basic_table/__snapshots__/in_memory_table.test.tsx.snap
@@ -355,71 +355,80 @@ exports[`EuiInMemoryTable behavior pagination 1`] = `
                       display="inlineBlock"
                       hasArrow={true}
                       isOpen={false}
-                      ownFocus={true}
+                      ownFocus={false}
                       panelPaddingSize="none"
                     >
-                      <div
-                        className="euiPopover euiPopover--anchorUpRight"
+                      <EuiOutsideClickDetector
+                        onOutsideClick={[Function]}
                       >
                         <div
-                          className="euiPopover__anchor"
+                          className="euiPopover euiPopover--anchorUpRight"
+                          onKeyDown={[Function]}
+                          onMouseDown={[Function]}
+                          onMouseUp={[Function]}
+                          onTouchEnd={[Function]}
+                          onTouchStart={[Function]}
                         >
-                          <EuiButtonEmpty
-                            color="text"
-                            data-test-subj="tablePaginationPopoverButton"
-                            iconSide="right"
-                            iconType="arrowDown"
-                            onClick={[Function]}
-                            size="xs"
+                          <div
+                            className="euiPopover__anchor"
                           >
-                            <button
-                              className="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--xSmall"
+                            <EuiButtonEmpty
+                              color="text"
                               data-test-subj="tablePaginationPopoverButton"
+                              iconSide="right"
+                              iconType="arrowDown"
                               onClick={[Function]}
-                              type="button"
+                              size="xs"
                             >
-                              <EuiButtonContent
-                                className="euiButtonEmpty__content"
-                                iconSide="right"
-                                iconType="arrowDown"
-                                textProps={
-                                  Object {
-                                    "className": "euiButtonEmpty__text",
-                                  }
-                                }
+                              <button
+                                className="euiButtonEmpty euiButtonEmpty--text euiButtonEmpty--xSmall"
+                                data-test-subj="tablePaginationPopoverButton"
+                                onClick={[Function]}
+                                type="button"
                               >
-                                <span
-                                  className="euiButtonContent euiButtonContent--iconRight euiButtonEmpty__content"
+                                <EuiButtonContent
+                                  className="euiButtonEmpty__content"
+                                  iconSide="right"
+                                  iconType="arrowDown"
+                                  textProps={
+                                    Object {
+                                      "className": "euiButtonEmpty__text",
+                                    }
+                                  }
                                 >
-                                  <EuiIcon
-                                    className="euiButtonContent__icon"
-                                    size="m"
-                                    type="arrowDown"
+                                  <span
+                                    className="euiButtonContent euiButtonContent--iconRight euiButtonEmpty__content"
                                   >
-                                    <span
+                                    <EuiIcon
                                       className="euiButtonContent__icon"
-                                      data-euiicon-type="arrowDown"
                                       size="m"
-                                    />
-                                  </EuiIcon>
-                                  <span
-                                    className="euiButtonEmpty__text"
-                                  >
-                                    <EuiI18n
-                                      default="Rows per page"
-                                      token="euiTablePagination.rowsPerPage"
+                                      type="arrowDown"
                                     >
-                                      Rows per page
-                                    </EuiI18n>
-                                    : 
-                                    2
+                                      <span
+                                        className="euiButtonContent__icon"
+                                        data-euiicon-type="arrowDown"
+                                        size="m"
+                                      />
+                                    </EuiIcon>
+                                    <span
+                                      className="euiButtonEmpty__text"
+                                    >
+                                      <EuiI18n
+                                        default="Rows per page"
+                                        token="euiTablePagination.rowsPerPage"
+                                      >
+                                        Rows per page
+                                      </EuiI18n>
+                                      : 
+                                      2
+                                    </span>
                                   </span>
-                                </span>
-                              </EuiButtonContent>
-                            </button>
-                          </EuiButtonEmpty>
+                                </EuiButtonContent>
+                              </button>
+                            </EuiButtonEmpty>
+                          </div>
                         </div>
-                      </div>
+                      </EuiOutsideClickDetector>
                     </EuiPopover>
                   </div>
                 </EuiFlexItem>
diff --git a/src/components/datagrid/column_selector.tsx b/src/components/datagrid/column_selector.tsx
index 3822478aff1..5e134477fe4 100644
--- a/src/components/datagrid/column_selector.tsx
+++ b/src/components/datagrid/column_selector.tsx
@@ -150,6 +150,7 @@ export const useDataGridColumnSelector = (
       isOpen={isOpen}
       closePopover={() => setIsOpen(false)}
       anchorPosition="downLeft"
+      ownFocus
       panelPaddingSize="s"
       panelClassName="euiDataGridColumnSelectorPopover"
       button={
diff --git a/src/components/datagrid/column_sorting.tsx b/src/components/datagrid/column_sorting.tsx
index 890d1562d61..542e057181f 100644
--- a/src/components/datagrid/column_sorting.tsx
+++ b/src/components/datagrid/column_sorting.tsx
@@ -141,6 +141,7 @@ export const useDataGridColumnSorting = (
       isOpen={isOpen}
       closePopover={() => setIsOpen(false)}
       anchorPosition="downLeft"
+      ownFocus
       panelPaddingSize="s"
       panelClassName="euiDataGridColumnSortingPopover"
       button={
@@ -211,6 +212,7 @@ export const useDataGridColumnSorting = (
                   isOpen={avilableColumnsisOpen}
                   closePopover={() => setAvailableColumnsIsOpen(false)}
                   anchorPosition="downLeft"
+                  ownFocus
                   panelPaddingSize="none"
                   button={
                     <EuiButtonEmpty
diff --git a/src/components/datagrid/data_grid_cell_popover.tsx b/src/components/datagrid/data_grid_cell_popover.tsx
index d2bd42a6a67..288ae7dce8f 100644
--- a/src/components/datagrid/data_grid_cell_popover.tsx
+++ b/src/components/datagrid/data_grid_cell_popover.tsx
@@ -68,6 +68,7 @@ export function EuiDataGridCellPopover({
       button={anchorContent}
       isOpen={popoverIsOpen}
       panelRef={panelRefFn}
+      ownFocus
       panelClassName="euiDataGridRowCell__popover"
       panelPaddingSize="s"
       zIndex={8001}
diff --git a/src/components/datagrid/style_selector.tsx b/src/components/datagrid/style_selector.tsx
index 5a836b998f6..0335273debd 100644
--- a/src/components/datagrid/style_selector.tsx
+++ b/src/components/datagrid/style_selector.tsx
@@ -79,6 +79,7 @@ export const useDataGridStyleSelector = (
       isOpen={isOpen}
       closePopover={() => setIsOpen(false)}
       anchorPosition="downCenter"
+      ownFocus
       panelPaddingSize="s"
       panelClassName="euiDataGridColumnSelectorPopover"
       button={
diff --git a/src/components/date_picker/super_date_picker/date_popover/date_popover_button.tsx b/src/components/date_picker/super_date_picker/date_popover/date_popover_button.tsx
index 4da6acccebd..918775d6a23 100644
--- a/src/components/date_picker/super_date_picker/date_popover/date_popover_button.tsx
+++ b/src/components/date_picker/super_date_picker/date_popover/date_popover_button.tsx
@@ -112,6 +112,7 @@ export const EuiDatePopoverButton: FunctionComponent<EuiDatePopoverButtonProps>
       anchorPosition={position === 'start' ? 'downLeft' : 'downRight'}
       display="block"
       panelPaddingSize="none"
+      ownFocus
       {...rest}>
       <EuiDatePopoverContent
         value={value}
diff --git a/src/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.tsx b/src/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.tsx
index 4d8e97f2a72..09ba63afd5a 100644
--- a/src/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.tsx
+++ b/src/components/date_picker/super_date_picker/quick_select_popover/quick_select_popover.tsx
@@ -187,7 +187,8 @@ export class EuiQuickSelectPopover extends Component<
         isOpen={isOpen}
         closePopover={this.closePopover}
         anchorPosition="downLeft"
-        anchorClassName="euiQuickSelectPopover__anchor">
+        anchorClassName="euiQuickSelectPopover__anchor"
+        ownFocus>
         <div
           className="euiQuickSelectPopover__content"
           data-test-subj="superDatePickerQuickMenu">
diff --git a/src/components/header/header_links/header_links.tsx b/src/components/header/header_links/header_links.tsx
index 39fab32d0a1..6899c3fa391 100644
--- a/src/components/header/header_links/header_links.tsx
+++ b/src/components/header/header_links/header_links.tsx
@@ -134,6 +134,7 @@ export const EuiHeaderLinks: FunctionComponent<EuiHeaderLinksProps> = ({
 
           <EuiShowFor sizes={popoverBreakpoints}>
             <EuiPopover
+              ownFocus
               button={button}
               isOpen={mobileMenuIsOpen}
               anchorPosition="downRight"
diff --git a/src/components/popover/__snapshots__/popover.test.tsx.snap b/src/components/popover/__snapshots__/popover.test.tsx.snap
index 85af936f801..8a913d74ba8 100644
--- a/src/components/popover/__snapshots__/popover.test.tsx.snap
+++ b/src/components/popover/__snapshots__/popover.test.tsx.snap
@@ -105,14 +105,11 @@ exports[`EuiPopover props arrowChildren is rendered 1`] = `
       data-focus-lock-disabled="disabled"
     >
       <div
-        aria-describedby="generated-id"
-        aria-live="off"
+        aria-live="assertive"
         aria-modal="true"
         class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPopover__panel euiPopover__panel--bottom euiPopover__panel-isOpen"
-        data-autofocus="true"
         role="dialog"
         style="top: 16px; left: -22px; z-index: 2000;"
-        tabindex="0"
       >
         <div
           class="euiPopover__panelArrow euiPopover__panelArrow--bottom"
@@ -120,12 +117,6 @@ exports[`EuiPopover props arrowChildren is rendered 1`] = `
         >
           <span />
         </div>
-        <p
-          class="euiScreenReaderOnly"
-          id="generated-id"
-        >
-          You are in a dialog. To close this dialog, hit escape.
-        </p>
         <div />
       </div>
     </div>
@@ -163,25 +154,16 @@ exports[`EuiPopover props buffer 1`] = `
       data-focus-lock-disabled="disabled"
     >
       <div
-        aria-describedby="generated-id"
-        aria-live="off"
+        aria-live="assertive"
         aria-modal="true"
         class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPopover__panel euiPopover__panel--bottom euiPopover__panel-isOpen"
-        data-autofocus="true"
         role="dialog"
         style="top: 16px; left: -22px; z-index: 2000;"
-        tabindex="0"
       >
         <div
           class="euiPopover__panelArrow euiPopover__panelArrow--bottom"
           style="left: 10px; top: 0px;"
         />
-        <p
-          class="euiScreenReaderOnly"
-          id="generated-id"
-        >
-          You are in a dialog. To close this dialog, hit escape.
-        </p>
         <div />
       </div>
     </div>
@@ -245,25 +227,16 @@ exports[`EuiPopover props isOpen renders true 1`] = `
       data-focus-lock-disabled="disabled"
     >
       <div
-        aria-describedby="generated-id"
-        aria-live="off"
+        aria-live="assertive"
         aria-modal="true"
         class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPopover__panel euiPopover__panel--bottom euiPopover__panel-isOpen"
-        data-autofocus="true"
         role="dialog"
         style="top: 16px; left: -22px; z-index: 2000;"
-        tabindex="0"
       >
         <div
           class="euiPopover__panelArrow euiPopover__panelArrow--bottom"
           style="left: 10px; top: 0px;"
         />
-        <p
-          class="euiScreenReaderOnly"
-          id="generated-id"
-        >
-          You are in a dialog. To close this dialog, hit escape.
-        </p>
         <div />
       </div>
     </div>
@@ -302,25 +275,16 @@ exports[`EuiPopover props offset with arrow 1`] = `
       data-focus-lock-disabled="disabled"
     >
       <div
-        aria-describedby="generated-id"
-        aria-live="off"
+        aria-live="assertive"
         aria-modal="true"
         class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPopover__panel euiPopover__panel--bottom euiPopover__panel-isOpen"
-        data-autofocus="true"
         role="dialog"
         style="top: 26px; left: -22px; z-index: 2000;"
-        tabindex="0"
       >
         <div
           class="euiPopover__panelArrow euiPopover__panelArrow--bottom"
           style="left: 10px; top: 0px;"
         />
-        <p
-          class="euiScreenReaderOnly"
-          id="generated-id"
-        >
-          You are in a dialog. To close this dialog, hit escape.
-        </p>
         <div />
       </div>
     </div>
@@ -359,24 +323,15 @@ exports[`EuiPopover props offset without arrow 1`] = `
       data-focus-lock-disabled="disabled"
     >
       <div
-        aria-describedby="generated-id"
-        aria-live="off"
+        aria-live="assertive"
         aria-modal="true"
         class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPopover__panel euiPopover__panel--bottom euiPopover__panel-isOpen euiPopover__panel-noArrow"
-        data-autofocus="true"
         role="dialog"
         style="top: 18px; left: -22px; z-index: 2000;"
-        tabindex="0"
       >
         <div
           class="euiPopover__panelArrow euiPopover__panelArrow--bottom"
         />
-        <p
-          class="euiScreenReaderOnly"
-          id="generated-id"
-        >
-          You are in a dialog. To close this dialog, hit escape.
-        </p>
         <div />
       </div>
     </div>
@@ -389,7 +344,7 @@ exports[`EuiPopover props offset without arrow 1`] = `
 </div>
 `;
 
-exports[`EuiPopover props ownFocus defaults to true 1`] = `
+exports[`EuiPopover props ownFocus defaults to false 1`] = `
 <div>
   <div
     class="euiPopover euiPopover--anchorDownCenter euiPopover-isOpen"
@@ -414,25 +369,16 @@ exports[`EuiPopover props ownFocus defaults to true 1`] = `
       data-focus-lock-disabled="disabled"
     >
       <div
-        aria-describedby="generated-id"
-        aria-live="off"
+        aria-live="assertive"
         aria-modal="true"
         class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPopover__panel euiPopover__panel--bottom euiPopover__panel-isOpen"
-        data-autofocus="true"
         role="dialog"
         style="top: 16px; left: -22px; z-index: 2000;"
-        tabindex="0"
       >
         <div
           class="euiPopover__panelArrow euiPopover__panelArrow--bottom"
           style="left: 10px; top: 0px;"
         />
-        <p
-          class="euiScreenReaderOnly"
-          id="generated-id"
-        >
-          You are in a dialog. To close this dialog, hit escape.
-        </p>
         <div />
       </div>
     </div>
@@ -445,7 +391,7 @@ exports[`EuiPopover props ownFocus defaults to true 1`] = `
 </div>
 `;
 
-exports[`EuiPopover props ownFocus renders false 1`] = `
+exports[`EuiPopover props ownFocus renders true 1`] = `
 <div>
   <div
     class="euiPopover euiPopover--anchorDownCenter euiPopover-isOpen"
@@ -470,16 +416,25 @@ exports[`EuiPopover props ownFocus renders false 1`] = `
       data-focus-lock-disabled="disabled"
     >
       <div
-        aria-live="assertive"
+        aria-describedby="generated-id"
+        aria-live="off"
         aria-modal="true"
         class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPopover__panel euiPopover__panel--bottom euiPopover__panel-isOpen"
+        data-autofocus="true"
         role="dialog"
         style="top: 16px; left: -22px; z-index: 2000;"
+        tabindex="0"
       >
         <div
           class="euiPopover__panelArrow euiPopover__panelArrow--bottom"
           style="left: 10px; top: 0px;"
         />
+        <p
+          class="euiScreenReaderOnly"
+          id="generated-id"
+        >
+          You are in a dialog. To close this dialog, hit escape.
+        </p>
         <div />
       </div>
     </div>
@@ -517,25 +472,16 @@ exports[`EuiPopover props panelClassName is rendered 1`] = `
       data-focus-lock-disabled="disabled"
     >
       <div
-        aria-describedby="generated-id"
-        aria-live="off"
+        aria-live="assertive"
         aria-modal="true"
         class="euiPanel euiPanel--paddingMedium euiPanel--borderRadiusMedium euiPanel--plain euiPopover__panel euiPopover__panel--bottom euiPopover__panel-isOpen test"
-        data-autofocus="true"
         role="dialog"
         style="top: 16px; left: -22px; z-index: 2000;"
-        tabindex="0"
       >
         <div
           class="euiPopover__panelArrow euiPopover__panelArrow--bottom"
           style="left: 10px; top: 0px;"
         />
-        <p
-          class="euiScreenReaderOnly"
-          id="generated-id"
-        >
-          You are in a dialog. To close this dialog, hit escape.
-        </p>
         <div />
       </div>
     </div>
@@ -573,25 +519,16 @@ exports[`EuiPopover props panelPaddingSize is rendered 1`] = `
       data-focus-lock-disabled="disabled"
     >
       <div
-        aria-describedby="generated-id"
-        aria-live="off"
+        aria-live="assertive"
         aria-modal="true"
         class="euiPanel euiPanel--paddingSmall euiPanel--borderRadiusMedium euiPanel--plain euiPopover__panel euiPopover__panel--bottom euiPopover__panel-isOpen"
-        data-autofocus="true"
         role="dialog"
         style="top: 16px; left: -22px; z-index: 2000;"
-        tabindex="0"
       >
         <div
           class="euiPopover__panelArrow euiPopover__panelArrow--bottom"
           style="left: 10px; top: 0px;"
         />
-        <p
-          class="euiScreenReaderOnly"
-          id="generated-id"
-        >
-          You are in a dialog. To close this dialog, hit escape.
-        </p>
         <div />
       </div>
     </div>
diff --git a/src/components/popover/popover.test.tsx b/src/components/popover/popover.test.tsx
index 218a3b4d472..e1542a96f52 100644
--- a/src/components/popover/popover.test.tsx
+++ b/src/components/popover/popover.test.tsx
@@ -98,7 +98,6 @@ describe('EuiPopover', () => {
 
         const component = mount(
           <EuiPopover
-            ownFocus={false}
             id={getId()}
             button={<button />}
             closePopover={closePopoverHandler}
@@ -199,7 +198,7 @@ describe('EuiPopover', () => {
     });
 
     describe('ownFocus', () => {
-      test('defaults to true', () => {
+      test('defaults to false', () => {
         const component = mount(
           <div>
             <EuiPopover
@@ -214,13 +213,13 @@ describe('EuiPopover', () => {
         expect(component.render()).toMatchSnapshot();
       });
 
-      test('renders false', () => {
+      test('renders true', () => {
         const component = mount(
           <div>
             <EuiPopover
-              ownFocus={false}
               id={getId()}
               isOpen
+              ownFocus
               button={<button />}
               closePopover={() => {}}
             />
diff --git a/src/components/popover/popover.tsx b/src/components/popover/popover.tsx
index 74f1ca497cf..10d9261df40 100644
--- a/src/components/popover/popover.tsx
+++ b/src/components/popover/popover.tsx
@@ -299,7 +299,7 @@ type PropsWithDefaults = Props & {
 export class EuiPopover extends Component<Props, State> {
   static defaultProps: Partial<PropsWithDefaults> = {
     isOpen: false,
-    ownFocus: true,
+    ownFocus: false,
     anchorPosition: 'downCenter',
     panelPaddingSize: 'm',
     hasArrow: true,
diff --git a/src/components/search_bar/filters/field_value_selection_filter.tsx b/src/components/search_bar/filters/field_value_selection_filter.tsx
index b1ef26ba4d1..06905a5e651 100644
--- a/src/components/search_bar/filters/field_value_selection_filter.tsx
+++ b/src/components/search_bar/filters/field_value_selection_filter.tsx
@@ -366,6 +366,7 @@ export class FieldValueSelectionFilter extends Component<
     return (
       <EuiPopover
         id={`${config.type}_${index}`}
+        ownFocus
         button={button}
         isOpen={this.state.popoverOpen}
         closePopover={this.closePopover.bind(this)}
diff --git a/src/components/table/mobile/table_sort_mobile.tsx b/src/components/table/mobile/table_sort_mobile.tsx
index afd829368db..653b43674b9 100644
--- a/src/components/table/mobile/table_sort_mobile.tsx
+++ b/src/components/table/mobile/table_sort_mobile.tsx
@@ -82,6 +82,7 @@ export class EuiTableSortMobile extends Component<
 
     const mobileSortPopover = (
       <EuiPopover
+        ownFocus
         button={mobileSortButton}
         isOpen={this.state.isPopoverOpen}
         closePopover={this.closePopover}
diff --git a/src/components/tour/tour_step.tsx b/src/components/tour/tour_step.tsx
index 424ed391abe..96707fba7b4 100644
--- a/src/components/tour/tour_step.tsx
+++ b/src/components/tour/tour_step.tsx
@@ -213,7 +213,6 @@ export const EuiTourStep: FunctionComponent<EuiTourStepProps> = ({
       button={children}
       closePopover={closePopover}
       isOpen={isStepOpen}
-      ownFocus={false}
       panelClassName={classes}
       panelStyle={newStyle || style}
       offset={hasBeacon ? 10 : 0}