Settings Split: Add empty settings-per-device-touchpad subpage and route

This CL creates and tests a blank <settings-per-device-touchpad> html
element, and routes it accordingly in device_page.html.

Screenshot: http://screen/AuunpTcVRwQrLUy

Bug: b/241965700
Test: browser_tests --gtest_filter=*OSSettingsDevicePage*
Change-Id: Ifc4e0a9e8758af9d8369d02c7df57cc65c22388c
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/4067242
Reviewed-by: Michael Checo <michaelcheco@google.com>
Reviewed-by: David Padlipsky <dpad@google.com>
Commit-Queue: Danny Wang <wangdanny@google.com>
Reviewed-by: Zentaro Kavanagh <zentaro@chromium.org>
Reviewed-by: Ahmed Fakhry <afakhry@chromium.org>
Reviewed-by: Daniel Cheng <dcheng@chromium.org>
Cr-Commit-Position: refs/heads/main@{#1085272}

ash/components/arc/mojom/intent_helper.mojom

@@ -176,8 +176,9 @@ enum ChromePage {
   AUDIOANDCAPTIONS = 84,
   PERDEVICEKEYBOARD = 85,
   PERDEVICEMOUSE = 86,
+  PERDEVICETOUCHPAD = 87,
 
-  // Next value to be used is 87.
+  // Next value to be used is 88.
 };
 
 // Describes an unique chrome app.

chrome/browser/resources/settings/chromeos/device_page/device_page.html

@@ -15,7 +15,7 @@
     </template>
     <template is="dom-if" if="[[isDeviceSettingsSplitEnabled_]]">
       <cr-link-row class="hr" id="perDeviceTouchpadRow"
-          label="$i18n{touchpadTitle}"
+          label="$i18n{touchpadTitle}" on-click="onPerDeviceTouchpadTap_"
           role-description="$i18n{subpageArrowRoleDescription}">
       </cr-link-row>
     </template>
@@ -78,6 +78,13 @@
       </settings-per-device-keyboard>
     </os-settings-subpage>
   </template>
+  <template is="dom-if" route-path="/per-device-touchpad">
+    <os-settings-subpage page-title="$i18n{touchpadTitle}">
+      <settings-per-device-touchpad
+          is-device-settings-split-enabled="[[isDeviceSettingsSplitEnabled_]]">
+      </settings-per-device-touchpad>
+    </os-settings-subpage>
+  </template>
   <template is="dom-if" route-path="/keyboard-overlay">
     <os-settings-subpage page-title="$i18n{keyboardTitle}">
       <settings-keyboard prefs="{{prefs}}" focus-config="[[focusConfig_]]">

chrome/browser/resources/settings/chromeos/device_page/device_page.ts

@@ -12,6 +12,7 @@ import './display.js';
 import './keyboard.js';
 import './per_device_keyboard.js';
 import './per_device_mouse.js';
+import './per_device_touchpad.js';
 import './pointers.js';
 import './power.js';
 import './storage.js';
@@ -134,7 +135,9 @@ class SettingsDevicePageElement extends SettingsDevicePageElementBase {
           if (routes.PER_DEVICE_MOUSE) {
             map.set(routes.PER_DEVICE_MOUSE.path, '#perDeviceMouseRow');
           }
-          // TODO(@wangdanny): Add route for Per-device touchpad settings page.
+          if (routes.PER_DEVICE_TOUCHPAD) {
+            map.set(routes.PER_DEVICE_TOUCHPAD.path, '#perDeviceTouchpadRow');
+          }
           if (routes.PER_DEVICE_KEYBOARD) {
             map.set(routes.PER_DEVICE_KEYBOARD.path, '#perDeviceKeyboardRow');
           }
@@ -252,6 +255,13 @@ class SettingsDevicePageElement extends SettingsDevicePageElementBase {
     Router.getInstance().navigateTo(routes.PER_DEVICE_MOUSE);
   }
 
+  /**
+   * Handler for tapping the Touchpad settings menu item.
+   */
+  private onPerDeviceTouchpadTap_() {
+    Router.getInstance().navigateTo(routes.PER_DEVICE_TOUCHPAD);
+  }
+
   /**
    * Handler for tapping the Keyboard settings menu item.
    */

chrome/browser/resources/settings/chromeos/device_page/per_device_touchpad.html

@@ -0,0 +1 @@
+<div id="perDeviceTouchpadSubpageTitle">$i18n{touchpadTitle}</div>

chrome/browser/resources/settings/chromeos/device_page/per_device_touchpad.ts

@@ -0,0 +1,62 @@
+// Copyright 2022 The Chromium Authors
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+/**
+ * @fileoverview
+ * 'touchpad-settings' allow users to configure their touchpad settings in
+ * system settings.
+ */
+
+import '../../icons.html.js';
+import '../../settings_shared.css.js';
+
+import {I18nMixin, I18nMixinInterface} from 'chrome://resources/cr_elements/i18n_mixin.js';
+import {PolymerElement} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
+
+import {routes} from '../os_route.js';
+import {RouteObserverMixin, RouteObserverMixinInterface} from '../route_observer_mixin.js';
+import {Route} from '../router.js';
+
+import {getTemplate} from './per_device_touchpad.html.js';
+
+const SettingsPerDeviceTouchpadElementBase =
+    RouteObserverMixin(I18nMixin(PolymerElement)) as {
+      new (): PolymerElement & I18nMixinInterface & RouteObserverMixinInterface,
+    };
+
+class SettingsPerDeviceTouchpadElement extends
+    SettingsPerDeviceTouchpadElementBase {
+  static get is() {
+    return 'settings-per-device-touchpad';
+  }
+
+  static get template() {
+    return getTemplate();
+  }
+
+  static get properties() {
+    return {
+      isDeviceSettingsSplitEnabled: {
+        type: Boolean,
+        value: false,
+      },
+    };
+  }
+
+  override currentRouteChanged(route: Route): void {
+    // Does not apply to this page.
+    if (route !== routes.PER_DEVICE_TOUCHPAD) {
+      return;
+    }
+  }
+}
+
+declare global {
+  interface HTMLElementTagNameMap {
+    'settings-per-device-touchpad': SettingsPerDeviceTouchpadElement;
+  }
+}
+
+customElements.define(
+    SettingsPerDeviceTouchpadElement.is, SettingsPerDeviceTouchpadElement);

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

@@ -148,6 +148,9 @@ function createOSSettingsRoutes() {
     r.PER_DEVICE_MOUSE = createSubpage(
         r.DEVICE, routesMojomWebui.PER_DEVICE_MOUSE_SUBPAGE_PATH,
         Subpage.kPerDeviceMouse);
+    r.PER_DEVICE_TOUCHPAD = createSubpage(
+        r.DEVICE, routesMojomWebui.PER_DEVICE_TOUCHPAD_SUBPAGE_PATH,
+        Subpage.kPerDeviceTouchpad);
   }
   r.STORAGE = createSubpage(
       r.DEVICE, routesMojomWebui.STORAGE_SUBPAGE_PATH, Subpage.kStorage);

chrome/browser/resources/settings/chromeos/os_settings.gni

@@ -46,6 +46,7 @@ web_component_files = [
   "chromeos/device_page/keyboard.ts",
   "chromeos/device_page/per_device_keyboard.ts",
   "chromeos/device_page/per_device_mouse.ts",
+  "chromeos/device_page/per_device_touchpad.ts",
   "chromeos/device_page/pointers.ts",
   "chromeos/device_page/power.ts",
   "chromeos/device_page/storage.ts",

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

@@ -12,6 +12,7 @@ import './device_page/display_overscan_dialog.js';
 import './device_page/keyboard.js';
 import './device_page/per_device_keyboard.js';
 import './device_page/per_device_mouse.js';
+import './device_page/per_device_touchpad.js';
 import './device_page/pointers.js';
 import './device_page/power.js';
 import './device_page/storage.js';

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

@@ -91,6 +91,7 @@ import {Route} from './router.js';
  *   OS_PEOPLE: !Route,
  *   PER_DEVICE_KEYBOARD: !Route,
  *   PER_DEVICE_MOUSE: !Route,
+ *   PER_DEVICE_TOUCHPAD: !Route,
  *   PERSONALIZATION: !Route,
  *   POINTERS: !Route,
  *   POWER: !Route,

chrome/browser/ui/ash/arc_open_url_delegate_impl.cc

@@ -104,6 +104,8 @@ constexpr auto kOSSettingsMap = base::MakeFixedFlatMap<ChromePage,
      chromeos::settings::mojom::kPerDeviceKeyboardSubpagePath},
     {ChromePage::PERDEVICEMOUSE,
      chromeos::settings::mojom::kPerDeviceMouseSubpagePath},
+    {ChromePage::PERDEVICETOUCHPAD,
+     chromeos::settings::mojom::kPerDeviceTouchpadSubpagePath},
     {ChromePage::POINTEROVERLAY,
      chromeos::settings::mojom::kPointersSubpagePath},
     {ChromePage::POWER, chromeos::settings::mojom::kPowerSubpagePath},

chrome/browser/ui/ash/arc_open_url_delegate_impl_browsertest.cc

@@ -299,6 +299,10 @@ void TestAllOSSettingPages(const GURL& base_url) {
   TestOpenOSSettingsChromePage(
       ChromePage::PERDEVICEMOUSE,
       base_url.Resolve(chromeos::settings::mojom::kPerDeviceMouseSubpagePath));
+  TestOpenOSSettingsChromePage(
+      ChromePage::PERDEVICETOUCHPAD,
+      base_url.Resolve(
+          chromeos::settings::mojom::kPerDeviceTouchpadSubpagePath));
   TestOpenOSSettingsChromePage(
       ChromePage::HELP,
       base_url.Resolve(chromeos::settings::mojom::kAboutChromeOsSectionPath));

chrome/browser/ui/webui/settings/ash/device_section.cc

@@ -48,6 +48,7 @@ using ::chromeos::settings::mojom::kExternalStorageSubpagePath;
 using ::chromeos::settings::mojom::kKeyboardSubpagePath;
 using ::chromeos::settings::mojom::kPerDeviceKeyboardSubpagePath;
 using ::chromeos::settings::mojom::kPerDeviceMouseSubpagePath;
+using ::chromeos::settings::mojom::kPerDeviceTouchpadSubpagePath;
 using ::chromeos::settings::mojom::kPointersSubpagePath;
 using ::chromeos::settings::mojom::kPowerSubpagePath;
 using ::chromeos::settings::mojom::kStorageSubpagePath;
@@ -1014,6 +1015,13 @@ void DeviceSection::RegisterHierarchy(HierarchyGenerator* generator) const {
                                        mojom::SearchResultIcon::kMouse,
                                        mojom::SearchResultDefaultRank::kMedium,
                                        mojom::kPerDeviceMouseSubpagePath);
+
+    // Per-device Touchpad.
+    generator->RegisterTopLevelSubpage(IDS_SETTINGS_TOUCHPAD_TITLE,
+                                       mojom::Subpage::kPerDeviceTouchpad,
+                                       mojom::SearchResultIcon::kDisplay,
+                                       mojom::SearchResultDefaultRank::kMedium,
+                                       mojom::kPerDeviceTouchpadSubpagePath);
   }
 
   // Keyboard.

chrome/browser/ui/webui/settings/chromeos/constants/routes.mojom

@@ -82,6 +82,7 @@ enum Subpage {
   kAudio = 408,
   kPerDeviceKeyboard = 409,
   kPerDeviceMouse = 410,
+  kPerDeviceTouchpad = 411,
 
   // Personalization section.
   // 500 was used for kChangePicture. Do not reuse.
@@ -207,6 +208,7 @@ const string kDeviceSectionPath = "device";
 const string kPointersSubpagePath = "pointer-overlay";
 const string kPerDeviceKeyboardSubpagePath = "per-device-keyboard";
 const string kPerDeviceMouseSubpagePath = "per-device-mouse";
+const string kPerDeviceTouchpadSubpagePath = "per-device-touchpad";
 const string kKeyboardSubpagePath = "keyboard-overlay";
 const string kStylusSubpagePath = "stylus";
 const string kDisplaySubpagePath = "display";

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

@@ -24,6 +24,7 @@ const TestNames = {
   Display: 'display',
   Keyboard: 'keyboard',
   PerDeviceMouse: 'per-device mouse',
+  PerDeviceTouchpad: 'per-device touchpad',
   NightLight: 'night light',
   PerDeviceKeyboard: 'per-device keyboard',
   Pointers: 'pointers',
@@ -638,6 +639,32 @@ suite('SettingsDevicePage', function() {
     });
   });
 
+  suite(assert(TestNames.PerDeviceTouchpad), function() {
+    let perDeviceTouchpadPage;
+
+    setup(async function() {
+      await init();
+      const row = assert(
+          devicePage.shadowRoot.querySelector(`#main #perDeviceTouchpadRow`));
+      row.click();
+      assertEquals(
+          routes.PER_DEVICE_TOUCHPAD, Router.getInstance().getCurrentRoute());
+      const page =
+          devicePage.shadowRoot.querySelector('settings-per-device-touchpad');
+      assert(page);
+      return Promise.resolve(page).then(function(page) {
+        perDeviceTouchpadPage = page;
+      });
+    });
+
+    test('per-device touchpad subpage visibility', function() {
+      assertEquals(
+          routes.PER_DEVICE_TOUCHPAD, Router.getInstance().getCurrentRoute());
+      assertTrue(isVisible(perDeviceTouchpadPage.shadowRoot.querySelector(
+          '#perDeviceTouchpadSubpageTitle')));
+    });
+  });
+
   suite(assert(TestNames.Audio), function() {
     let audioPage;
 

tools/metrics/histograms/enums.xml

@@ -75820,6 +75820,7 @@ Called by update_net_trust_anchors.py.-->
   <int value="408" label="Audio"/>
   <int value="409" label="Per-device Keyboard"/>
   <int value="410" label="Per-device Mouse"/>
+  <int value="411" label="Per-device Touchpad"/>
   <int value="500" label="Change Picture"/>
   <int value="501" label="Ambient Mode"/>
   <int value="502" label="Ambient Mode Photos (Deprecated)"/>