search

PolymerElements / paper-menu-button

An element that allows composing a trigger and content as a dropdown menu.
https://www.webcomponents.org/element/PolymerElements/paper-menu-button
24 stars 46 forks source link

Paper-menu-button dropdown content does not disappear when clicking a paper-menu item #115

Open shahanstudios opened 7 years ago

shahanstudios commented 7 years ago

Description

If you use a paper-menu-button to open a related popup, then select a menu-item inside of a paper-menu, the popup does not disappear. This happens independently of whether the paper-menu-button resides inside of a paper-menu structure or if the button is outside of the paper-menu structure.

Expected outcome

The popup should disappear after clicking a menu item.

Actual outcome

The popup does not disappear after clicking a menu item.

Live Demo

http://jsbin.com/heliyay/edit?html,output

Steps to reproduce

  1. Run the live demo
  2. Open the menu
  3. Click the menu icon button
  4. Note that the popup is displayed
  5. Click any menu item
  6. Note that the popup is still displayed
  7. Click anywhere else other than a menu item.
  8. Note that the popup has disappeared.

Browsers Affected

rene-lindner-isw commented 7 years ago

Got the same issue. But it looks like this is fixed in the 2.0 preview.

terrywarwar commented 7 years ago

I'm getting a similar issue with 2.0-preview when paper-menu-button is inside a dom-repeat. The menu doesn't close when item is selected.

terrywarwar commented 7 years ago

Just tried it without a dom-repeat and still doesn't close.


<html>
<head>
  <meta charset="utf-8">
  <title>Menu Test</title>

  <meta name="viewport" content="width=device-width, initial-scale=1">
      <script src="bower_components/webcomponentsjs/webcomponents-lite.js"></script>
  <link href="bower_components/paper-menu-button/paper-menu-button.html" rel="import">
   <link href="bower_components/paper-item/paper-item.html" rel="import">
   <link href="bower_components/iron-icons/iron-icons.html" rel="import">
   <link href="bower_components/paper-icon-button/paper-icon-button.html" rel="import">
   <link rel="import" href="bower_components/neon-animation/web-animations.html">
</head>
<body>
    <paper-menu-button close-on-activate>
  <paper-icon-button icon="menu" slot="dropdown-trigger"></paper-icon-button>
  <paper-listbox slot="dropdown-content">
    <paper-item>Share</paper-item>
    <paper-item>Settings</paper-item>
    <paper-item>Help</paper-item>
  </paper-listbox>
</paper-menu-button>

</body>
</html>```
leonoverweel commented 6 years ago

Any progress on this? I'm getting the issue too.