Network settings: Add tooltip to eye icon-button

Bug: 873114
Change-Id: I05cef0d2a7e53c1bc965764e2b83aefd502753cf
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1993828Reviewed-by: Demetrios Papadopoulos <dpapad@chromium.org>
Commit-Queue: Roman Aleksandrov <raleksandrov@google.com>
Cr-Commit-Position: refs/heads/master@{#732662}

ui/webui/resources/cr_components/chromeos/network/network_password_input.html

@@ -6,6 +6,7 @@
 <link rel="import" href="chrome://resources/cr_elements/policy/cr_policy_network_indicator_mojo.html">
 <link rel="import" href="chrome://resources/cr_elements/shared_vars_css.html">
 <link rel="import" href="chrome://resources/html/i18n_behavior.html">
+<link rel="import" href="chrome://resources/polymer/v1_0/paper-tooltip/paper-tooltip.html">
 <link rel="import" href="network_config_element_behavior.html">
 <link rel="import" href="network_shared_css.html">
 
@@ -22,6 +23,13 @@
         flex: 1;
       }
 
+      paper-tooltip {
+        --paper-tooltip: {
+          @apply --cr-tooltip;
+          min-width: 0;
+        };
+      }
+
       cr-policy-network-indicator-mojo {
         --cr-tooltip-icon-margin-start: var(--cr-controlled-by-spacing);
       }
@@ -40,8 +48,12 @@
         <cr-icon-button id="icon" slot="suffix"
             class$="[[getIconClass_(showPassword)]]"
             on-click="onShowPasswordTap_"
-            title="[[getShowPasswordTitle_(showPassword)]]">
+            aria-describedby="tooltip">
         </cr-icon-button>
+        <paper-tooltip id="tooltip" for="icon" position="top"
+            fit-to-visible-bounds role="tooltip">
+          [[getShowPasswordTitle_(showPassword)]]
+        </paper-tooltip>
       </template>
       <template is="dom-if" if="[[showPolicyIndicator_]]" restamp>
         <cr-policy-network-indicator-mojo