Reland "Settings: Content settings can now be reset for a group of origins in All Sites."

This is a reland of e2cac39f

Original change's description:
> Settings: Content settings can now be reset for a group of origins in All Sites.
> 
> Add a three-dot / overflow menu to groups of origins in All Sites. This overflow
> menu allows the entire list of origins to have all their content settings reset
> in one go. This will be preceded with a confirmation dialog.
> 
> Manual test - With #enable-site-settings turned on, change a content setting via
> Page Info > Site settings on both https://permission.site and
> http://permission.site. Navigate to chrome://settings/content/all and see that
> both sites are listed under 'permission.site'. Verify there is an overflow menu
> on this entry and that inside the overflow menu, there is a 'Reset permissions'
> option. Clicking this should bring up a reset permission dialog and confirming
> the dialog should remove this entry from All Sites.
> 
> Bug: 835712, 717468
> Cq-Include-Trybots: luci.chromium.try:closure_compilation
> Change-Id: I777f759c26bf0fe7f8da086fa887969897cf9833
> Reviewed-on: https://chromium-review.googlesource.com/1098577
> Commit-Queue: Patti <patricialor@chromium.org>
> Reviewed-by: Dave Schuyler <dschuyler@chromium.org>
> Cr-Commit-Position: refs/heads/master@{#568742}

Bug: 835712, 717468
Change-Id: I6560d10b31602038daa03f57fc67b6a878794d5a
Cq-Include-Trybots: luci.chromium.try:closure_compilation
Reviewed-on: https://chromium-review.googlesource.com/1109537
Commit-Queue: Patti <patricialor@chromium.org>
Reviewed-by: Dave Schuyler <dschuyler@chromium.org>
Cr-Commit-Position: refs/heads/master@{#569507}

chrome/app/settings_strings.grdp

@@ -2981,6 +2981,12 @@
   <message name="IDS_SETTINGS_SITE_SETTINGS_SITE_CLEAR_STORAGE_CONFIRMATION" desc="Text for the dialog that warns about clearing storage used by a site (excluding cookies).">
     All data stored by <ph name="SITE">$1<ex>www.example.com</ex></ph> will be deleted, except for cookies.
   </message>
+  <message name="IDS_SETTINGS_SITE_SETTINGS_SITE_GROUP_RESET_DIALOG_TITLE" desc="Title of the dialog that warns about resetting all permissions for a group of sites.">
+    Reset site permissions?
+  </message>
+  <message name="IDS_SETTINGS_SITE_SETTINGS_SITE_GROUP_RESET_CONFIRMATION" desc="Text for the dialog that warns about resetting all permissions for a group of sites.">
+    Sites under <ph name="SITE_GROUP_NAME">$1<ex>google.co.uk</ex></ph> will also be reset.
+  </message>
   <message name="IDS_SETTINGS_SITE_SETTINGS_COOKIE_REMOVE_MULTIPLE" desc="Text for the dialog that warns about deleting all site data.">
     This will delete any data stored on your device for all the sites shown. Do you want to continue?
   </message>

chrome/browser/resources/settings/site_settings/BUILD.gn

@@ -19,6 +19,7 @@ js_type_check("closure_compile") {
     ":site_data_details_subpage",
     ":site_details",
     ":site_details_permission",
+    ":site_entry",
     ":site_list",
     ":site_settings_behavior",
     ":site_settings_prefs_browser_proxy",
@@ -170,6 +171,20 @@ js_library("site_details_permission") {
   ]
 }
 
+js_library("site_entry") {
+  deps = [
+    ":constants",
+    ":site_settings_behavior",
+    "..:route",
+    "//third_party/polymer/v1_0/components-chromium/iron-collapse:iron-collapse-extracted",
+    "//ui/webui/resources/cr_elements/cr_action_menu:cr_action_menu",
+    "//ui/webui/resources/cr_elements/cr_lazy_render:cr_lazy_render",
+    "//ui/webui/resources/js:assert",
+    "//ui/webui/resources/js:cr",
+    "//ui/webui/resources/js:load_time_data",
+  ]
+}
+
 js_library("site_list") {
   deps = [
     ":constants",

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

@@ -40,42 +40,11 @@ Polymer({
    */
   populateList_: function() {
     /** @type {!Array<settings.ContentSettingsTypes>} */
-    let contentTypes = [];
-    const types = Object.values(settings.ContentSettingsTypes);
-    for (let i = 0; i < types.length; ++i) {
-      const type = types[i];
-      // <if expr="not chromeos">
-      if (type == settings.ContentSettingsTypes.PROTECTED_CONTENT)
-        continue;
-      // </if>
-      // Some categories store their data in a custom way.
-      if (type == settings.ContentSettingsTypes.PROTOCOL_HANDLERS ||
-          type == settings.ContentSettingsTypes.ZOOM_LEVELS) {
-        continue;
-      }
-      // These categories are gated behind flags.
-      if (type == settings.ContentSettingsTypes.SENSORS &&
-          !loadTimeData.getBoolean('enableSensorsContentSetting')) {
-        continue;
-      }
-      if (type == settings.ContentSettingsTypes.ADS &&
-          !loadTimeData.getBoolean('enableSafeBrowsingSubresourceFilter')) {
-        continue;
-      }
-      if (type == settings.ContentSettingsTypes.SOUND &&
-          !loadTimeData.getBoolean('enableSoundContentSetting')) {
-        continue;
-      }
-      if (type == settings.ContentSettingsTypes.CLIPBOARD &&
-          !loadTimeData.getBoolean('enableClipboardContentSetting')) {
-        continue;
-      }
-      if (type == settings.ContentSettingsTypes.PAYMENT_HANDLER &&
-          !loadTimeData.getBoolean('enablePaymentHandlerContentSetting')) {
-        continue;
-      }
-      contentTypes.push(type);
-    }
+    const contentTypes = this.getCategoryList();
+    // Make sure to include cookies, because All Sites handles data storage +
+    // cookies as well as regular settings.ContentSettingsTypes.
+    if (!contentTypes.includes(settings.ContentSettingsTypes.COOKIES))
+      contentTypes.push(settings.ContentSettingsTypes.COOKIES);
 
     this.browserProxy_.getAllSites(contentTypes).then((response) => {
       this.siteGroupList = response;

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

@@ -116,8 +116,7 @@
       <site-details-permission
           category="{{ContentSettingsTypes.SENSORS}}"
           icon="settings:sensors" id="sensors"
-          label="$i18n{siteSettingsSensors}"
-          hidden$="[[!enableSensorsContentSetting_]]">
+          label="$i18n{siteSettingsSensors}">
       </site-details-permission>
       <site-details-permission category="{{ContentSettingsTypes.NOTIFICATIONS}}"
           icon="settings:notifications" id="notifications"
@@ -139,8 +138,7 @@
       <site-details-permission
           category="{{ContentSettingsTypes.ADS}}"
           icon="settings:ads" id="ads"
-          label="$i18n{siteSettingsAds}"
-          hidden$="[[!enableSafeBrowsingSubresourceFilter_]]">
+          label="$i18n{siteSettingsAds}">
       </site-details-permission>
       <site-details-permission
           category="{{ContentSettingsTypes.BACKGROUND_SYNC}}"
@@ -149,8 +147,7 @@
       </site-details-permission>
       <site-details-permission category="{{ContentSettingsTypes.SOUND}}"
           icon="settings:volume-up" id="sound"
-          label="$i18n{siteSettingsSound}"
-          hidden$="[[!enableSoundContentSetting_]]">
+          label="$i18n{siteSettingsSound}">
       </site-details-permission>
       <site-details-permission
           category="{{ContentSettingsTypes.AUTOMATIC_DOWNLOADS}}"
@@ -180,14 +177,12 @@
       <site-details-permission
           category="{{ContentSettingsTypes.CLIPBOARD}}"
           icon="settings:clipboard" id="clipboard"
-          label="$i18n{siteSettingsClipboard}"
-          hidden$="[[!enableClipboardContentSetting_]]">
+          label="$i18n{siteSettingsClipboard}">
       </site-details-permission>
       <site-details-permission
           category="{{ContentSettingsTypes.PAYMENT_HANDLER}}"
           icon="settings:payment-handler" id="paymentHandler"
-          label="$i18n{siteSettingsPaymentHandler}"
-          hidden$="[[!enablePaymentHandlerContentSetting_]]">
+          label="$i18n{siteSettingsPaymentHandler}">
       </site-details-permission>
     </div>
 

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

@@ -51,47 +51,6 @@ Polymer({
       },
     },
 
-    /** @private */
-    enableSafeBrowsingSubresourceFilter_: {
-      type: Boolean,
-      value: function() {
-        return loadTimeData.getBoolean('enableSafeBrowsingSubresourceFilter');
-      },
-    },
-
-    /** @private */
-    enableSoundContentSetting_: {
-      type: Boolean,
-      value: function() {
-        return loadTimeData.getBoolean('enableSoundContentSetting');
-      },
-    },
-
-    /** @private */
-    enableClipboardContentSetting_: {
-      type: Boolean,
-      value: function() {
-        return loadTimeData.getBoolean('enableClipboardContentSetting');
-      },
-    },
-
-    /** @private */
-    enableSensorsContentSetting_: {
-      type: Boolean,
-      readOnly: true,
-      value: function() {
-        return loadTimeData.getBoolean('enableSensorsContentSetting');
-      },
-    },
-
-    /** @private */
-    enablePaymentHandlerContentSetting_: {
-      type: Boolean,
-      value: function() {
-        return loadTimeData.getBoolean('enablePaymentHandlerContentSetting');
-      },
-    },
-
     /**
      * The type of storage for the origin.
      * @private
@@ -144,7 +103,7 @@ Polymer({
         if (this.enableSiteSettings_)
           this.$.usageApi.fetchUsageTotal(this.toUrl(this.origin).hostname);
 
-        this.updatePermissions_(this.getCategoryList_());
+        this.updatePermissions_(this.getCategoryList());
       }
     });
   },
@@ -162,7 +121,7 @@ Polymer({
         origin === undefined || origin == '') {
       return;
     }
-    if (!this.getCategoryList_().includes(category))
+    if (!this.getCategoryList().includes(category))
       return;
 
     // Site details currently doesn't support embedded origins, so ignore it and
@@ -239,20 +198,20 @@ Polymer({
    * Resets all permissions for the current origin.
    * @private
    */
-  onResetSettings_: function() {
+  onResetSettings_: function(e) {
     this.browserProxy.setOriginPermissions(
-        this.origin, this.getCategoryList_(), settings.ContentSetting.DEFAULT);
-    if (this.getCategoryList_().includes(settings.ContentSettingsTypes.PLUGINS))
+        this.origin, this.getCategoryList(), settings.ContentSetting.DEFAULT);
+    if (this.getCategoryList().includes(settings.ContentSettingsTypes.PLUGINS))
       this.browserProxy.clearFlashPref(this.origin);
 
-    this.$.confirmResetSettings.close();
+    this.onCloseDialog_(e);
   },
 
   /**
    * Clears all data stored, except cookies, for the current origin.
    * @private
    */
-  onClearStorage_: function() {
+  onClearStorage_: function(e) {
     // Since usage is only shown when "Site Settings" is enabled, don't clear it
     // when it's not shown.
     if (this.enableSiteSettings_ && this.storedData_ != '') {
@@ -260,7 +219,7 @@ Polymer({
           this.toUrl(this.origin).href, this.storageType_);
     }
 
-    this.$.confirmClearStorage.close();
+    this.onCloseDialog_(e);
   },
 
   /**
@@ -274,20 +233,6 @@ Polymer({
       this.storedData_ = '';
   },
 
-  /**
-   * Returns list of categories for each permission displayed in <site-details>.
-   * @return {!Array<!settings.ContentSettingsTypes>}
-   * @private
-   */
-  getCategoryList_: function() {
-    const categoryList = [];
-    this.root.querySelectorAll('site-details-permission').forEach((element) => {
-      if (!element.hidden)
-        categoryList.push(element.category);
-    });
-    return categoryList;
-  },
-
   /**
    * Checks whether the permission list is standalone or has a heading.
    * @return {string} CSS class applied when the permission list has no heading.

chrome/browser/resources/settings/site_settings/site_details_permission.html

@@ -12,7 +12,7 @@
 <dom-module id="site-details-permission">
   <template>
     <style include="settings-shared md-select"></style>
-    <div id="details">
+    <div id="details" hidden$="[[shouldHideCategory_(category)]]">
       <div id="permissionItem"
           class$="list-item [[permissionInfoStringClass_(site.source, category,
                                                          site.setting)]]">

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

@@ -36,6 +36,10 @@ Polymer({
         this.onDefaultSettingChanged_.bind(this));
   },
 
+  shouldHideCategory_: function(category) {
+    return !this.getCategoryList().includes(category);
+  },
+
   /**
    * Updates the drop-down value after |site| has changed.
    * @param {!RawSiteException} site The site to display.

chrome/browser/resources/settings/site_settings/site_entry.html

@@ -7,21 +7,44 @@
 
 <dom-module id="site-entry">
   <template>
-    <style include="settings-shared"></style>
+    <style include="settings-shared">
+      .row-aligned {
+        display: flex;
+        flex-direction: row;
+      }
+    </style>
     <div id="collapseParent">
-      <div id="toggleButton" class="settings-box list-item"
+      <div class="settings-box list-item">
+        <div id="toggleButton" class="start row-aligned"
             on-click="toggleCollapsible_" actionable aria-expanded="false">
           <div class="favicon-image"
               style$="[[getSiteGroupIcon_(siteGroup)]]">
           </div>
           <div class="middle text-elide" id="displayName">
-          [[displayName_(siteGroup)]]
+            [[displayName_]]
           </div>
+          <div hidden$="[[!grouped_(siteGroup)]]">
+            <paper-icon-button-light id="expandIcon" class="icon-expand-more">
+              <button aria-label$="[[displayName_]]"
+                  aria-describedby="displayName"></button>
+            </paper-icon-button-light>
+          </div>
+          <div hidden$="[[grouped_(siteGroup)]]">
             <paper-icon-button-light class="subpage-arrow">
-          <button aria-label$="[[displayName_(siteGroup)]]"
+              <button aria-label$="[[displayName_]]"
                   aria-describedby="displayName"></button>
             </paper-icon-button-light>
           </div>
+        </div>
+        <div class="row-aligned" hidden$="[[!grouped_(siteGroup)]]">
+          <div class="separator"></div>
+          <paper-icon-button-light class="icon-more-vert">
+            <button id="overflowMenuButton" title="$i18n{moreActions}"
+                on-click="showOverflowMenu_">
+            </button>
+          </paper-icon-button-light>
+        </div>
+      </div>
 
       <iron-collapse id="collapseChild" no-animation>
         <div class="list-frame">
@@ -31,7 +54,7 @@
               <div class="favicon-image"
                   style$="[[computeSiteIcon(item)]]">
               </div>
-              <div class="middle text-elide" data-index="[[index]]">
+              <div class="middle text-elide">
                 [[item]]
               </div>
             </div>
@@ -39,6 +62,38 @@
         </div>
       </iron-collapse>
     </div>
+
+    <!-- Overflow menu. -->
+    <cr-lazy-render id="menu">
+      <template>
+        <cr-action-menu>
+          <button slot="item" class="dropdown-item" role="menuitem"
+              on-click="onConfirmResetSettings_">
+            Reset permissions
+          </button>
+        </cr-action-menu>
+      </template>
+    </cr-lazy-render>
+
+    <!-- Confirm reset settings dialog. -->
+    <cr-dialog id="confirmResetSettings" close-text="$i18n{close}">
+      <div slot="title">
+        $i18n{siteSettingsSiteGroupResetDialogTitle}
+      </div>
+      <div slot="body">
+        [[getFormatString_(
+            '$i18nPolymer{siteSettingsSiteGroupResetConfirmation}',
+            displayName_)]]
+      </div>
+      <div slot="button-container">
+        <paper-button class="cancel-button" on-click="onCloseDialog_">
+          $i18n{cancel}
+        </paper-button>
+        <paper-button class="action-button" on-click="onResetSettings_">
+          $i18n{siteSettingsSiteResetAll}
+        </paper-button>
+      </div>
+    </cr-dialog>
   </template>
   <script src="site_entry.js"></script>
 </dom-module>

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

@@ -17,13 +17,25 @@ Polymer({
      * An object representing a group of sites with the same eTLD+1.
      * @typedef {!SiteGroup}
      */
-    siteGroup: Object,
+    siteGroup: {
+      type: Object,
+      observer: 'onSiteGroupChanged_',
+    },
+
+    /**
+     * The name to display beside the icon. If grouped_() is true, it will be
+     * the eTLD+1 for all the origins, otherwise, it will match the origin more
+     * closely in an appropriate site representation.
+     * @typedef {!string}
+     * @private
+     */
+    displayName_: String,
   },
 
   /**
    * Whether the list of origins displayed in this site-entry is a group of
    * eTLD+1 origins or not.
-   * @param {Array<Object>} siteGroup The eTLD+1 group of origins.
+   * @param {SiteGroup} siteGroup The eTLD+1 group of origins.
    * @return {boolean}
    * @private
    */
@@ -32,25 +44,20 @@ Polymer({
   },
 
   /**
-   * The name to display beside the icon. If grouped_() is true, it will return
-   * the eTLD+1 for all the origins, otherwise, it will return the origin in an
-   * appropriate site representation.
-   * @param {Array<Object>} siteGroup The eTLD+1 group of origins.
-   * @return {string} The name to display.
+   * @param {SiteGroup} siteGroup The eTLD+1 group of origins.
    * @private
    */
-  displayName_: function(siteGroup) {
-    if (this.grouped_(siteGroup))
-      return siteGroup.etldPlus1;
-    // TODO(https://crbug.com/835712): Return the origin in a user-friendly site
-    // representation.
-    return siteGroup.origins[0];
+  onSiteGroupChanged_: function(siteGroup) {
+    // TODO(https://crbug.com/835712): Present the origin in a user-friendly
+    // site representation when ungrouped.
+    this.displayName_ =
+        this.grouped_(siteGroup) ? siteGroup.etldPlus1 : siteGroup.origins[0];
   },
 
   /**
    * Get an appropriate favicon that represents this group of eTLD+1 sites as a
    * whole.
-   * @param {Array<Object>} siteGroup The eTLD+1 group of origins.
+   * @param {SiteGroup} siteGroup The eTLD+1 group of origins.
    * @return {string} CSS to apply to show the appropriate favicon.
    * @private
    */
@@ -74,28 +81,95 @@ Polymer({
 
   /**
    * A handler for selecting a site (by clicking on the origin).
-   * @param {!{model: !{index: !number}}} event
+   * @param {!{model: !{index: !number}}} e
    * @private
    */
-  onOriginTap_: function(event) {
-    this.navigateToSiteDetails_(this.siteGroup.origins[event.model.index]);
+  onOriginTap_: function(e) {
+    this.navigateToSiteDetails_(this.siteGroup.origins[e.model.index]);
   },
 
   /**
    * Toggles open and closed the list of origins if there is more than one, and
    * directly navigates to Site Details if there is only one site.
-   * @param {!Object} event
+   * @param {!Object} e
    * @private
    */
-  toggleCollapsible_: function(event) {
+  toggleCollapsible_: function(e) {
     // Individual origins don't expand - just go straight to Site Details.
     if (!this.grouped_(this.siteGroup)) {
       this.navigateToSiteDetails_(this.siteGroup.origins[0]);
       return;
     }
 
-    let collapseChild = this.$.collapseChild;
+    let collapseChild =
+        /** @type {IronCollapseElement} */ (this.$.collapseChild);
     collapseChild.toggle();
     this.$.toggleButton.setAttribute('aria-expanded', collapseChild.opened);
+    this.$.expandIcon.toggleClass('icon-expand-more');
+    this.$.expandIcon.toggleClass('icon-expand-less');
+  },
+
+  /**
+   * Retrieves the overflow menu.
+   * @private
+   */
+  getOverflowMenu_: function() {
+    let menu = /** @type {?CrActionMenuElement} */ (this.$.menu.getIfExists());
+    if (!menu)
+      menu = /** @type {!CrActionMenuElement} */ (this.$.menu.get());
+    return menu;
+  },
+
+  /**
+   * Opens the overflow menu at event target.
+   * @param {!{target: Element}} e
+   * @private
+   */
+  showOverflowMenu_: function(e) {
+    this.getOverflowMenu_().showAt(e.target);
+  },
+
+  /** @private */
+  onCloseDialog_: function(e) {
+    e.target.closest('cr-dialog').close();
+    this.getOverflowMenu_().close();
+  },
+
+  /**
+   * Confirms the resetting of all content settings for an origin.
+   * @param {!{target: !Element}} e
+   * @private
+   */
+  onConfirmResetSettings_: function(e) {
+    e.preventDefault();
+    this.$.confirmResetSettings.showModal();
+  },
+
+  /**
+   * Resets all permissions for all origins listed in |siteGroup.origins|.
+   * @param {!Event} e
+   * @private
+   */
+  onResetSettings_: function(e) {
+    const contentSettingsTypes = this.getCategoryList();
+    for (let i = 0; i < this.siteGroup.origins.length; ++i) {
+      const origin = this.siteGroup.origins[i];
+      this.browserProxy.setOriginPermissions(
+          origin, contentSettingsTypes, settings.ContentSetting.DEFAULT);
+      if (contentSettingsTypes.includes(settings.ContentSettingsTypes.PLUGINS))
+        this.browserProxy.clearFlashPref(origin);
+    }
+    this.onCloseDialog_(e);
+  },
+
+  /**
+   * Formats the |label| string with |name|, using $<num> as markers.
+   * @param {string} label
+   * @param {string} name
+   * @return {string}
+   * @private
+   */
+  getFormatString_: function(label, name) {
+    return loadTimeData.substituteString(label, name);
   },
 });

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

@@ -31,6 +31,18 @@ const SiteSettingsBehaviorImpl = {
      */
     category: String,
 
+    /**
+     * A cached list of ContentSettingsTypes with a standard allow-block-ask
+     * pattern that are currently enabled for use. This property is the same
+     * across all elements with SiteSettingsBehavior ('static').
+     * @type {Array<settings.ContentSettingsTypes>}
+     * @private
+     */
+    contentTypes_: {
+      type: Array,
+      value: [],
+    },
+
     /**
      * The browser proxy used to retrieve and change information about site
      * settings categories and the sites within.
@@ -98,7 +110,6 @@ const SiteSettingsBehaviorImpl = {
    * Returns the icon to use for a given site.
    * @param {string} site The url of the site to fetch the icon for.
    * @return {string} The background-image style with the favicon.
-   * @private
    */
   computeSiteIcon: function(site) {
     site = this.removePatternWildcard(site);
@@ -170,6 +181,56 @@ const SiteSettingsBehaviorImpl = {
     };
   },
 
+  /**
+   * Returns list of categories for each setting.ContentSettingsTypes that are
+   * currently enabled.
+   * @return {!Array<!settings.ContentSettingsTypes>}
+   */
+  getCategoryList: function() {
+    if (this.contentTypes_.length == 0) {
+      /** @type {!Array<settings.ContentSettingsTypes>} */
+      for (let typeName in settings.ContentSettingsTypes) {
+        const contentType = settings.ContentSettingsTypes[typeName];
+        // <if expr="not chromeos">
+        if (contentType == settings.ContentSettingsTypes.PROTECTED_CONTENT)
+          continue;
+        // </if>
+        // Some categories store their data in a custom way.
+        if (contentType == settings.ContentSettingsTypes.COOKIES ||
+            contentType == settings.ContentSettingsTypes.PROTOCOL_HANDLERS ||
+            contentType == settings.ContentSettingsTypes.ZOOM_LEVELS) {
+          continue;
+        }
+        this.contentTypes_.push(contentType);
+      }
+    }
+
+    const addOrRemoveSettingWithFlag = (type, flag) => {
+      if (loadTimeData.getBoolean(flag)) {
+        if (!this.contentTypes_.includes(type))
+          this.contentTypes_.push(type);
+      } else {
+        if (this.contentTypes_.includes(type))
+          this.contentTypes_.splice(this.contentTypes_.indexOf(type), 1);
+      }
+    };
+    // These categories are gated behind flags.
+    addOrRemoveSettingWithFlag(
+        settings.ContentSettingsTypes.SENSORS, 'enableSensorsContentSetting');
+    addOrRemoveSettingWithFlag(
+        settings.ContentSettingsTypes.ADS,
+        'enableSafeBrowsingSubresourceFilter');
+    addOrRemoveSettingWithFlag(
+        settings.ContentSettingsTypes.SOUND, 'enableSoundContentSetting');
+    addOrRemoveSettingWithFlag(
+        settings.ContentSettingsTypes.CLIPBOARD,
+        'enableClipboardContentSetting');
+    addOrRemoveSettingWithFlag(
+        settings.ContentSettingsTypes.PAYMENT_HANDLER,
+        'enablePaymentHandlerContentSetting');
+    return this.contentTypes_.slice(0);
+  },
+
 };
 
 /** @polymerBehavior */

chrome/browser/ui/webui/settings/md_settings_localized_strings_provider.cc

@@ -2326,6 +2326,10 @@ void AddSiteSettingsStrings(content::WebUIDataSource* html_source,
      IDS_SETTINGS_SITE_SETTINGS_SITE_CLEAR_STORAGE_CONFIRMATION},
     {"siteSettingsSiteClearStorageDialogTitle",
      IDS_SETTINGS_SITE_SETTINGS_SITE_CLEAR_STORAGE_DIALOG_TITLE},
+    {"siteSettingsSiteGroupResetDialogTitle",
+     IDS_SETTINGS_SITE_SETTINGS_SITE_GROUP_RESET_DIALOG_TITLE},
+    {"siteSettingsSiteGroupResetConfirmation",
+     IDS_SETTINGS_SITE_SETTINGS_SITE_GROUP_RESET_CONFIRMATION},
     {"siteSettingsSiteResetAll", IDS_SETTINGS_SITE_SETTINGS_SITE_RESET_ALL},
     {"siteSettingsSiteResetConfirmation",
      IDS_SETTINGS_SITE_SETTINGS_SITE_RESET_CONFIRMATION},

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

@@ -974,7 +974,9 @@ CrSettingsSiteEntryTest.prototype = {
 
   /** @override */
   extraLibraries: CrSettingsBrowserTest.prototype.extraLibraries.concat([
+    '../test_browser_proxy.js',
     'test_util.js',
+    'test_site_settings_prefs_browser_proxy.js',
     'site_entry_tests.js',
   ]),
 };

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

@@ -244,6 +244,7 @@ suite('SiteDetailsPermission', function() {
   test('info string correct for drm disabled source', function() {
     const origin = 'https://www.example.com';
     testElement.category = settings.ContentSettingsTypes.PROTECTED_CONTENT;
+    testElement.$.details.hidden = false;
     testElement.site = {
       origin: origin,
       embeddingOrigin: origin,

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

@@ -158,7 +158,7 @@ suite('SiteDetails', function() {
       loadTimeData.overrideValues(loadTimeDataOverride);
       testElement = createSiteDetails('https://foo.com:443');
       assertEquals(
-          numContentSettings + 1, testElement.getCategoryList_().length);
+          numContentSettings + 1, testElement.getCategoryList().length);
 
       // Check for setting = off at the end to ensure that the setting does
       // not carry over for the next iteration.
@@ -166,7 +166,7 @@ suite('SiteDetails', function() {
           [optionalSiteDetailsContentSettingsTypes[contentSetting]] = false;
       loadTimeData.overrideValues(loadTimeDataOverride);
       testElement = createSiteDetails('https://foo.com:443');
-      assertEquals(numContentSettings, testElement.getCategoryList_().length);
+      assertEquals(numContentSettings, testElement.getCategoryList().length);
     }
   });
 
@@ -320,7 +320,7 @@ suite('SiteDetails', function() {
     // Accepting the dialog will make a call to setOriginPermissions.
     return browserProxy.whenCalled('setOriginPermissions').then((args) => {
       assertEquals(testElement.origin, args[0]);
-      assertDeepEquals(testElement.getCategoryList_(), args[1]);
+      assertDeepEquals(testElement.getCategoryList(), args[1]);
       assertEquals(settings.ContentSetting.DEFAULT, args[2]);
     });
   });

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

@@ -21,6 +21,12 @@ suite('SiteEntry', function() {
     'https://login.foo.com',
   ]);
 
+  /**
+   * The mock proxy object to use during test.
+   * @type {TestSiteSettingsPrefsBrowserProxy}
+   */
+  let browserProxy;
+
   /**
    * A site list element created before each test.
    * @type {SiteList}
@@ -35,6 +41,9 @@ suite('SiteEntry', function() {
 
   // Initialize a site-list before each test.
   setup(function() {
+    browserProxy = new TestSiteSettingsPrefsBrowserProxy();
+    settings.SiteSettingsPrefsBrowserProxyImpl.instance_ = browserProxy;
+
     PolymerTest.clearBody();
     testElement = document.createElement('site-entry');
     assertTrue(!!testElement);
@@ -106,4 +115,49 @@ suite('SiteEntry', function() {
         TEST_MULTIPLE_SITE_GROUP.origins[1],
         settings.getQueryParameters().get('site'));
   });
+
+  test('with single origin does not show overflow menu', function() {
+    testElement.siteGroup = TEST_SINGLE_SITE_GROUP;
+    Polymer.dom.flush();
+    const overflowMenuButton = testElement.$.overflowMenuButton;
+    assertTrue(overflowMenuButton.closest('.row-aligned').hidden);
+  });
+
+  test(
+      'with multiple origins can reset settings via overflow menu', function() {
+        testElement.siteGroup = TEST_MULTIPLE_SITE_GROUP;
+        Polymer.dom.flush();
+        const overflowMenuButton = testElement.$.overflowMenuButton;
+        assertFalse(overflowMenuButton.closest('.row-aligned').hidden);
+
+        // Open the reset settings dialog and make sure both cancelling the
+        // action and resetting all permissions work.
+        const overflowMenu = testElement.$.menu.get();
+        const menuItems = overflowMenu.querySelectorAll('.dropdown-item');
+        ['cancel-button', 'action-button'].forEach(buttonType => {
+          // Test clicking on the overflow menu button opens the menu.
+          assertFalse(overflowMenu.open);
+          MockInteractions.tap(overflowMenuButton);
+          assertTrue(overflowMenu.open);
+
+          // Open the reset settings dialog and tap the |buttonType| button.
+          assertFalse(testElement.$.confirmResetSettings.open);
+          MockInteractions.tap(menuItems[0]);
+          assertTrue(testElement.$.confirmResetSettings.open);
+          const actionButtonList =
+              testElement.$.confirmResetSettings.getElementsByClassName(
+                  buttonType);
+          assertEquals(1, actionButtonList.length);
+          MockInteractions.tap(actionButtonList[0]);
+
+          // Check the dialog and overflow menu are now both closed.
+          assertFalse(testElement.$.confirmResetSettings.open);
+          assertFalse(overflowMenu.open);
+        });
+
+        // Ensure a call was made to setOriginPermissions for each origin.
+        assertEquals(
+            TEST_MULTIPLE_SITE_GROUP.origins.length,
+            browserProxy.getCallCount('setOriginPermissions'));
+      });
 });