Network settings: Layout fixes

This includes a handful of minor layout fixes after close examination of
the network settings UI.

* Spacing issue introduced with paper button changes:
  https://chromium-review.googlesource.com/907856
* Alignment issue introdiced when fixing click targets:
  https://chromium-review.googlesource.com/952033
* ip-config JS console error causing details page to be incorrect
  initially (old issue, but probably exposed with recent refactoring)
* Network security icon bug in detail page that has existed since 64
  (no bug filed that I could find)

Only the security icon bug impacts 66 and it's confusing but minor.

Bug: 821733, 821720
Cq-Include-Trybots: master.tryserver.chromium.linux:closure_compilation
Change-Id: I877aeb93a232f6c656d73ac7c345f63e00cbf125
Reviewed-on: https://chromium-review.googlesource.com/963303Reviewed-by: Toni Barzic <tbarzic@chromium.org>
Commit-Queue: Steven Bennetts <stevenjb@chromium.org>
Cr-Commit-Position: refs/heads/master@{#543196}

chrome/browser/resources/settings/internet_page/internet_subpage.html

@@ -83,9 +83,9 @@
             '$i18nPolymer{deviceOn}', '$i18nPolymer{deviceOff}')]]
         </div>
         <!-- The add button in this row is only shown for WiFi networks. -->
-        <paper-icon-button-light class="icon-add-wifi"
+        <paper-icon-button-light class="icon-add-wifi" id="addButton"
             hidden$="[[!showAddButton_(deviceState, globalPolicy)]]">
-          <button id="addButton" aria-label="$i18n{internetAddWiFi}"
+          <button aria-label="$i18n{internetAddWiFi}"
               on-click="onAddButtonTap_" tabindex$="[[tabindex]]">
           </button>
         </paper-icon-button-light>

chrome/browser/resources/settings/internet_page/network_summary_item.html

@@ -35,7 +35,7 @@
       }
     </style>
     <div class="settings-box two-line">
-      <div actionable class="flex layout horizontal"
+      <div actionable class="flex layout horizontal center"
           on-click="onShowDetailsTap_">
         <div id="details" no-flex$="[[showSimInfo_(deviceState)]]">
           <cr-network-icon network-state="[[activeNetworkState]]"

ui/webui/resources/cr_components/chromeos/network/network_ip_config.js

@@ -44,15 +44,12 @@ Polymer({
     /**
      * The currently visible IP Config property dictionary. The 'RoutingPrefix'
      * property is a human-readable mask instead of a prefix length.
-     * @private {?{
+     * @private {{
      *   ipv4: (!CrOnc.IPConfigUIProperties|undefined),
      *   ipv6: (!CrOnc.IPConfigUIProperties|undefined)
-     * }}
+     * }|undefined}
      */
-    ipConfig_: {
-      type: Object,
-      value: null,
-    },
+    ipConfig_: Object,
 
     /**
      * Array of properties to pass to the property list.
@@ -108,7 +105,7 @@ Polymer({
       }
       this.ipConfig_ = {ipv4: ipv4, ipv6: ipv6};
     } else {
-      this.ipConfig_ = null;
+      this.ipConfig_ = undefined;
     }
   },
 

ui/webui/resources/cr_elements/chromeos/network/cr_network_icon.js

@@ -158,7 +158,7 @@ Polymer({
         networkState.ConnectionState == CrOnc.ConnectionState.NOT_CONNECTED) {
       return false;
     }
-    var security = networkState.WiFi.Security;
+    var security = CrOnc.getStateOrActiveString(networkState.WiFi.Security);
     return !!security && security != 'None';
   },
 });