fix(app-shell,app): Send labware files and runtime parameters over USB

api-client/src/protocols/createProtocol.ts

@@ -11,7 +11,9 @@ export function createProtocol(
   runTimeParameterValues?: RunTimeParameterCreateData
 ): ResponsePromise<Protocol> {
   const formData = new FormData()
-  files.forEach(file => formData.append('files', file, file.name))
+  files.forEach(file => {
+    formData.append('files', file, file.name)
+  })
   if (protocolKey != null) formData.append('key', protocolKey)
   if (runTimeParameterValues != null)
     formData.append(

app-shell/src/usb.ts

@@ -1,8 +1,8 @@
 import { ipcMain, IpcMainInvokeEvent } from 'electron'
 import axios, { AxiosRequestConfig } from 'axios'
 import FormData from 'form-data'
 import fs from 'fs'
 import path from 'path'
 
 import {
   fetchSerialPortList,
@@ -12,7 +12,7 @@
 } from '@opentrons/usb-bridge/node-client'
 
 import { createLogger } from './log'
 import { getProtocolSrcFilePaths } from './protocol-storage'
 import { usbRequestsStart, usbRequestsStop } from './config/actions'
 import {
   SYSTEM_INFO_INITIALIZED,
@@ -83,6 +83,34 @@
     device.vendorId === parseInt(DEFAULT_VENDOR_ID, 16)
   )
 }
+
+type StructuredCloneableFormDataEntry =
+  | {
+      type: 'string'
+      name: string
+      value: string
+    }
+  | {
+      type: 'file'
+      name: string
+      value: ArrayBuffer
+      filename: string
+    }
+
+type StructuredCloneableFormData = StructuredCloneableFormDataEntry[]
+
+function reconstructFormData(
+  structuredCloneableFormData: StructuredCloneableFormData
+): FormData {
+  const result = new FormData()
+  structuredCloneableFormData.forEach(entry => {
+    entry.type === 'file'
+      ? result.append(entry.name, Buffer.from(entry.value), entry.filename)
+      : result.append(entry.name, entry.value)
+  })
+  return result
+}
+
 async function usbListener(
   _event: IpcMainInvokeEvent,
   config: AxiosRequestConfig
@@ -92,21 +120,9 @@
   let formHeaders = {}
 
   // check for formDataProxy
-  if (data?.formDataProxy != null) {
+  if (data?.proxiedFormData != null) {
     // reconstruct FormData
-    const formData = new FormData()
-    const { protocolKey } = data.formDataProxy
-
-    const srcFilePaths: string[] = await getProtocolSrcFilePaths(protocolKey)
-
-    // create readable stream from file
-    srcFilePaths.forEach(srcFilePath => {
-      const readStream = fs.createReadStream(srcFilePath)
-      formData.append('files', readStream, path.basename(srcFilePath))
-    })
-
-    formData.append('key', protocolKey)
-
+    const formData = reconstructFormData(data.proxiedFormData)
     formHeaders = formData.getHeaders()
     data = formData
   }

app/src/redux/shell/remote.ts

@@ -1,6 +1,6 @@
 // access main process remote modules via attachments to `global`
-import type { AxiosRequestConfig } from 'axios'
+import type { AxiosRequestConfig, AxiosResponse } from 'axios'
 import type { ResponsePromise } from '@opentrons/api-client'
 import type { Remote, NotifyTopic, NotifyResponseData } from './types'
 
 const emptyRemote: Remote = {} as any
@@ -20,18 +20,55 @@
   },
 })
 
-export function appShellRequestor<Data>(
+type StructuredCloneableFormDataEntry =
+  | {
+      type: 'string'
+      name: string
+      value: string
+    }
+  | {
+      type: 'file'
+      name: string
+      value: ArrayBuffer
+      filename: string
+    }
+
+type StructuredCloneableFormData = StructuredCloneableFormDataEntry[]
+
+async function proxyFormData(
+  formData: FormData
+): Promise<StructuredCloneableFormData> {
+  const result: StructuredCloneableFormData = []
+  for (const [name, value] of formData.entries()) {
+    if (value instanceof File) {
+      result.push({
+        type: 'file',
+        name,
+        value: await value.arrayBuffer(),
+        filename: value.name,
+      })
+    } else {
+      result.push({ type: 'string', name, value })
+    }
+  }
+
+  return result
+}
+
+export async function appShellRequestor<Data>(
   config: AxiosRequestConfig
-): ResponsePromise<Data> {
+): Promise<AxiosResponse<Data>> {
   const { data } = config
-  // special case: protocol files and form data cannot be sent through invoke. proxy by protocolKey and handle in app-shell
+  // Special case: FormData objects can't be sent through invoke().
+  // Convert it to a structured-cloneable object so it can be.
+  // app-shell will convert it back.
   const formDataProxy =
     data instanceof FormData
-      ? { formDataProxy: { protocolKey: data.get('key') } }
+      ? { proxiedFormData: await proxyFormData(data) }
       : data
   const configProxy = { ...config, data: formDataProxy }
 
-  return remote.ipcRenderer.invoke('usb:request', configProxy)
+  return await remote.ipcRenderer.invoke('usb:request', configProxy)
 }
 
 interface CallbackStore {