From 4ae760c4ee809bea53e175d3a4b8c96fcf2a2bcd Mon Sep 17 00:00:00 2001
From: Ryan Keairns <rkeairns@chef.io>
Date: Wed, 27 Mar 2019 14:24:06 -0500
Subject: [PATCH] close drawer when a link is clicked (#1773)

---
 CHANGELOG.md                            |  2 +-
 src/components/nav_drawer/nav_drawer.js | 18 +++++++++++++++++-
 2 files changed, 18 insertions(+), 2 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 86b279999c9..7a5938e1a3c 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,6 +1,6 @@
 ## [`master`](https://github.com/elastic/eui/tree/master)
 
-No public interface changes since `9.6.0`.
+- Changed `EuiNavDrawer` to close on any link click ([#1773](https://github.com/elastic/eui/pull/1773))
 
 ## [`9.6.0`](https://github.com/elastic/eui/tree/v9.6.0)
 
diff --git a/src/components/nav_drawer/nav_drawer.js b/src/components/nav_drawer/nav_drawer.js
index 1465bac1b4f..e6cdbc16541 100644
--- a/src/components/nav_drawer/nav_drawer.js
+++ b/src/components/nav_drawer/nav_drawer.js
@@ -124,6 +124,22 @@ export class EuiNavDrawer extends Component {
     this.collapseFlyout();
   }
 
+  handleDrawerMenuClick = e => {
+    // walk up e.target until either:
+    // 1. a[href] - close the menu
+    // 2. document.body - do nothing
+
+    let element = e.target;
+    while (element !== undefined && element !== document.body && (element.tagName !== 'A' || element.getAttribute('href') === undefined)) {
+      element = element.parentElement;
+    }
+
+    if (element !== document.body) {
+      // this is an anchor with an href
+      this.closeBoth();
+    }
+  }
+
   render() {
     const {
       children,
@@ -214,7 +230,7 @@ export class EuiNavDrawer extends Component {
           {...rest}
         >
           <EuiFlexItem grow={false}>
-            <div id="navDrawerMenu" className={menuClasses}>
+            <div id="navDrawerMenu" className={menuClasses} onClick={this.handleDrawerMenuClick}>
               {/* Put expand button first so it's first in tab order then on toggle starts the tabbing of the items from the top */}
               {/* TODO: Add a "skip navigation" keyboard only button */}
               {footerContent}