[OsSettingsDeepLinking] Add deep links to old Sync subpage

Add deep links to the old Sync subpage of the People page (/syncSetup).

Bug: 1084154
Change-Id: Icc07986d861a1e463fb9e8da8436b9747cf3b1fa
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2363815
Commit-Queue: Kyle Horimoto <khorimoto@chromium.org>
Reviewed-by: Jimmy Gong <jimmyxgong@chromium.org>
Reviewed-by: Kyle Horimoto <khorimoto@chromium.org>
Cr-Commit-Position: refs/heads/master@{#800840}

chrome/browser/resources/settings/chromeos/os_people_page/BUILD.gn

@@ -149,6 +149,7 @@ js_library("os_people_page") {
     "//chrome/browser/resources/settings/people_page:profile_info_browser_proxy",
     "//chrome/browser/resources/settings/people_page:signout_dialog",
     "//chrome/browser/resources/settings/people_page:sync_browser_proxy",
+    "//chrome/browser/resources/settings/people_page:sync_page",
     "//ui/webui/resources/cr_components/chromeos/quick_unlock:lock_screen_constants",
     "//ui/webui/resources/cr_elements/chromeos/cr_picture:png",
     "//ui/webui/resources/js:assert",
@@ -406,6 +407,7 @@ js_library("os_people_page.m") {
     "//chrome/browser/resources/settings/people_page:profile_info_browser_proxy.m",
     "//chrome/browser/resources/settings/people_page:signout_dialog.m",
     "//chrome/browser/resources/settings/people_page:sync_browser_proxy.m",
+    "//chrome/browser/resources/settings/people_page:sync_page.m",
     "//third_party/polymer/v3_0/components-chromium/polymer:polymer_bundled",
     "//ui/webui/resources/cr_components/chromeos/quick_unlock:lock_screen_constants.m",
     "//ui/webui/resources/cr_elements/chromeos/cr_picture:png.m",

chrome/browser/resources/settings/chromeos/os_people_page/os_people_page.js

@@ -168,8 +168,15 @@ Polymer({
      */
     supportedSettingIds: {
       type: Object,
-      value: () =>
-          new Set([chromeos.settings.mojom.Setting.kSetUpParentalControls]),
+      value: () => new Set([
+        chromeos.settings.mojom.Setting.kSetUpParentalControls,
+
+        // Perform Sync page deep links here since it's a shared page.
+        chromeos.settings.mojom.Setting.kNonSplitSyncEncryptionOptions,
+        chromeos.settings.mojom.Setting.kAutocompleteSearchesAndUrls,
+        chromeos.settings.mojom.Setting.kMakeSearchesAndBrowsingBetter,
+        chromeos.settings.mojom.Setting.kGoogleDriveSearchSuggestions,
+      ]),
     },
   },
 
@@ -217,29 +224,87 @@ Polymer({
     }
   },
 
+  /**
+   * Helper function for manually showing deep links on this page.
+   * @param {!chromeos.settings.mojom.Setting} settingId
+   * @param {!function():?Element} getElementCallback
+   * @private
+   */
+  afterRenderShowDeepLink_(settingId, getElementCallback) {
+    // Wait for element to load.
+    Polymer.RenderStatus.afterNextRender(this, () => {
+      const deepLinkElement = getElementCallback();
+      if (!deepLinkElement || deepLinkElement.hidden) {
+        console.warn(`Element with deep link id ${settingId} not focusable.`);
+        return;
+      }
+      this.showDeepLinkElement(deepLinkElement);
+    });
+  },
+
   /**
    * Overridden from DeepLinkingBehavior.
    * @param {!chromeos.settings.mojom.Setting} settingId
    * @return {boolean}
    */
   beforeDeepLinkAttempt(settingId) {
+    switch (settingId) {
       // Manually show the deep links for settings nested within elements.
-    assert(
-        settingId === chromeos.settings.mojom.Setting.kSetUpParentalControls);
-
-    Polymer.RenderStatus.afterNextRender(this, () => {
+      case chromeos.settings.mojom.Setting.kSetUpParentalControls:
+        this.afterRenderShowDeepLink_(settingId, () => {
           const parentalPage =
               /** @type {?SettingsParentalControlsPageElement} */ (
                   this.$$('settings-parental-controls-page'));
-      const deepLinkElement = parentalPage.getSetupButton();
-      if (!deepLinkElement || deepLinkElement.hidden) {
-        console.warn(`Element with deep link id ${settingId} not focusable.`);
-        return;
-      }
-      this.showDeepLinkElement(deepLinkElement);
+          return parentalPage && parentalPage.getSetupButton();
         });
         // Stop deep link attempt since we completed it manually.
         return false;
+
+      // Handle the settings within the old sync page since its a shared
+      // component.
+      case chromeos.settings.mojom.Setting.kNonSplitSyncEncryptionOptions:
+        this.afterRenderShowDeepLink_(settingId, () => {
+          const syncPage = /** @type {?SettingsSyncPageElement} */ (
+              this.$$('settings-sync-page'));
+          // Expand the encryption collapse.
+          syncPage.forceEncryptionExpanded = true;
+          Polymer.dom.flush();
+          return syncPage && syncPage.getEncryptionOptions() &&
+              syncPage.getEncryptionOptions().getEncryptionsRadioButtons();
+        });
+        return false;
+
+      case chromeos.settings.mojom.Setting.kAutocompleteSearchesAndUrls:
+        this.afterRenderShowDeepLink_(settingId, () => {
+          const syncPage = /** @type {?SettingsSyncPageElement} */ (
+              this.$$('settings-sync-page'));
+          return syncPage && syncPage.getPersonalizationOptions() &&
+              syncPage.getPersonalizationOptions().getSearchSuggestToggle();
+        });
+        return false;
+
+      case chromeos.settings.mojom.Setting.kMakeSearchesAndBrowsingBetter:
+        this.afterRenderShowDeepLink_(settingId, () => {
+          const syncPage = /** @type {?SettingsSyncPageElement} */ (
+              this.$$('settings-sync-page'));
+          return syncPage && syncPage.getPersonalizationOptions() &&
+              syncPage.getPersonalizationOptions().getUrlCollectionToggle();
+        });
+        return false;
+
+      case chromeos.settings.mojom.Setting.kGoogleDriveSearchSuggestions:
+        this.afterRenderShowDeepLink_(settingId, () => {
+          const syncPage = /** @type {?SettingsSyncPageElement} */ (
+              this.$$('settings-sync-page'));
+          return syncPage && syncPage.getPersonalizationOptions() &&
+              syncPage.getPersonalizationOptions().getDriveSuggestToggle();
+        });
+        return false;
+
+      default:
+        // Continue with deep linking attempt.
+        return true;
+    }
   },
 
   /**
@@ -261,12 +326,11 @@ Polymer({
       }
     }
 
-    // Only apply deep links to the People page.
-    if (route != settings.routes.OS_PEOPLE) {
-      return;
-    }
-
+    // The old sync page is a shared subpage, so we handle deep links for
+    // both this page and the sync page. Not ideal.
+    if (route === settings.routes.SYNC || route === settings.routes.OS_PEOPLE) {
       this.attemptDeepLink();
+    }
   },
 
   /**

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

@@ -50,6 +50,7 @@ js_library("sync_page") {
     ":sync_account_control",
     ":sync_browser_proxy",
     ":sync_encryption_options",
+    "../privacy_page:personalization_options",
     "../settings_page:settings_animated_pages",
     "//ui/webui/resources/cr_elements/cr_expand_button:cr_expand_button",
     "//ui/webui/resources/cr_elements/cr_input:cr_input",
@@ -240,6 +241,7 @@ js_library("sync_encryption_options.m") {
   deps = [
     ":sync_browser_proxy.m",
     "//third_party/polymer/v3_0/components-chromium/polymer:polymer_bundled",
+    "//ui/webui/resources/cr_elements/cr_radio_group:cr_radio_group.m",
     "//ui/webui/resources/js:assert.m",
   ]
   extra_deps = [ ":sync_encryption_options_module" ]
@@ -249,8 +251,10 @@ js_library("sync_page.m") {
   sources = [ "$root_gen_dir/chrome/browser/resources/settings/people_page/sync_page.m.js" ]
   deps = [
     ":sync_browser_proxy.m",
+    ":sync_encryption_options.m",
     "..:i18n_setup",
     "..:router.m",
+    "../privacy_page:personalization_options.m",
     "//third_party/polymer/v3_0/components-chromium/polymer:polymer_bundled",
     "//ui/webui/resources/cr_elements/cr_dialog:cr_dialog.m",
     "//ui/webui/resources/cr_elements/cr_input:cr_input.m",

chrome/browser/resources/settings/people_page/sync_encryption_options.js

@@ -67,6 +67,15 @@ Polymer({
     },
   },
 
+  /**
+   * Returns the encryption options CrRadioGroupElement.
+   * @return {?CrRadioGroupElement}
+   */
+  getEncryptionsRadioButtons() {
+    return /** @type {?CrRadioGroupElement} */ (
+        this.$$('#encryptionRadioGroup'));
+  },
+
   /**
    * Whether we should disable the radio buttons that allow choosing the
    * encryption options for Sync.

chrome/browser/resources/settings/people_page/sync_page.js

@@ -91,7 +91,14 @@ Polymer({
     encryptionExpanded_: {
       type: Boolean,
       value: false,
-      computed: 'computeEncryptionExpanded_(syncPrefs.encryptAllData)',
+      computed:
+          'computeEncryptionExpanded_(syncPrefs.encryptAllData, forceEncryptionExpanded)',
+    },
+
+    /** If true, override |encryptionExpanded_| to be true. */
+    forceEncryptionExpanded: {
+      type: Boolean,
+      value: false,
     },
 
     /**
@@ -225,6 +232,24 @@ Polymer({
     }
   },
 
+  /**
+   * Returns the encryption options SettingsSyncEncryptionOptionsElement.
+   * @return {?SettingsSyncEncryptionOptionsElement}
+   */
+  getEncryptionOptions() {
+    return /** @type {?SettingsSyncEncryptionOptionsElement} */ (
+        this.$$('settings-sync-encryption-options'));
+  },
+
+  /**
+   * Returns the encryption options SettingsPersonalizationOptionsElement.
+   * @return {?SettingsPersonalizationOptionsElement}
+   */
+  getPersonalizationOptions() {
+    return /** @type {?SettingsPersonalizationOptionsElement} */ (
+        this.$$('settings-personalization-options'));
+  },
+
   /**
    * @return {boolean}
    * @private
@@ -430,6 +455,11 @@ Polymer({
    * @private
    */
   computeEncryptionExpanded_() {
+    // Force the dropdown to expand.
+    if (this.forceEncryptionExpanded) {
+      this.forceEncryptionExpanded = false;
+      return true;
+    }
     return !!this.syncPrefs && this.syncPrefs.encryptAllData;
   },
 

chrome/browser/resources/settings/privacy_page/personalization_options.html

@@ -46,7 +46,8 @@
         no-set-pref>
     </settings-toggle-button>
 </if><!-- not chromeos -->
-    <settings-toggle-button class="hr"
+    <settings-toggle-button id="searchSuggestToggle"
+        class="hr"
         hidden="[[!pageVisibility.searchPrediction]]"
         pref="{{prefs.search.suggest_enabled}}"
         label="$i18n{searchSuggestPref}"
@@ -76,7 +77,7 @@
     </settings-toggle-button>
 </if><!-- not chromeos -->
 </if><!-- _google_chrome -->
-    <settings-toggle-button
+    <settings-toggle-button id="urlCollectionToggle"
         class="hr"
         pref="{{prefs.url_keyed_anonymized_data_collection.enabled}}"
         label="$i18n{urlKeyedAnonymizedDataCollection}"

chrome/browser/resources/settings/privacy_page/personalization_options.js

@@ -87,6 +87,30 @@ Polymer({
     // </if>
   },
 
+  /**
+   * Returns the autocomplete search suggestions CrToggleElement.
+   * @return {?CrToggleElement}
+   */
+  getSearchSuggestToggle() {
+    return /** @type {?CrToggleElement} */ (this.$$('#searchSuggestToggle'));
+  },
+
+  /**
+   * Returns the anonymized URL collection CrToggleElement.
+   * @return {?CrToggleElement}
+   */
+  getUrlCollectionToggle() {
+    return /** @type {?CrToggleElement} */ (this.$$('#urlCollectionToggle'));
+  },
+
+  /**
+   * Returns the Drive suggestions CrToggleElement.
+   * @return {?CrToggleElement}
+   */
+  getDriveSuggestToggle() {
+    return /** @type {?CrToggleElement} */ (this.$$('#driveSuggestControl'));
+  },
+
   // <if expr="_google_chrome and not chromeos">
   /** @private */
   onMetricsReportingChange_() {

chrome/test/data/webui/settings/chromeos/os_people_page_test.js

@@ -6,13 +6,14 @@
 // #import 'chrome://os-settings/chromeos/os_settings.js';
 
 // #import {TestBrowserProxy} from '../../test_browser_proxy.m.js';
-// #import {Router, pageVisibility, routes, AccountManagerBrowserProxyImpl, SyncBrowserProxyImpl, ProfileInfoBrowserProxyImpl, ProfileInfoBrowserProxy} from 'chrome://os-settings/chromeos/os_settings.js';
+// #import {Router, PageStatus, pageVisibility, routes, AccountManagerBrowserProxyImpl, SyncBrowserProxyImpl, ProfileInfoBrowserProxyImpl, ProfileInfoBrowserProxy} from 'chrome://os-settings/chromeos/os_settings.js';
 // #import {assertEquals, assertFalse, assertTrue} from '../../chai_assert.js';
 // #import {assert} from 'chrome://resources/js/assert.m.js';
 // #import {flush} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 // #import {TestProfileInfoBrowserProxy} from 'chrome://test/settings/test_profile_info_browser_proxy.m.js';
 // #import {TestSyncBrowserProxy} from './test_os_sync_browser_proxy.m.js';
 // #import {FakeQuickUnlockPrivate} from './fake_quick_unlock_private.m.js';
+// #import {webUIListenerCallback} from 'chrome://resources/js/cr.m.js';
 // #import {getDeepActiveElement} from 'chrome://resources/js/util.m.js';
 // #import {waitAfterNextRender} from 'chrome://test/test_util.m.js';
 
@@ -224,6 +225,51 @@ cr.define('settings_people_page', function() {
           'Allow guest browsing should be focused for settingId=305.');
     });
 
+    test('Deep link to encryption options on old sync page', async () => {
+      loadTimeData.overrideValues({
+        isDeepLinkingEnabled: true,
+      });
+
+      peoplePage = document.createElement('os-settings-people-page');
+      document.body.appendChild(peoplePage);
+      Polymer.dom.flush();
+
+      // Load the sync page.
+      settings.Router.getInstance().navigateTo(settings.routes.SYNC);
+      Polymer.dom.flush();
+      await test_util.waitAfterNextRender(peoplePage);
+
+      // Make the sync page configurable.
+      const syncPage = peoplePage.$$('settings-sync-page');
+      assert(syncPage);
+      syncPage.syncPrefs = {
+        encryptAllDataAllowed: true,
+        passphraseRequired: false,
+      };
+      cr.webUIListenerCallback(
+          'page-status-changed', settings.PageStatus.CONFIGURE);
+      assertFalse(syncPage.$$('#' + settings.PageStatus.CONFIGURE).hidden);
+      assertTrue(syncPage.$$('#' + settings.PageStatus.SPINNER).hidden);
+
+      // Try the deep link.
+      const params = new URLSearchParams;
+      params.append('settingId', '316');
+      settings.Router.getInstance().navigateTo(settings.routes.SYNC, params);
+
+      // Flush to make sure the dropdown expands.
+      Polymer.dom.flush();
+      const deepLinkElement = syncPage.$$('settings-sync-encryption-options')
+                                  .$$('#encryptionRadioGroup')
+                                  .buttons_[0]
+                                  .$$('#button');
+      assert(deepLinkElement);
+
+      await test_util.waitAfterNextRender(deepLinkElement);
+      assertEquals(
+          deepLinkElement, getDeepActiveElement(),
+          'Encryption option should be focused for settingId=316.');
+    });
+
     test('GAIA name and picture, account manager enabled', async () => {
       loadTimeData.overrideValues({
         isAccountManagerEnabled: true,