[quickview] Test up/down arrow keys when multiple files are selected

Add two non-consecutive files to check-select (aka multi-
select). Quick View should open in check-select mode with
the first file being opened. Up/down arrow keys should show
the next selection in check-select.

Bug: 1038799
Change-Id: Ib6c6288aaeeb10a82e7264336bb25a79d5b7d5c8
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2006844Reviewed-by: Noel Gordon <noel@chromium.org>
Commit-Queue: Noel Gordon <noel@chromium.org>
Cr-Commit-Position: refs/heads/master@{#732751}

chrome/browser/chromeos/file_manager/file_manager_browsertest.cc

@@ -470,6 +470,7 @@ WRAPPED_INSTANTIATE_TEST_SUITE_P(
         TestCase("openQuickViewTabIndexVideo"),
         TestCase("pressEnterOnInfoBoxToOpenClose"),
         TestCase("openQuickViewWithMultipleFiles"),
+        TestCase("openQuickViewWithMultipleFilesKeyboardUpDown"),
         TestCase("closeQuickView"),
         TestCase("openQuickViewFromDirectoryTree")));
 

ui/file_manager/integration_tests/file_manager/quick_view.js

@@ -1275,6 +1275,104 @@
     chrome.test.assertEq('image/png', mimeType);
   };
 
+  /**
+   * Tests that the content panel changes when using the up/down arrow keys
+   * when multiple files are selected.
+   */
+  testcase.openQuickViewWithMultipleFilesKeyboardUpDown = async () => {
+    const caller = getCaller();
+
+    /**
+     * The text <webview> resides in the #quick-view shadow DOM, as a child of
+     * the #dialog element.
+     */
+    const webView = ['#quick-view', '#dialog[open] webview.text-content'];
+
+    // Open Files app on Downloads containing three text files.
+    const files = [ENTRIES.hello, ENTRIES.tallText, ENTRIES.plainText];
+    const appId = await setupAndWaitUntilReady(RootPath.DOWNLOADS, files, []);
+
+    // Add item 1 to the check-selection, ENTRIES.tallText.
+    const downKey = ['#file-list', 'ArrowDown', false, false, false];
+    chrome.test.assertTrue(
+        !!await remoteCall.callRemoteTestUtil('fakeKeyDown', appId, downKey),
+        'ArrowDown failed');
+    const ctrlSpace = ['#file-list', ' ', true, false, false];
+    chrome.test.assertTrue(
+        !!await remoteCall.callRemoteTestUtil('fakeKeyDown', appId, ctrlSpace),
+        'Ctrl+Space failed');
+
+    // Add item 3 to the check-selection, ENTRIES.hello.
+    const ctrlDown = ['#file-list', 'ArrowDown', true, false, false];
+    for (let i = 0; i < 2; i++) {
+      chrome.test.assertTrue(
+          !!await remoteCall.callRemoteTestUtil('fakeKeyDown', appId, ctrlDown),
+          'Ctrl+ArrowDown failed');
+    }
+    chrome.test.assertTrue(
+        !!await remoteCall.callRemoteTestUtil('fakeKeyDown', appId, ctrlSpace),
+        'Ctrl+Space failed');
+
+    // Check: both items should be selected.
+    const selectedRows = await remoteCall.callRemoteTestUtil(
+        'deepQueryAllElements', appId, ['#file-list li[selected]']);
+    chrome.test.assertEq(2, selectedRows.length);
+    chrome.test.assertTrue(
+        selectedRows[0].attributes['file-name'].includes(['tall']));
+    chrome.test.assertTrue(
+        selectedRows[1].attributes['file-name'].includes(['hello']));
+
+    // Attempt to open Quick View via its keyboard shortcut.
+    const space = ['#file-list', ' ', false, false, false];
+    await remoteCall.callRemoteTestUtil('fakeKeyDown', appId, space);
+
+    // Wait for the Quick View <webview> to load and display its content.
+    function checkWebViewTextLoaded(elements) {
+      let haveElements = Array.isArray(elements) && elements.length === 1;
+      if (haveElements) {
+        haveElements = elements[0].styles.display.includes('block');
+      }
+      if (!haveElements || !elements[0].attributes.src) {
+        return pending(caller, 'Waiting for <webview> to load.');
+      }
+      return;
+    }
+    await repeatUntil(async () => {
+      return checkWebViewTextLoaded(await remoteCall.callRemoteTestUtil(
+          'deepQueryAllElements', appId, [webView, ['display']]));
+    });
+
+    // Press the down arrow key to select the next file.
+    const downArrow = ['#quick-view', 'ArrowDown', false, false, false];
+    chrome.test.assertTrue(
+        await remoteCall.callRemoteTestUtil('fakeKeyDown', appId, downArrow));
+
+    // Wait until the <webview> displays that file's content.
+    await repeatUntil(async () => {
+      const getTextContent = 'window.document.body.textContent';
+      const text = await remoteCall.callRemoteTestUtil(
+          'deepExecuteScriptInWebView', appId, [webView, getTextContent]);
+      if (!text || !text[0].includes('This is a sample file')) {
+        return pending(caller, 'Waiting for <webview> content.');
+      }
+    });
+
+    // Press the up arrow key to select the previous file.
+    const upArrow = ['#quick-view', 'ArrowUp', false, false, false];
+    chrome.test.assertTrue(
+        await remoteCall.callRemoteTestUtil('fakeKeyDown', appId, upArrow));
+
+    // Wait until the <webview> displays that file's content.
+    await repeatUntil(async () => {
+      const getTextContent = 'window.document.body.textContent';
+      const text = await remoteCall.callRemoteTestUtil(
+          'deepExecuteScriptInWebView', appId, [webView, getTextContent]);
+      if (!text || !text[0].includes('42 tall text')) {
+        return pending(caller, 'Waiting for <webview> content.');
+      }
+    });
+  };
+
   /**
    * Tests opening Quick View and closing with Escape key returns focus to file
    * list.