Move route observer behavior into Recent Site Permissions element

Previously the Recent Site Permissions display list update needed to be
manually triggered (probably by it's parent). This CL extends the element
to be a route observer so that it can re-trigger updates when appropriate.

Updates are triggered when the route matching that set on the route-path
attribute of the element is navigated to.

Bug: 1032584
Change-Id: Id29191b6586c138e1e1191aaab218c5f7ff92a2f
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2088643Reviewed-by: dpapad <dpapad@chromium.org>
Commit-Queue: Theodore Olsauskas-Warren <sauski@google.com>
Cr-Commit-Position: refs/heads/master@{#747512}

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

@@ -14,6 +14,8 @@ js_type_check("closure_compile") {
 
 js_library("recent_site_permissions") {
   deps = [
+    "..:route",
+    "..:router",
     "../people_page:sync_browser_proxy",
     "../prefs:prefs_behavior",
     "../site_settings:site_settings_behavior",

chrome/browser/resources/settings/site_settings_page/recent_site_permissions.html

@@ -5,6 +5,8 @@
 <link rel="import" href="chrome://resources/html/load_time_data.html">
 <link rel="import" href="chrome://resources/html/web_ui_listener_behavior.html">
 <link rel="import" href="chrome://resources/polymer/v1_0/paper-tooltip/paper-tooltip.html">
+<link rel="import" href="../route.html">
+<link rel="import" href="../router.html">
 <link rel="import" href="../site_settings/site_settings_behavior.html">
 <link rel="import" href="../settings_shared_css.html">
 

chrome/browser/resources/settings/site_settings_page/recent_site_permissions.js

@@ -6,6 +6,7 @@ Polymer({
   is: 'settings-recent-site-permissions',
 
   behaviors: [
+    settings.RouteObserverBehavior,
     SiteSettingsBehavior,
     WebUIListenerBehavior,
     I18nBehavior,
@@ -30,6 +31,18 @@ Polymer({
     },
   },
 
+  /**
+   * Reload the site recent site permission list whenever the user navigates
+   * to the site settings page.
+   * @param {!settings.Route} currentRoute
+   * @protected
+   */
+  currentRouteChanged(currentRoute) {
+    if (currentRoute.path == settings.routes.SITE_SETTINGS.path) {
+      this.populateList_();
+    }
+  },
+
   /** @override */
   ready() {
     this.addWebUIListener(
@@ -214,7 +227,7 @@ Polymer({
     // and we are currently displaying an incognito entry.
     if (hasIncognito === false &&
         this.recentSitePermissionsList_.some(p => p.incognito)) {
-      this.populateList();
+      this.populateList_();
     }
   },
 
@@ -262,7 +275,7 @@ Polymer({
    * the update of the display list.
    * @private
    */
-  async populateList() {
+  async populateList_() {
     this.recentSitePermissionsList_ =
         await this.browserProxy.getRecentSitePermissions(
             this.getCategoryList(), 3);

chrome/browser/resources/settings/site_settings_page/site_settings_page.js

@@ -327,8 +327,6 @@ cr.define('settings', function() {
   Polymer({
     is: 'settings-site-settings-page',
 
-    behaviors: [settings.RouteObserverBehavior],
-
     properties: {
       /**
        * @private {{
@@ -479,24 +477,6 @@ cr.define('settings', function() {
       this.navigateToRoute_(event.detail);
     },
 
-    /**
-     * Reload the site recent site permission list when the page is navigated
-     * to.
-     * settings.RouteObserverBehavior
-     * @param {!settings.Route} currentRoute
-     * @protected
-     */
-    currentRouteChanged(currentRoute) {
-      if (currentRoute == settings.routes.SITE_SETTINGS &&
-          this.privacySettingsRedesignEnabled_) {
-        // Needs to be async to await the surrounding dom-if, should be removed
-        // when the dom-if is removed.
-        this.async(() => {
-          this.$$('#recentSitePermissions').populateList();
-        });
-      }
-    },
-
     /**
      * @return {string} Class for the all site settings link
      * @private

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

@@ -22,14 +22,20 @@ suite('CrSettingsRecentSitePermissionsTest', function() {
     Polymer.dom.flush();
   });
 
+  teardown(function() {
+    testElement.remove();
+  });
+
   test('No recent permissions', async function() {
     browserProxy.setResultFor('getRecentSitePermissions', Promise.resolve([]));
-    await testElement.populateList();
+    testElement.currentRouteChanged(settings.routes.SITE_SETTINGS);
+    await browserProxy.whenCalled('getRecentSitePermissions');
+    Polymer.dom.flush();
     assertTrue(test_util.isVisible(testElement, '#noPermissionsText'));
   });
 
   test('Various recent permissions', async function() {
-    const mock_data = Promise.resolve([
+    const mockData = Promise.resolve([
       {
         origin: 'https://bar.com',
         incognito: true,
@@ -53,9 +59,11 @@ suite('CrSettingsRecentSitePermissionsTest', function() {
         ]
       },
     ]);
-    browserProxy.setResultFor('getRecentSitePermissions', mock_data);
+    browserProxy.setResultFor('getRecentSitePermissions', mockData);
+    testElement.currentRouteChanged(settings.routes.SITE_SETTINGS);
+    await browserProxy.whenCalled('getRecentSitePermissions');
+    Polymer.dom.flush();
 
-    await testElement.populateList();
     assertFalse(testElement.noRecentPermissions);
     assertFalse(test_util.isChildVisible(testElement, '#noPermissionsText'));