MD Settings: Set all content setting values in Site Details Javascript.

chrome/browser/resources/settings/site_settings/site_details.js

Index: chrome/browser/resources/settings/site_settings/site_details.js
diff --git a/chrome/browser/resources/settings/site_settings/site_details.js b/chrome/browser/resources/settings/site_settings/site_details.js
index c75cfa7eb5ef01263f393ee2e09d2dd7fda4fc11..d73a41a68b77af59371fa875334201e4eb738dea 100644
--- a/chrome/browser/resources/settings/site_settings/site_details.js
+++ b/chrome/browser/resources/settings/site_settings/site_details.js
@@ -14,12 +14,12 @@ Polymer({
 
   properties: {
     /**
-     * The site that this widget is showing details for.
-     * @type {SiteException}
+     * The origin that this widget is showing details for.
+     * @private
      */
-    site: {
-      type: Object,
-      observer: 'onSiteChanged_',
+    origin: {
+      type: String,
+      observer: 'onOriginChanged_',
     },
 
     /**
@@ -59,21 +59,33 @@ Polymer({
     var site = settings.getQueryParameters().get('site');
     if (!site)
       return;
-    this.browserProxy.getSiteDetails(site).then(function(siteInfo) {
-      this.site = this.expandSiteException(siteInfo);
-    }.bind(this));
+    this.origin = site;
   },
 
   /**
    * Handler for when the origin changes.
    * @private
    */
-  onSiteChanged_: function() {
-    // origin may be initially undefined if the user follows a direct
-    // link (URL) to this page.
-    var origin = this.site.origin;
-    if (origin !== undefined)
-      this.$.usageApi.fetchUsageTotal(this.toUrl(origin).hostname);
+  onOriginChanged_: function() {
+    this.$.usageApi.fetchUsageTotal(this.toUrl(this.origin).hostname);
+
+    var siteDetailsPermissions = /** @type{!NodeList<!SiteDetailsPermission>} */
+        this.root.querySelectorAll('site-details-permission');

[dschuyler, 2017/06/28 23:55:52]

I thought a type case like: /** @type ... */ (foo) 
needed parenthesis around foo, i.e.
(this.root.querySelectorAll('site-details-permission'));

Is this file truly closure compiling (i.e. am I just wrong about the above)?

[Patti Lor, 2017/06/29 02:11:07]

Oops, yes, you're totally right. Parens added and SiteDetailsPermission ->
SiteDetailsPermissionElement, plus the type for |categoryList| below fixed as
well. Thanks!

+    var categoryList =
+        /** @type{!NodeList<!string>} */ Array.prototype.map.call(
+            siteDetailsPermissions, function(element) {
+              return element.category;
+            });
+
+    this.browserProxy.getOriginPermissions(this.origin, categoryList)
+        .then(function(exceptionList) {
+          exceptionList.forEach(function(exception, i) {
+            // |exceptionList| should be in the same order as |categoryList|,
+            // which is in the same order as |siteDetailsPermissions|.
+            var element = siteDetailsPermissions[i];
+            element.site = element.expandSiteException(exception);
+          });
+        });
   },
 
   /** @private */
@@ -89,8 +101,7 @@ Polymer({
   onConfirmClearStorage_: function(e) {
     e.preventDefault();
     this.confirmationDeleteMsg_ = loadTimeData.getStringF(
-        'siteSettingsSiteRemoveConfirmation',
-        this.toUrl(this.site.origin).href);
+        'siteSettingsSiteRemoveConfirmation', this.toUrl(this.origin).href);
     this.$.confirmDeleteDialog.showModal();
   },
 
@@ -99,8 +110,7 @@ Polymer({
    * @private
    */
   onClearStorage_: function() {
-    this.$.usageApi.clearUsage(
-        this.toUrl(this.site.origin).href, this.storageType_);
+    this.$.usageApi.clearUsage(this.toUrl(this.origin).href, this.storageType_);
   },
 
   /**
@@ -109,7 +119,7 @@ Polymer({
    * @private
    */
   onUsageDeleted_: function(event) {
-    if (event.detail.origin == this.toUrl(this.site.origin).href) {
+    if (event.detail.origin == this.toUrl(this.origin).href) {
       this.storedData_ = '';
       this.navigateBackIfNoData_();
     }
@@ -120,9 +130,8 @@ Polymer({
    * @private
    */
   onClearAndReset_: function() {
-    Array.prototype.forEach.call(
-        this.root.querySelectorAll('site-details-permission'),
-        function(element) {
+    this.root.querySelectorAll('site-details-permission')
+        .forEach(function(element) {
           element.resetPermission();
         });