[]

src/components/common/Topbar.js

@@ -40,7 +40,16 @@ class Topbar extends Component {
      */
     handleOpenMenu = e => {
         this.setState({
-            anchorEl: e.target
+            anchorEl: e.currentTarget
+        })
+    }
+
+    /**
+     * 
+     */
+    handleMenuClose = e => {
+        this.setState({
+            anchorEl: null
         })
     }
 
@@ -61,7 +70,6 @@ class Topbar extends Component {
     render() {
         const { username, classes } = this.props
         const { anchorEl } = this.state
-        const openMenu = Boolean(anchorEl)
 
         return (
             <AppBar position="absolute" className={classes.root}>
@@ -73,18 +81,28 @@ class Topbar extends Component {
                         <Avatar className={classes.avatar}>
                             <UserIcon />
                         </Avatar>
-                        <Button color="inherit" onClick={this.handleOpenMenu}>{username}</Button>
-                        <Menu 
-                            open={openMenu} 
+                        <Button 
+                            aria-owns={anchorEl ? "menu-appbar" : null} 
+                            aria-haspopup="true" 
+                            color="inherit" 
+                            onClick={this.handleOpenMenu}
+                        >
+                            {username}
+                        </Button>
+                        <Menu
+                            id="menu-appbar"
+                            open={Boolean(anchorEl)} 
                             anchorEl={anchorEl}
                             anchorOrigin={{
-                                vertical: 'top',
-                                horizontal: 'right',
+                                vertical: "top",
+                                horizontal: "right",
                             }}
                             transformOrigin={{
-                                vertical: 'top',
-                                horizontal: 'right',
-                            }}>
+                                vertical: "top",
+                                horizontal: "right",
+                            }}
+                            onClose={this.handleMenuClose}
+                        >
                             <MenuItem onClick={this.handleSessionClose}>Cerrar sesión</MenuItem>
                         </Menu>
                     </div>