change site-settings -> usb-device to use cr-action-menu instead of paper-menu

chrome/test/data/webui/settings/usb_devices_tests.js

+// 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 usb_devices. */
+cr.define('usb_devices', function() {
+  function registerTests() {
+    suite('UsbDevices', function() {
+      /**
+       * A dummy usb-devices element created before each test.
+       * @type {UsbDeviceEntry}
+       */
+      var testElement;
+
+      /**
+       * The mock proxy object to use during test.
+       * @type {TestSiteSettingsPrefsBrowserProxy}
+       */
+      var browserProxy = null;
+
+      /**
+       * An example USB device entry list.
+       * @type {!Array<UsbDeviceEntry>}
+       */
+      var deviceList = [
+        {
+          embeddingOrigin: 'device-1-embedding-origin',
+          object: {
+            name: 'device-1',
+            "product-id": 1,
+            "serial-number": "device-1-sn",
+            "vendor-id": 1
+          },
+          objectName: 'device-1',
+          origin: 'device-1-origin',
+          setting: 'device-1-settings',
+          source: 'device-1-source'
+        }, {
+          embeddingOrigin: 'device-2-embedding-origin',
+          object: {
+            name: 'device-2',
+            "product-id": 2,
+            "serial-number": "device-2-sn",
+            "vendor-id": 2
+          },
+          objectName: 'device-2',
+          origin: 'device-2-origin',
+          setting: 'device-2-settings',
+          source: 'device-2-source'
+        }
+      ];
+
+      // Import necessary html before running suite.
+      suiteSetup(function() {
+        return PolymerTest.importHtml(
+           'chrome://md-settings/site_settings/usb_devices.html');
+      });
+
+      setup(function() {
+        browserProxy = new TestSiteSettingsPrefsBrowserProxy();
+        settings.SiteSettingsPrefsBrowserProxyImpl.instance_ = browserProxy;
+      });
+
+      teardown(function() {
+        testElement.remove();
+        testElement = null;
+      });
+
+      /** @return {!Promise} */
+      function initPage() {
+        browserProxy.reset();
+        PolymerTest.clearBody();
+        testElement = document.createElement('usb-devices');
+        document.body.appendChild(testElement);
+        return browserProxy.whenCalled('fetchUsbDevices').then(function(){
+          Polymer.dom.flush();
+        });
+      }
+
+      test('empty devices list', function() {
+        return initPage().then(function(){
+          var listItems = testElement.root.querySelectorAll('.list-item');
+          assertEquals(0, listItems.length);
+        });
+      });
+
+      test('non-empty device list', function() {
+        browserProxy.setUsbDevices(deviceList);
+
+        return initPage().then(function() {
+          var listItems = testElement.root.querySelectorAll('.list-item');
+          assertEquals(deviceList.length, listItems.length);
+        });
+      });
+
+      test('non-empty device list has working menu buttons', function() {
+        browserProxy.setUsbDevices(deviceList);
+
+        return initPage().then(function() {
+          var menuButton = testElement.$$('paper-icon-button');
+          assertTrue(!!menuButton);

[dpapad, 2016/11/10 20:28:36]

Add an assertion here that the dialog is initially closed.

+          MockInteractions.tap(menuButton);
+          var dialog = testElement.$$('dialog[is=cr-action-menu]');
+          assertTrue(dialog.open);
+        });
+      });
+
+      /**
+       * A reusable function to test removing different devices.
+       * @param {!number} indexToRemove index of devices to be removed.
+       * @return {!Promise}
+       */
+      function testRemovalFlow(indexToRemove){
+        /**
+         * Test whether or not clicking remove-button sends the correct
+         * parameters to the browserProxy.removeUsbDevice() function.
+         */
+        var menuButton = testElement.root
+            .querySelectorAll('paper-icon-button')[indexToRemove];

[dpapad, 2016/11/10 20:28:35]

Nit: Per styleguide at
https://google.github.io/styleguide/javascriptguide.xml#Code_formatting, the dot
operator should be in the previous line in such cases (search for "This includes
the dot operator")

+        var removeButton = testElement.$.removeButton;
+        MockInteractions.tap(menuButton);
+        MockInteractions.tap(removeButton);
+        return browserProxy.whenCalled('removeUsbDevice').then(function(args){
+          /**
+           * removeUsbDevice() is expected to be called with arguments as
+           * [origin, embeddingOrigin, object].
+           */
+          assertEquals(deviceList[indexToRemove].origin, args[0]);
+          assertEquals(deviceList[indexToRemove].embeddingOrigin, args[1]);
+          assertEquals(deviceList[indexToRemove].object, args[2]);
+
+          var dialog = testElement.$$('dialog[is=cr-action-menu]');
+          assertFalse(dialog.open);
+        });
+      }
+
+      test('try removing items using remove button', function() {
+        browserProxy.setUsbDevices(deviceList);
+
+        var self = this;

[dpapad, 2016/11/10 20:28:36]

Don't see any uses of self. Maybe remove?

+
+        return initPage().then(function(){
+          return testRemovalFlow(0);
+        }).then(function(){
+          browserProxy.reset();
+          return testRemovalFlow(1);
+        });
+      });
+    });
+  }
+
+  return {
+    registerTests: registerTests,
+  };
+});