History Web UI: Split interactive UI test suites into separate files

Instead of inlining 3 different test suites in a single TEST_F, split
these test suites into separate files and run them as 3 different
tests.

This is in preparation for migrating history to Polymer 3, since the
main test file cannot be a module script, but the file(s) containing the
tests themselves will need to be module scripts in order to import from
the Polymer 3/modularized code.

Bug: 1022212
Change-Id: I6bc5e38a3482616cadfeaab09d0d204208b2e6cb
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/1928213Reviewed-by: Hector Carmona <hcarmona@chromium.org>
Commit-Queue: Rebekah Potter <rbpotter@chromium.org>
Cr-Commit-Position: refs/heads/master@{#717870}

chrome/test/data/webui/history/history_list_focus_test.js

+// Copyright 2019 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+suite('<history-list>', function() {
+  let app;
+  let element;
+  const TEST_HISTORY_RESULTS = [
+    createHistoryEntry('2016-03-15', 'https://www.google.com'),
+    createHistoryEntry('2016-03-14 10:00', 'https://www.example.com'),
+    createHistoryEntry('2016-03-14 9:00', 'https://www.google.com'),
+    createHistoryEntry('2016-03-13', 'https://en.wikipedia.org')
+  ];
+  TEST_HISTORY_RESULTS[2].starred = true;
+
+  setup(function() {
+    app = replaceApp();
+    element = app.$.history;
+    return test_util.flushTasks();
+  });
+
+  test('list focus and keyboard nav', async () => {
+    app.historyResult(createHistoryInfo(), TEST_HISTORY_RESULTS);
+    let focused;
+    await test_util.flushTasks();
+    Polymer.dom.flush();
+    const items = polymerSelectAll(element, 'history-item');
+
+    items[2].$.checkbox.focus();
+    focused = items[2].$.checkbox.getFocusableElement();
+
+    // Wait for next render to ensure that focus handlers have been
+    // registered (see HistoryItemElement.attached).
+    await test_util.waitAfterNextRender(this);
+
+    MockInteractions.pressAndReleaseKeyOn(focused, 39, [], 'ArrowRight');
+    Polymer.dom.flush();
+    focused = items[2].$.link;
+    assertEquals(focused, element.lastFocused_);
+    assertTrue(items[2].row_.isActive());
+    assertFalse(items[3].row_.isActive());
+
+    MockInteractions.pressAndReleaseKeyOn(focused, 40, [], 'ArrowDown');
+    Polymer.dom.flush();
+    focused = items[3].$.link;
+    assertEquals(focused, element.lastFocused_);
+    assertFalse(items[2].row_.isActive());
+    assertTrue(items[3].row_.isActive());
+
+    MockInteractions.pressAndReleaseKeyOn(focused, 39, [], 'ArrowRight');
+    Polymer.dom.flush();
+    focused = items[3].$['menu-button'];
+    assertEquals(focused, element.lastFocused_);
+    assertFalse(items[2].row_.isActive());
+    assertTrue(items[3].row_.isActive());
+
+    MockInteractions.pressAndReleaseKeyOn(focused, 38, [], 'ArrowUp');
+    Polymer.dom.flush();
+    focused = items[2].$['menu-button'];
+    assertEquals(focused, element.lastFocused_);
+    assertTrue(items[2].row_.isActive());
+    assertFalse(items[3].row_.isActive());
+
+    MockInteractions.pressAndReleaseKeyOn(focused, 37, [], 'ArrowLeft');
+    Polymer.dom.flush();
+    focused = items[2].$$('#bookmark-star');
+    assertEquals(focused, element.lastFocused_);
+    assertTrue(items[2].row_.isActive());
+    assertFalse(items[3].row_.isActive());
+
+    MockInteractions.pressAndReleaseKeyOn(focused, 40, [], 'ArrowDown');
+    Polymer.dom.flush();
+    focused = items[3].$.link;
+    assertEquals(focused, element.lastFocused_);
+    assertFalse(items[2].row_.isActive());
+    assertTrue(items[3].row_.isActive());
+  });
+});

chrome/test/data/webui/history/history_synced_device_manager_focus_test.js

