MD WebUI: Reimplement cr-shared-menu using iron-dropdown.

chrome/test/data/webui/cr_elements/cr_shared_menu_tests.js

Index: chrome/test/data/webui/cr_elements/cr_shared_menu_tests.js
diff --git a/chrome/test/data/webui/cr_elements/cr_shared_menu_tests.js b/chrome/test/data/webui/cr_elements/cr_shared_menu_tests.js
new file mode 100644
index 0000000000000000000000000000000000000000..03e1d36172428675c3e469354141de37b267aaed
--- /dev/null
+++ b/chrome/test/data/webui/cr_elements/cr_shared_menu_tests.js
@@ -0,0 +1,128 @@
+// Copyright 2016 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+/** @fileoverview Suite of tests for cr-shared-menu. */
+cr.define('cr_shared_menu', function() {
+  function registerTests() {
+    suite('cr-shared-menu', function() {
+      var menu;
+
+      var button;
+
+      var item1;
+      var item2;
+      var item3;
+
+      function afterOpen(callback) {
+        menu.addEventListener('iron-overlay-opened', callback);
+      }
+
+      suiteSetup(function() {
+        return Promise.all([
+          PolymerTest.importHtml(
+              'chrome://resources/polymer/v1_0/paper-item/paper-item.html'),
+          PolymerTest.importHtml(
+              'chrome://resources/cr_elements/icons.html'),
+        ]);
+      });
+
+      setup(function() {
+        PolymerTest.clearBody();
+        // Basic wiring to set up a menu which opens when a button is pressed.
+        menu = document.createElement('cr-shared-menu');
+        menu.$$('#dropdown').noAnimations = true;
+
+        item1 = document.createElement('paper-item');
+        menu.appendChild(item1);
+        item2 = document.createElement('paper-item');
+        menu.appendChild(item2);
+        item3 = document.createElement('paper-item');
+        menu.appendChild(item3);
+
+        button = document.createElement('button');
+        button.addEventListener('tap', function() {
+          menu.toggleMenu(button, {});
+        });
+
+        document.body.appendChild(menu);
+        document.body.appendChild(button);
+      });
+
+      test('opening and closing menu', function(done) {
+        MockInteractions.tap(button);
+        assertTrue(menu.menuOpen);
+
+        afterOpen(function() {
+          // Using tap to close the menu requires that the iron-overlay-behavior
+          // has finished initializing, which happens asynchronously after
+          // opening.

[calamity, 2016/07/06 06:49:15]

Does this mean this test could flake? Or is the behavior initialized by the time
it's open?

[tsergeant, 2016/07/06 07:16:29]

Yeah, it's done between when you tap the button and when iron-overlay-opened is
fired. I've updated the comment to reflect this.

+          MockInteractions.tap(document.body);
+          assertFalse(menu.menuOpen);
+
+          MockInteractions.tap(button);
+          assertTrue(menu.menuOpen);
+
+          // Pressing escape should close the menu.
+          MockInteractions.pressAndReleaseKeyOn(menu, 27);
+          assertTrue(menu.menuOpen);
+          done();
+        });
+      });
+
+      test('refocus button on close', function(done) {
+        button.focus();
+        MockInteractions.tap(button);
+
+        afterOpen(function() {
+          assertTrue(menu.menuOpen);
+          // Focus is applied asynchronously after the menu is opened.
+          assertEquals(item1, menu.shadowRoot.activeElement);
+
+          menu.closeMenu();
+          assertFalse(menu.menuOpen);
+
+          // Button should regain focus after closing the menu.
+          assertEquals(button, document.activeElement);
+
+          done();
+        });
+      });
+
+      test('closeMenuNoRefocus does not refocus button', function(done) {
+        button.focus();
+        MockInteractions.tap(button);
+
+        afterOpen(function() {
+          menu.closeMenuNoRefocus();
+          assertNotEquals(button, document.activeElement);
+
+          done();
+        });
+      });
+
+      test('focus is trapped inside the menu', function(done) {
+        button.focus();
+        MockInteractions.tap(button);
+
+        afterOpen(function() {
+          // Simulate shift-tab on first element.
+          assertEquals(item1, menu.shadowRoot.activeElement);
+          MockInteractions.pressAndReleaseKeyOn(item1, 9, ['shift']);
+          assertEquals(item3, menu.shadowRoot.activeElement);
+
+          // Simulate tab on last element.
+          MockInteractions.pressAndReleaseKeyOn(item3, 9);
+          assertEquals(item1, menu.shadowRoot.activeElement);
+
+          done();
+        });
+      });
+
+    });
+  }
+
+  return {
+    registerTests: registerTests,
+  };
+});