Diagnostics: show correct top right key on keyboard diagram

Change-Id: Ibb406c818d27bcceddadb1809471d852ab498551
Bug: 1207678
Test: check icon and behaviour on Morphius, Eve, Wormdingler, and Sarien
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/3556727
Reviewed-by: Jimmy Gong <jimmyxgong@chromium.org>
Commit-Queue: Harry Cutts <hcutts@chromium.org>
Cr-Commit-Position: refs/heads/main@{#987058}

ash/webui/common/keyboard_diagram_strings.cc

@@ -33,6 +33,8 @@ void AddKeyboardDiagramStrings(content::WebUIDataSource* html_source) {
       {"keyboardDiagramAriaNameBack", IDS_KEYBOARD_DIAGRAM_ARIA_NAME_BACK},
       {"keyboardDiagramAriaNameBackspace",
        IDS_KEYBOARD_DIAGRAM_ARIA_NAME_BACKSPACE},
+      {"keyboardDiagramAriaNameControlPanel",
+       IDS_KEYBOARD_DIAGRAM_ARIA_NAME_CONTROL_PANEL},
       {"keyboardDiagramAriaNameEnter", IDS_KEYBOARD_DIAGRAM_ARIA_NAME_ENTER},
       {"keyboardDiagramAriaNameForward",
        IDS_KEYBOARD_DIAGRAM_ARIA_NAME_FORWARD},
@@ -48,6 +50,7 @@ void AddKeyboardDiagramStrings(content::WebUIDataSource* html_source) {
        IDS_KEYBOARD_DIAGRAM_ARIA_NAME_LAUNCHER},
       {"keyboardDiagramAriaNameLayoutSwitch",
        IDS_KEYBOARD_DIAGRAM_ARIA_NAME_LAYOUT_SWITCH},
+      {"keyboardDiagramAriaNameLock", IDS_KEYBOARD_DIAGRAM_ARIA_NAME_LOCK},
       {"keyboardDiagramAriaNameMute", IDS_KEYBOARD_DIAGRAM_ARIA_NAME_MUTE},
       {"keyboardDiagramAriaNameOverview",
        IDS_KEYBOARD_DIAGRAM_ARIA_NAME_OVERVIEW},

ash/webui/common/resources/keyboard_diagram.html

@@ -247,8 +247,10 @@
         </template>
       </dom-repeat>
       <keyboard-key
-          icon="keyboard:power"
-          aria-name="[[i18n('keyboardDiagramAriaNamePower')]]">
+          id="topRightKey"
+          icon="[[topRightKeyIcon_]]"
+          aria-name="[[i18n(topRightKeyAriaNameI18n_)]]"
+          data-code$="[[topRightKeyCode_]]">
       </keyboard-key>
     </div>
 

ash/webui/common/resources/keyboard_diagram.js

@@ -40,6 +40,16 @@ export const PhysicalLayout = {
   kChromeOSDellEnterpriseDrallion: 'dell-enterprise-drallion',
 };
 
+/**
+ * Enum of top-right keys supported by the component.
+ * @enum {string}
+ */
+export const TopRightKey = {
+  kPower: 'power',
+  kLock: 'lock',
+  kControlPanel: 'control-panel',
+};
+
 /**
  * Enum of action keys to be shown on the top row.
  * @enum {!Object<string,
@@ -188,6 +198,33 @@ export class KeyboardDiagramElement extends KeyboardDiagramElementBase {
         type: Array,
         value: [],
       },
+
+      /**
+       * The icon to display on the top-right key.
+       * @type {?TopRightKey}
+       */
+      topRightKey: {
+        type: String,
+        value: TopRightKey.kLock,
+      },
+
+      /** @protected {number} */
+      topRightKeyCode_: {
+        type: Number,
+        computed: 'computeTopRightKeyCode_(topRightKey)',
+      },
+
+      /** @protected {string} */
+      topRightKeyIcon_: {
+        type: String,
+        computed: 'computeTopRightKeyIcon_(topRightKey)',
+      },
+
+      /** @protected {string} */
+      topRightKeyAriaNameI18n_: {
+        type: String,
+        computed: 'computeTopRightKeyAriaNameI18n_(topRightKey)',
+      },
     };
   }
 
@@ -201,6 +238,41 @@ export class KeyboardDiagramElement extends KeyboardDiagramElementBase {
         physicalLayout == PhysicalLayout.kChromeOSDellEnterpriseDrallion;
   }
 