+// Copyright 2019 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+suite('<history-synced-device-manager>', function() {
+  let element;
+
+  setup(function() {
+    element = document.createElement('history-synced-device-manager');
+    element.signInState = true;
+    element.searchTerm = '';
+    replaceBody(element);
+  });
+
+  test('focus and keyboard nav', async () => {
+    const sessionList = [
+      createSession(
+          'Nexus 5',
+          [createWindow(['http://www.example.com', 'http://www.google.com'])]),
+      createSession('Pixel C', [createWindow(['http://www.badssl.com'])]),
+      createSession('Potato', [createWindow(['http://www.wikipedia.org'])]),
+    ];
+
+    element.sessionList = sessionList;
+
+    let lastFocused;
+    let cards;
+    let focused;
+    const onFocusHandler = element.focusGrid_.onFocus;
+    element.focusGrid_.onFocus = function(row, e) {
+      onFocusHandler.call(element.focusGrid_, row, e);
+      lastFocused = e.currentTarget;
+    };
+
+    await test_util.flushTasks();
+    cards = polymerSelectAll(element, 'history-synced-device-card');
+
+    focused = cards[0].$['menu-button'];
+    focused.focus();
+
+    // Go to the collapse button.
+    MockInteractions.pressAndReleaseKeyOn(focused, 39, [], 'ArrowRight');
+    focused = cards[0].$['collapse-button'];
+    assertEquals(focused, lastFocused);
+
+    // Go to the first url.
+    MockInteractions.pressAndReleaseKeyOn(focused, 40, [], 'ArrowDown');
+    focused = polymerSelectAll(cards[0], '.website-link')[0];
+    assertEquals(focused, lastFocused);
+
+    // Collapse the first card.
+    MockInteractions.pressAndReleaseKeyOn(focused, 38, [], 'ArrowUp');
+    focused = cards[0].$['collapse-button'];
+    assertEquals(focused, lastFocused);
+    MockInteractions.tap(focused);
+    await test_util.flushTasks();
+
+    // Pressing down goes to the next card.
+    MockInteractions.pressAndReleaseKeyOn(focused, 40, [], 'ArrowDown');
+    focused = cards[1].$['collapse-button'];
+    assertEquals(focused, lastFocused);
+
+    // Expand the first card.
+    MockInteractions.pressAndReleaseKeyOn(focused, 38, [], 'ArrowUp');
+    focused = cards[0].$['collapse-button'];
+    assertEquals(focused, lastFocused);
+    MockInteractions.tap(focused);
+    await test_util.flushTasks();
+
+    // First card's urls are focusable again.
+    MockInteractions.pressAndReleaseKeyOn(focused, 40, [], 'ArrowDown');
+    focused = polymerSelectAll(cards[0], '.website-link')[0];
+    assertEquals(focused, lastFocused);
+
+    // Remove the second URL from the first card.
+    sessionList[0].windows[0].tabs.splice(1, 1);
+    element.sessionList = sessionList.slice();
+    await test_util.flushTasks();
+
+    cards = polymerSelectAll(element, 'history-synced-device-card');
+
+    // Go to the next card's menu buttons.
+    MockInteractions.pressAndReleaseKeyOn(focused, 40, [], 'ArrowDown');
+    focused = cards[1].$['collapse-button'];
+    assertEquals(focused, lastFocused);
+
+    MockInteractions.pressAndReleaseKeyOn(focused, 38, [], 'ArrowUp');
+    focused = polymerSelectAll(cards[0], '.website-link')[0];
+    assertEquals(focused, lastFocused);
+
+    // Remove the second card.
+    sessionList.splice(1, 1);
+    element.sessionList = sessionList.slice();
+    await test_util.flushTasks();
+
+    cards = polymerSelectAll(element, 'history-synced-device-card');
+
+    // Pressing down goes to the next card.
+    MockInteractions.pressAndReleaseKeyOn(focused, 40, [], 'ArrowDown');
+    focused = cards[1].$['collapse-button'];
+    assertEquals(focused, lastFocused);
+  });
+});

chrome/test/data/webui/history/history_toolbar_focus_test.js

+// Copyright 2019 The Chromium Authors. All rights reserved.
+// Use of this source code is governed by a BSD-style license that can be
+// found in the LICENSE file.
+
+suite('<history-toolbar>', function() {
+  let app;
+  let toolbar;
+
+  setup(function() {
+    window.resultsRendered = false;
+    app = replaceApp();
+
+    toolbar = app.$['toolbar'];
+  });
+
+  test('search bar is focused on load in wide mode', async () => {
+    toolbar.$['main-toolbar'].narrow = false;
+
+    historyResult(createHistoryInfo(), []);
+    await test_util.flushTasks();
+
+    // Ensure the search bar is focused on load.
+    assertTrue(
+        app.$.toolbar.$['main-toolbar'].getSearchField().isSearchFocused());
+  });
+
+  test('search bar is not focused on load in narrow mode', async () => {
+    toolbar.$['main-toolbar'].narrow = true;
+
+    historyResult(createHistoryInfo(), []);
+    await test_util.flushTasks();
+    // Ensure the search bar is focused on load.
+    assertFalse($('history-app')
+                    .$.toolbar.$['main-toolbar']
+                    .getSearchField()
+                    .isSearchFocused());
+  });
+
+  test('shortcuts to open search field', function() {
+    const field = toolbar.$['main-toolbar'].getSearchField();
+    field.blur();
+    assertFalse(field.showingSearch);
+
+    const modifier = cr.isMac ? 'meta' : 'ctrl';
+    MockInteractions.pressAndReleaseKeyOn(document.body, 70, modifier, 'f');
+    assertTrue(field.showingSearch);
+    assertEquals(field.$.searchInput, field.root.activeElement);
+
+    MockInteractions.pressAndReleaseKeyOn(
+        field.$.searchInput, 27, '', 'Escape');
+    assertFalse(field.showingSearch, 'Pressing escape closes field.');
+    assertNotEquals(field.$.searchInput, field.root.activeElement);
+  });
+});