Add delegate function to open a new file

Since the media_app in the guest frame can't use any file system api
functions we need some IPC so the guest frame can ask the parent frame
to show the open file picker. This cl adds a delegate function which
allows for this functionality, the parent frame will show the picker
and insert the picked file into the navigation order after the current
file.

Note that since we navigate to the new file via a normal call to
"advance" the media app will show a dialog asking users if they are
sure they want to navigate if they have unsaved changes. If they click
cancel the get into a weird state where clicking "next" will make them
jump forward a file. Finding a way to deal with this is tracked in
b/163662946.

Additionally this updates the externs for "showOpenFilePicker" so it
now returns a FileSystemFileHandle, not a fileSystemHandle. This is
consistent with both the spec:

https://wicg.github.io/native-file-system/#dom-window-showopenfilepicker

and the implementation:

https://source.chromium.org/chromium/chromium/src/+/master:third_party/blink/renderer/modules/native_file_system/window_native_file_system.idl;l=17;drc=0c6b1827bb42907302eac1e1a24f93768fc89985

Bug: b/147395281
Change-Id: I199bc787b2f69e6cd5f6785fb4f94556cd1438cc
Reviewed-on: https://chromium-review.googlesource.com/c/chromium/src/+/2352954
Commit-Queue: Zain Afzal <zafzal@google.com>
Reviewed-by: Trent Apted <tapted@chromium.org>
Cr-Commit-Position: refs/heads/master@{#798058}

chromeos/components/media_app_ui/resources/js/launch.js

@@ -242,6 +242,19 @@ guestMessagePipe.registerHandler(Message.SAVE_AS, async (message) => {
   return response;
 });
 
+guestMessagePipe.registerHandler(Message.OPEN_FILE, async () => {
+  const [handle] = await window.showOpenFilePicker({multiple: false});
+  /** @type {!FileDescriptor} */
+  const fileDescriptor = {
+    token: generateToken(handle),
+    file: null,
+    handle: handle,
+    inCurrentDirectory: false
+  };
+  currentFiles.splice(entryIndex + 1, 0, fileDescriptor);
+  advance(1);
+});
+
 /**
  * Shows a file picker to get a writable file.
  * @param {string} suggestedName

chromeos/components/media_app_ui/resources/js/media_app.externs.js

@@ -149,6 +149,13 @@ mediaApp.ClientApiDelegate.prototype.openFeedbackDialog = function() {};
  */
 mediaApp.ClientApiDelegate.prototype.requestSaveFile = function(
     suggestedName, mimeType) {};
+/**
+ * Request for the user to be prompted with a open file picker. Once the user
+ * selects a file, the file is inserted into the navigation order after the
+ * current file and navigated to.
+ * @return {!Promise<undefined>}
+ */
+mediaApp.ClientApiDelegate.prototype.openFile = function() {};
 
 /**
  * The client Api for interacting with the media app instance.

chromeos/components/media_app_ui/resources/js/message_types.js

@@ -18,6 +18,7 @@ const Message = {
   LOAD_FILES: 'load-files',
   NAVIGATE: 'navigate',
   OPEN_FEEDBACK_DIALOG: 'open-feedback-dialog',
+  OPEN_FILE: 'open-file',
   OVERWRITE_FILE: 'overwrite-file',
   RENAME_FILE: 'rename-file',
   REQUEST_SAVE_FILE: 'request-save-file',

chromeos/components/media_app_ui/resources/js/receiver.js

@@ -236,6 +236,12 @@ const DELEGATE = {
             await parentMessagePipe.sendMessage(
                 Message.REQUEST_SAVE_FILE, msg));
     return response.token;
+  },
+  /**
+   * @return {!Promise<undefined>}
+   */
+  async openFile() {
+    await parentMessagePipe.sendMessage(Message.OPEN_FILE);
   }
 };
 

chromeos/components/media_app_ui/test/driver_api.js

@@ -24,6 +24,7 @@ let TestMessageResponseData;
  *     requestFullscreen: (boolean|undefined),
  *     requestSaveFile: (boolean|undefined),
  *     saveAs: (string|undefined),
+ *     openFile: (boolean|undefined),
  *     testQuery: string,
  * }}
  */

chromeos/components/media_app_ui/test/guest_query_receiver.js

@@ -118,6 +118,8 @@ async function runTestQuery(data) {
   } else if (data.getFileErrors) {
     result =
         assertCast(lastReceivedFileList).files.map(file => file.error).join();
+  } else if (data.openFile) {
+    await DELEGATE.openFile();
   }
   return {testQueryResult: result, testQueryResultData: extraResultData};
 }

chromeos/components/media_app_ui/test/media_app_ui_browsertest.js

@@ -917,6 +917,23 @@ TEST_F('MediaAppUIBrowserTest', 'SaveAsErrorHandling', async () => {
   testDone();
 });
 
+// Tests the IPC behind the openFile delegate function.
+TEST_F('MediaAppUIBrowserTest', 'OpenFileIPC', async () => {
+  const pickedFileHandle = new FakeFileSystemFileHandle('picked_file.jpg');
+  window.showOpenFilePicker = () => Promise.resolve([pickedFileHandle]);
+
+  await sendTestMessage({openFile: true});
+
+  const lastToken = [...tokenMap.keys()].slice(-1)[0];
+  assertEquals(entryIndex, 0);
+  assertEquals(currentFiles.length, 1);
+  assertEquals(currentFiles[0].handle, pickedFileHandle);
+  assertEquals(currentFiles[0].handle.name, 'picked_file.jpg');
+  assertEquals(currentFiles[0].token, lastToken);
+  assertEquals(tokenMap.get(currentFiles[0].token), currentFiles[0].handle);
+  testDone();
+});
+
 TEST_F('MediaAppUIBrowserTest', 'RelatedFiles', async () => {
   const testFiles = [
     {name: 'matroska.mkv'},

chromeos/components/web_applications/externs/file_handling.externs.js

@@ -202,7 +202,7 @@ let FilePickerOptions;
 /**
  * https://wicg.github.io/native-file-system/#native-filesystem
  * @param {(!FilePickerOptions|undefined)} options
- * @return {!Promise<(!Array<!FileSystemHandle>)>}
+ * @return {!Promise<(!Array<!FileSystemFileHandle>)>}
  */
 window.showOpenFilePicker;