+  /**
+   * @param {?TopRightKey} topRightKey
+   * @return {number}
+   * @private
+   */
+  computeTopRightKeyCode_(topRightKey) {
+    return {
+      [TopRightKey.kPower]: 116,
+      [TopRightKey.kLock]: 142,
+      [TopRightKey.kControlPanel]: 579,
+    }[topRightKey];
+  }
+
+  /**
+   * @param {?TopRightKey} topRightKey
+   * @return {string}
+   * @private
+   */
+  computeTopRightKeyIcon_(topRightKey) {
+    return 'keyboard:' + topRightKey;
+  }
+
+  /**
+   * @param {?TopRightKey} topRightKey
+   * @return {string}
+   * @private
+   */
+  computeTopRightKeyAriaNameI18n_(topRightKey) {
+    return {
+      [TopRightKey.kPower]: 'keyboardDiagramAriaNamePower',
+      [TopRightKey.kLock]: 'keyboardDiagramAriaNameLock',
+      [TopRightKey.kControlPanel]: 'keyboardDiagramAriaNameControlPanel',
+    }[topRightKey];
+  }
+
   constructor() {
     super();
 

ash/webui/common/resources/keyboard_icons.html

@@ -14,6 +14,7 @@
       </g>
       <g id="back"><path d="M20 11H7.83l5.59-5.59L12 4l-8 8 8 8 1.41-1.41L7.83 13H20v-2z"></g>
       <g id="backspace"><path fill-rule="evenodd" clip-rule="evenodd" d="M8 12.59L10.59 10L8 7.41L9.41 6L12 8.59L14.59 6L16 7.41L13.41 10L16 12.59L14.59 14L12 11.41L9.41 14L8 12.59ZM7 5L2.5 10L7.5 15H18V5H7ZM20 5V15C20 16.1 19.1 17 18 17H7C6.37 17 5.78 16.7 5.4 16.2L0 10L5.4 3.8C5.78 3.3 6.37 3 7 3H18C19.1 3 20 3.9 20 5Z"></path></g>
+      <g id="control-panel" viewbox="0 0 20 20"><path d="M2 4h16v2H2zM2 9h16v2H2zM2 14h16v2H2z"></path></g>
       <g id="display-brightness-down" viewbox="0 0 20 20"><path fill-rule="evenodd" d="M9.99982 4.13281L11.7889 5.87499H14.1285V8.15322L15.7799 9.76139L14.1285 11.5036V13.7818H11.7889L9.99982 15.39L8.34836 13.7818H6.00878V11.5036L4.21973 9.76139L6.00878 8.15322V5.87499H8.34836L9.99982 4.13281ZM9.99982 6.41105L8.89883 7.48315H7.66025V8.68928L6.5593 9.76139L7.66025 10.9675V12.0396H8.89883L9.99982 13.2457L11.2384 12.0396H12.3394V10.9675L13.5779 9.76139L12.3394 8.68928V7.48315H11.2384L9.99982 6.41105Z"></g>
       <g id="display-brightness-up" viewbox="0 0 20 20"><path fill-rule="evenodd" d="M10.0686 2.64844L12.2706 4.92667H15.2982V7.87497L17.5002 10.0192L15.2982 12.1634V15.2457H12.2706L10.0686 17.3899L7.72908 15.2457H4.70145V12.1634L2.49951 10.0192L4.70145 7.87497V4.92667H7.72908L10.0686 2.64844ZM10.0686 4.92667L8.2796 6.53484H6.4905V8.27701L4.70145 10.0192L6.4905 11.7614V13.5035H8.2796L10.0686 15.2457L11.7201 13.5035H13.5092V11.7614L15.2982 10.0192L13.5092 8.27701V6.53484H11.7201L10.0686 4.92667Z"></g>
       <g id="electronic-privacy-screen" viewbox="0 0 20 20"><path fill-rule="evenodd" d="M18 3V17H2V3H18ZM16 15H5.07314L15.0731 5H16V15ZM4 10.8284V13.2447L12.2447 5H9.82838L4 10.8284ZM6.99995 5L4 7.99995V5H6.99995Z"></g>
@@ -42,6 +43,10 @@
         <path fill-rule="evenodd" d="M10 18.5C14.6944 18.5 18.5 14.6944 18.5 10C18.5 5.30558 14.6944 1.5 10 1.5C5.30558 1.5 1.5 5.30558 1.5 10C1.5 14.6944 5.30558 18.5 10 18.5ZM17 10C17 13.866 13.866 17 10 17C6.13401 17 3 13.866 3 10C3 6.13401 6.13401 3 10 3C13.866 3 17 6.13401 17 10Z"></path>
       </g>
       <g id="layout-switch"><path d="M11.99 2C6.47 2 2 6.48 2 12s4.47 10 9.99 10C17.52 22 22 17.52 22 12S17.52 2 11.99 2zm6.93 6h-2.95c-.32-1.25-.78-2.45-1.38-3.56 1.84.63 3.37 1.91 4.33 3.56zM12 4.04c.83 1.2 1.48 2.53 1.91 3.96h-3.82c.43-1.43 1.08-2.76 1.91-3.96zM4.26 14C4.1 13.36 4 12.69 4 12s.1-1.36.26-2h3.38c-.08.66-.14 1.32-.14 2 0 .68.06 1.34.14 2H4.26zm.82 2h2.95c.32 1.25.78 2.45 1.38 3.56-1.84-.63-3.37-1.9-4.33-3.56zm2.95-8H5.08c.96-1.66 2.49-2.93 4.33-3.56C8.81 5.55 8.35 6.75 8.03 8zM12 19.96c-.83-1.2-1.48-2.53-1.91-3.96h3.82c-.43 1.43-1.08 2.76-1.91 3.96zM14.34 14H9.66c-.09-.66-.16-1.32-.16-2 0-.68.07-1.35.16-2h4.68c.09.65.16 1.32.16 2 0 .68-.07 1.34-.16 2zm.25 5.56c.6-1.11 1.06-2.31 1.38-3.56h2.95c-.96 1.65-2.49 2.93-4.33 3.56zM16.36 14c.08-.66.14-1.32.14-2 0-.68-.06-1.34-.14-2h3.38c.16.64.26 1.31.26 2s-.1 1.36-.26 2h-3.38z"></path></g>
+      <g id="lock" viewBox="0 0 20 20">
+        <path d="M11.75 12.5C11.75 13.4665 10.9665 14.25 10 14.25C9.0335 14.25 8.25 13.4665 8.25 12.5C8.25 11.5335 9.0335 10.75 10 10.75C10.9665 10.75 11.75 11.5335 11.75 12.5Z"></path>
+        <path fill-rule="evenodd" clip-rule="evenodd" d="M14 7H13.5V5C13.5 3.34315 11.6569 2 10 2C8.34315 2 6.5 3.34315 6.5 5V7H6C4.89543 7 4 7.89543 4 9V16C4 17.1046 4.89543 18 6 18H14C15.1046 18 16 17.1046 16 16V9C16 7.89543 15.1046 7 14 7ZM12 5.5V7H8V5.5C8 5 8.5 3.5 10 3.5C11.5 3.5 12 5 12 5.5ZM6 9V16H14V9H6Z"></path>
+      </g>
       <g id="next-track" viewbox="0 0 20 20">
         <!--
           This is actually the fast forward icon, to match the Chrome OS

ash/webui/diagnostics_ui/resources/fake_data.js

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import {AuthenticationType, BatteryChargeStatus, BatteryHealth, BatteryInfo, BatteryState, ConnectionType, CpuUsage, ExternalPowerSource, KeyboardInfo, LockType, MechanicalLayout, MemoryUsage, Network, NetworkGuidInfo, NetworkState, NetworkType, NumberPadPresence, PhysicalLayout, PowerRoutineResult, RoamingState, RoutineType, SecurityType, StandardRoutineResult, SystemInfo, TopRowKey, TouchDeviceInfo, TouchDeviceType, WiFiStateProperties} from './diagnostics_types.js';
+import {AuthenticationType, BatteryChargeStatus, BatteryHealth, BatteryInfo, BatteryState, ConnectionType, CpuUsage, ExternalPowerSource, KeyboardInfo, LockType, MechanicalLayout, MemoryUsage, Network, NetworkGuidInfo, NetworkState, NetworkType, NumberPadPresence, PhysicalLayout, PowerRoutineResult, RoamingState, RoutineType, SecurityType, StandardRoutineResult, SystemInfo, TopRightKey, TopRowKey, TouchDeviceInfo, TouchDeviceType, WiFiStateProperties} from './diagnostics_types.js';
 import {stringToMojoString16} from './mojo_utils.js';
 
 /** @type {!Array<!BatteryChargeStatus>} */
@@ -636,6 +636,7 @@ export const fakeKeyboards = [
       TopRowKey.kScreenBrightnessDown, TopRowKey.kScreenBrightnessUp,
       TopRowKey.kVolumeMute, TopRowKey.kVolumeDown, TopRowKey.kVolumeUp
     ],
+    topRightKey: TopRightKey.kPower,
     numberPadPresent: NumberPadPresence.kPresent,
   },
 ];

