Hide the DIV containing password import/export buttons

chrome/browser/resources/options/password_manager.js

 // Copyright (c) 2012 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.
 
 cr.define('options', function() {
   /** @const */ var Page = cr.ui.pageManager.Page;
   /** @const */ var PageManager = cr.ui.pageManager.PageManager;
   /** @const */ var ArrayDataModel = cr.ui.ArrayDataModel;
 
   /////////////////////////////////////////////////////////////////////////////
@@ skipping 271 matching lines @@
     /**
      * @param {boolean} visible Whether the link should be visible.
      * @private
      */
     setManageAccountLinkVisibility_: function(visible) {
       $('manage-passwords-span').hidden = !visible;
     },
 
     /** @private */
     showImportExportButton_: function() {
-      $('password-manager-import').hidden = false;
-      $('password-manager-export').hidden = false;
+      $('password-manager-import-export').style.display = '-webkit-box';

[vabr (Chromium), 2016/07/18 14:07:17]

-webkit-box is what the action-area class in ui/webui/resources/css/overlay.css
uses. The DIV has this class, so I'm emulating dropping the override from the
password_manager.css class here. It seems fragile because if someone updates
action-area, this line will likely be missed. But I'm not sure how to do this
better.

[stevenjb, 2016/07/18 15:27:18]

Instead can you toggle a class, e.g. 'noDisplay' and change the CSS to something
like #password-manager-import-export.noDisplay { display: none } ?

[vabr (Chromium), 2016/07/18 15:53:10]

Good idea, done.

If you prefer "noDisplay" to the "hidden" which I used, just let me know and
I'll rename it. In that case, please confirm that it should be "noDisplay" and
not "no-display" (the latter style seems to be used for the class names in the
code around).

[stevenjb, 2016/07/18 16:34:33]

Since there is already a global 'hidden' attribute, with subtly different
behavior (as demonstrated in the bug this is fixing), using a class with the
same name seems confusing. You are right though, classes should be named, e.g.
no-display.

[vabr (Chromium), 2016/07/19 08:16:57]

Acknowledged.
(Would implement that, but your other suggestion with the hidden attribute
worked even better.)

     },
   };
 
   /**
    * Removes a saved password.
    * @param {number} rowIndex indicating the row to remove.
    */
   PasswordManager.removeSavedPassword = function(rowIndex) {
     chrome.send('removeSavedPassword', [String(rowIndex)]);
     chrome.send('coreOptionsUserMetricsAction',
@@ skipping 19 matching lines @@
     'showImportExportButton',
     'showPassword',
   ]);
 
   // Export
   return {
     PasswordManager: PasswordManager
   };
 
 });