ash/webui/diagnostics_ui/resources/keyboard_tester.html

@@ -36,7 +36,8 @@
             region-code="[[keyboard.regionCode]]"
             show-assistant-key="[[keyboard.hasAssistantKey]]"
             show-number-pad="[[showNumberPad_]]"
-            top-row-keys="[[topRowKeys_]]">
+            top-row-keys="[[topRowKeys_]]"
+            top-right-key="[[diagramTopRightKey_]]">
         </keyboard-diagram>
       </div>
     </template>

ash/webui/diagnostics_ui/resources/keyboard_tester.js

@@ -4,13 +4,13 @@
 
 import 'chrome://resources/cr_elements/cr_dialog/cr_dialog.m.js';
 
-import {MechanicalLayout as DiagramMechanicalLayout, PhysicalLayout as DiagramPhysicalLayout, TopRowKey as DiagramTopRowKey} from 'chrome://resources/ash/common/keyboard_diagram.js';
+import {MechanicalLayout as DiagramMechanicalLayout, PhysicalLayout as DiagramPhysicalLayout, TopRightKey as DiagramTopRightKey, TopRowKey as DiagramTopRowKey} from 'chrome://resources/ash/common/keyboard_diagram.js';
 import {KeyboardKeyState} from 'chrome://resources/ash/common/keyboard_key.js';
 import {assert} from 'chrome://resources/js/assert.m.js';
 import {I18nBehavior} from 'chrome://resources/js/i18n_behavior.m.js';
 import {html, Polymer} from 'chrome://resources/polymer/v3_0/polymer/polymer_bundled.min.js';
 
-import {InputDataProviderInterface, KeyboardInfo, KeyboardObserverInterface, KeyboardObserverReceiver, KeyEvent, KeyEventType, MechanicalLayout, NumberPadPresence, PhysicalLayout, TopRowKey} from './diagnostics_types.js';
+import {InputDataProviderInterface, KeyboardInfo, KeyboardObserverInterface, KeyboardObserverReceiver, KeyEvent, KeyEventType, MechanicalLayout, NumberPadPresence, PhysicalLayout, TopRightKey, TopRowKey} from './diagnostics_types.js';
 
 /**
  * @fileoverview
@@ -45,6 +45,13 @@ const topRowKeyMap = {
   [TopRowKey.kUnknown]: DiagramTopRowKey.kUnknown,
 };
 
+/** Maps top-right key evdev codes to the corresponding DiagramTopRightKey. */
+const topRightKeyByCode = new Map([
+  [116, DiagramTopRightKey.kPower],
+  [142, DiagramTopRightKey.kLock],
+  [579, DiagramTopRightKey.kControlPanel],
+]);
+
 Polymer({
   is: 'keyboard-tester',
 
@@ -95,6 +102,14 @@ Polymer({
       computed: 'computeDiagramPhysicalLayout_(keyboard)',
     },
 
+    // TODO(crbug.com/1257138): use the proper type annotation instead of
+    // string.
+    /** @protected {?string} */
+    diagramTopRightKey_: {
+      type: String,
+      computed: 'computeDiagramTopRightKey_(keyboard)',
+    },
+
     /** @private */
     showNumberPad_: {
       type: Boolean,
@@ -163,6 +178,24 @@ Polymer({
     }[keyboardInfo.physicalLayout];
   },
 
+  /**
+   * @param {?KeyboardInfo} keyboardInfo
+   * TODO(crbug.com/1257138): use the proper type annotation instead of string.
+   * @return {?string}
+   * @private
+   */
+  computeDiagramTopRightKey_(keyboardInfo) {
+    if (!keyboardInfo) {
+      return null;
+    }
+    return {
+      [TopRightKey.kUnknown]: null,
+      [TopRightKey.kPower]: DiagramTopRightKey.kPower,
+      [TopRightKey.kLock]: DiagramTopRightKey.kLock,
+      [TopRightKey.kControlPanel]: DiagramTopRightKey.kControlPanel,
+    }[keyboardInfo.topRightKey];
+  },
+
   /**
    * @param {?KeyboardInfo} keyboard
    * @return {boolean}
@@ -217,13 +250,32 @@ Polymer({
    * @param {!KeyEvent} keyEvent
    */
   onKeyEvent(keyEvent) {
+    const diagram = this.$$('#diagram');
     const state = keyEvent.type === KeyEventType.kPress ?
         KeyboardKeyState.kPressed :
         KeyboardKeyState.kTested;
-    if (keyEvent.topRowPosition !== -1) {
-      this.$$('#diagram').setTopRowKeyState(keyEvent.topRowPosition, state);
+    if (keyEvent.topRowPosition !== -1 &&
+        keyEvent.topRowPosition < this.keyboard.topRowKeys.length) {
+      diagram.setTopRowKeyState(keyEvent.topRowPosition, state);
     } else {
-      this.$$('#diagram').setKeyState(keyEvent.keyCode, state);
+      // We can't be sure that the top right key reported over Mojo is correct,
+      // so we need to fix it if we see a key event that suggests it's wrong.
+      if (topRightKeyByCode.has(keyEvent.keyCode) &&
+          diagram.topRightKey !== topRightKeyByCode.get(keyEvent.keyCode)) {
+        const newValue = topRightKeyByCode.get(keyEvent.keyCode);
+        console.warn(
+            'Corrected diagram top right key from ' +
+            `${this.diagramTopRightKey_} to ${newValue}`);
+        diagram.topRightKey = newValue;
+      }
+
+      // Some Chromebooks (at least the Lenovo ThinkPad C13 Yoga a.k.a.
+      // Morphius) report F13 instead of SLEEP when Lock is pressed.
+      if (keyEvent.keyCode === 183 /* KEY_F13 */) {
+        keyEvent.keyCode = 142 /* KEY_SLEEP */;
+      }
+
+      diagram.setKeyState(keyEvent.keyCode, state);
     }
   },
 

chrome/test/data/webui/chromeos/ash_common/keyboard_diagram_test.js

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import {MechanicalLayout, PhysicalLayout, TopRowKey} from 'chrome://resources/ash/common/keyboard_diagram.js';
+import {MechanicalLayout, PhysicalLayout, TopRightKey, TopRowKey} from 'chrome://resources/ash/common/keyboard_diagram.js';
 import {KeyboardKeyState} from 'chrome://resources/ash/common/keyboard_key.js';
 import {loadTimeData} from 'chrome://resources/js/load_time_data.m.js';
 
@@ -29,6 +29,7 @@ export function keyboardDiagramTestSuite() {
         'keyboardDiagramAriaNameAssistant': 'Assistant',
         'keyboardDiagramAriaNameBack': 'Back',
         'keyboardDiagramAriaNameBackspace': 'Backspace',
+        'keyboardDiagramAriaNameControlPanel': 'Control Panel',
         'keyboardDiagramAriaNameEnter': 'Enter',
         'keyboardDiagramAriaNameForward': 'Forward',
         'keyboardDiagramAriaNameFullscreen': 'Fullscreen',
@@ -38,6 +39,7 @@ export function keyboardDiagramTestSuite() {
         'keyboardDiagramAriaNameKeyboardBacklightUp': 'Keyboard brightness up',
         'keyboardDiagramAriaNameLauncher': 'Launcher',
         'keyboardDiagramAriaNameLayoutSwitch': 'Layout switch',
+        'keyboardDiagramAriaNameLock': 'Lock',
         'keyboardDiagramAriaNameMute': 'Mute',
         'keyboardDiagramAriaNameOverview': 'Overview',
         'keyboardDiagramAriaNamePlayPause': 'Play/Pause',
@@ -195,6 +197,18 @@ export function keyboardDiagramTestSuite() {
     assertEquals('delete', keyElements[6].mainGlyph);
   });
 
+  test('topRightKey', async () => {
+    diagramElement.topRightKey = TopRightKey.kPower;
+    await flushTasks();
+
+    const topRightKey = diagramElement.$.topRightKey;
+    assertEquals('keyboard:power', topRightKey.icon);
+    assertEquals('Power', topRightKey.ariaName);
+
+    diagramElement.setKeyState(116 /* KEY_POWER */, KeyboardKeyState.kPressed);
+    assertEquals(KeyboardKeyState.kPressed, topRightKey.state);
+  });
+
   test('setKeyState', async () => {
     const backspaceKey = diagramElement.root.getElementById('backspaceKey');
     assertEquals(KeyboardKeyState.kNotPressed, backspaceKey.state);

chrome/test/data/webui/chromeos/diagnostics/BUILD.gn

@@ -242,6 +242,17 @@ js_library("ip_config_info_drawer_test") {
   externs_list = [ "$externs_path/mocha-2.5.js" ]
 }
 
+js_library("keyboard_tester_test") {
+  deps = [
+    "../..:chai_assert",
+    "../..:mock_controller",
+    "../..:test_util",
+    "//ash/webui/diagnostics_ui/resources:fake_data",
+    "//ash/webui/diagnostics_ui/resources:input_card",
+  ]
+  externs_list = [ "$externs_path/mocha-2.5.js" ]
+}
+
 js_library("memory_card_test") {
   deps = [
     "../..:chai_assert",

chrome/test/data/webui/chromeos/diagnostics/diagnostics_app_unified_test.js

@@ -22,6 +22,7 @@ import {frequencyChannelUtilsTestSuite} from './frequency_channel_utils_test.js'
 import {inputCardTestSuite} from './input_card_test.js';
 import {inputListTestSuite} from './input_list_test.js';
 import {ipConfigInfoDrawerTestSuite} from './ip_config_info_drawer_test.js';
+import {keyboardTesterTestSuite} from './keyboard_tester_test.js';
 import {memoryCardTestSuite} from './memory_card_test.js';
 import {fakeMojoProviderTestSuite} from './mojo_interface_provider_test.js';
 import {networkCardTestSuite} from './network_card_test.js';
@@ -72,6 +73,7 @@ runSuite('FrequencyChannelUtils', frequencyChannelUtilsTestSuite);
 runSuite('InputCard', inputCardTestSuite, 'input');
 runSuite('InputList', inputListTestSuite, 'input');
 runSuite('IpConfigInfoDrawer', ipConfigInfoDrawerTestSuite, 'network');
+runSuite('KeyboardTester', keyboardTesterTestSuite, 'input');
 runSuite('MemoryCard', memoryCardTestSuite);
 runSuite('NetworkCard', networkCardTestSuite, 'network');
 runSuite('NetworkInfo', networkInfoTestSuite, 'network');

chrome/test/data/webui/chromeos/diagnostics/diagnostics_browsertest.js

@@ -89,6 +89,7 @@ const debug_suites_list = [
   'InputCard',
   'InputList',
   'IpConfigInfoDrawer',
+  'KeyboardTester',
   'MemoryCard',
   'NetworkCard',
   'NetworkInfo',

chrome/test/data/webui/chromeos/diagnostics/input_card_test.js

@@ -2,7 +2,7 @@
 // Use of this source code is governed by a BSD-style license that can be
 // found in the LICENSE file.
 
-import {ConnectionType, KeyboardInfo, MechanicalLayout, NumberPadPresence, PhysicalLayout} from 'chrome://diagnostics/diagnostics_types.js';
+import {ConnectionType, KeyboardInfo, MechanicalLayout, NumberPadPresence, PhysicalLayout, TopRightKey, TopRowKey} from 'chrome://diagnostics/diagnostics_types.js';
 import {InputCardType} from 'chrome://diagnostics/input_card.js';
 import {assertEquals, assertFalse, assertTrue} from '../../chai_assert.js';
 import {flushTasks} from '../../test_util.js';
@@ -17,6 +17,13 @@ const keyboards = [
     mechanicalLayout: MechanicalLayout.kAnsi,
     hasAssistantKey: true,
     numberPadPresent: NumberPadPresence.kPresent,
+    topRowKeys: [
+      TopRowKey.kBack, TopRowKey.kForward, TopRowKey.kRefresh,
+      TopRowKey.kFullscreen, TopRowKey.kOverview,
+      TopRowKey.kScreenBrightnessDown, TopRowKey.kScreenBrightnessUp,
+      TopRowKey.kVolumeMute, TopRowKey.kVolumeDown, TopRowKey.kVolumeUp
+    ],
+    topRightKey: TopRightKey.kLock,
   },
   {
     id: 10,
@@ -26,6 +33,8 @@ const keyboards = [
     mechanicalLayout: MechanicalLayout.kUnknown,
     hasAssistantKey: false,
     numberPadPresent: NumberPadPresence.kUnknown,
+    topRowKeys: [],
+    topRightKey: TopRightKey.kUnknown,
   },
 ];