Accept dropped files in the terminal (#1173)

2026-05-25 19:16:39 +08:00
parent e40ad0c00e
commit 19289286a6
5 changed files with 353 additions and 1 deletions
@@ -0,0 +1,114 @@
+/**
+ * @vitest-environment jsdom
+ */
+import { afterEach, describe, expect, it, vi } from "vitest";
+import {
+  extractTerminalDropPaths,
+  isTerminalDragLeaveOutside,
+  isTerminalFileDrag,
+  prepareDroppedPathForTerminal,
+  prepareDroppedPathsForTerminal,
+} from "./terminal-file-drop";
+
+function setDesktopBridge(bridge: unknown): void {
+  Object.defineProperty(window, "paseoDesktop", {
+    configurable: true,
+    value: bridge,
+  });
+}
+
+function dataTransfer(input: { types?: string[]; files?: File[] }): DataTransfer {
+  return {
+    types: input.types ?? [],
+    files: input.files ?? [],
+  } as unknown as DataTransfer;
+}
+
+afterEach(() => {
+  vi.restoreAllMocks();
+  delete (window as unknown as { paseoDesktop?: unknown }).paseoDesktop;
+});
+
+describe("terminal file drop", () => {
+  it("detects file drags", () => {
+    expect(isTerminalFileDrag(dataTransfer({ types: ["Files"] }))).toBe(true);
+    expect(isTerminalFileDrag(dataTransfer({ types: ["text/plain"] }))).toBe(false);
+    expect(isTerminalFileDrag(null)).toBe(false);
+  });
+
+  it("keeps drag highlight active when moving between terminal children", () => {
+    const root = document.createElement("div");
+    const child = document.createElement("div");
+    const outside = document.createElement("div");
+    root.appendChild(child);
+
+    expect(isTerminalDragLeaveOutside({ currentTarget: root, relatedTarget: child })).toBe(false);
+    expect(isTerminalDragLeaveOutside({ currentTarget: root, relatedTarget: outside })).toBe(true);
+    expect(isTerminalDragLeaveOutside({ currentTarget: root, relatedTarget: null })).toBe(true);
+  });
+
+  it("extracts paths through Electron webUtils", () => {
+    const file = new File(["image"], "photo.png", { type: "image/png" });
+    const getPathForFile = vi.fn(() => "/Users/me/Desktop/photo.png");
+    setDesktopBridge({
+      webUtils: { getPathForFile },
+    });
+
+    expect(extractTerminalDropPaths(dataTransfer({ types: ["Files"], files: [file] }))).toEqual([
+      "/Users/me/Desktop/photo.png",
+    ]);
+    expect(getPathForFile).toHaveBeenCalledWith(file);
+  });
+
+  it("falls back to legacy Electron file paths", () => {
+    const file = new File(["image"], "photo.png", { type: "image/png" });
+    Object.defineProperty(file, "path", {
+      configurable: true,
+      value: "/tmp/legacy-photo.png",
+    });
+    setDesktopBridge({
+      webUtils: {
+        getPathForFile: vi.fn(() => {
+          throw new Error("not available");
+        }),
+      },
+    });
+
+    expect(extractTerminalDropPaths(dataTransfer({ types: ["Files"], files: [file] }))).toEqual([
+      "/tmp/legacy-photo.png",
+    ]);
+  });
+
+  it("drops browser files that have no filesystem path", () => {
+    const file = new File(["image"], "photo.png", { type: "image/png" });
+
+    expect(extractTerminalDropPaths(dataTransfer({ types: ["Files"], files: [file] }))).toEqual([]);
+  });
+
+  it("prepares POSIX paths with conservative escaping", () => {
+    setDesktopBridge({ platform: "darwin" });
+
+    expect(prepareDroppedPathForTerminal("/tmp/my image.png")).toBe("'/tmp/my image.png'");
+    expect(prepareDroppedPathForTerminal("/tmp/a$(touch bad).png")).toBe("'/tmp/a(touch bad).png'");
+    expect(prepareDroppedPathForTerminal("/tmp/it's.png")).toBe("'/tmp/it\\'s.png'");
+  });
+
+  it("prepares Windows paths with space quoting", () => {
+    setDesktopBridge({ platform: "win32" });
+
+    expect(prepareDroppedPathForTerminal("C:\\Users\\me\\photo.png")).toBe(
+      "C:\\Users\\me\\photo.png",
+    );
+    expect(prepareDroppedPathForTerminal("C:\\Users\\me\\photo one.png")).toBe(
+      '"C:\\Users\\me\\photo one.png"',
+    );
+  });
+
+  it("joins multiple dropped paths for one terminal input", () => {
+    setDesktopBridge({ platform: "darwin" });
+
+    expect(prepareDroppedPathsForTerminal(["/tmp/a.png", "/tmp/b c.png"])).toBe(
+      "'/tmp/a.png' '/tmp/b c.png'",
+    );
+  });
+});
@@ -0,0 +1,102 @@
+interface DesktopFilePathBridge {
+  platform?: string;
+  webUtils?: {
+    getPathForFile?: (file: File) => string;
+  };
+}
+
+const DANGEROUS_NON_WINDOWS_PATH_CHARS = /[`$|&>~#!^*;<]/g;
+
+function getDesktopBridge(): DesktopFilePathBridge | null {
+  if (typeof window === "undefined") {
+    return null;
+  }
+  const bridge = (window as unknown as { paseoDesktop?: DesktopFilePathBridge }).paseoDesktop;
+  return bridge && typeof bridge === "object" ? bridge : null;
+}
+
+function getLegacyFilePath(file: File): string | null {
+  const path = Reflect.get(file, "path");
+  return typeof path === "string" && path.length > 0 ? path : null;
+}
+
+function getFilePath(file: File): string | null {
+  const bridge = getDesktopBridge();
+  const getPathForFile = bridge?.webUtils?.getPathForFile;
+  if (typeof getPathForFile === "function") {
+    try {
+      const path = getPathForFile(file);
+      if (typeof path === "string" && path.length > 0) {
+        return path;
+      }
+    } catch {
+      // Fall through to the legacy Electron File.path property if present.
+    }
+  }
+  return getLegacyFilePath(file);
+}
+
+export function isTerminalFileDrag(dataTransfer: DataTransfer | null): boolean {
+  return Boolean(dataTransfer && Array.from(dataTransfer.types).includes("Files"));
+}
+
+export function isTerminalDragLeaveOutside(input: {
+  currentTarget: EventTarget | null;
+  relatedTarget: EventTarget | null;
+}): boolean {
+  if (!(input.currentTarget instanceof Node) || !(input.relatedTarget instanceof Node)) {
+    return true;
+  }
+  return !input.currentTarget.contains(input.relatedTarget);
+}
+
+export function extractTerminalDropPaths(dataTransfer: DataTransfer | null): string[] {
+  if (!dataTransfer) {
+    return [];
+  }
+
+  const paths: string[] = [];
+  for (const file of Array.from(dataTransfer.files)) {
+    const path = getFilePath(file);
+    if (path) {
+      paths.push(path);
+    }
+  }
+  return paths;
+}
+
+function escapeNonWindowsPath(path: string): string {
+  let nextPath = path;
+  if (nextPath.includes("\\")) {
+    nextPath = nextPath.replace(/\\/g, "\\\\");
+  }
+
+  nextPath = nextPath.replace(DANGEROUS_NON_WINDOWS_PATH_CHARS, "");
+
+  if (nextPath.includes("'") && nextPath.includes('"')) {
+    return `$'${nextPath.replace(/'/g, "\\'")}'`;
+  }
+  if (nextPath.includes("'")) {
+    return `'${nextPath.replace(/'/g, "\\'")}'`;
+  }
+  return `'${nextPath}'`;
+}
+
+function escapeWindowsPath(path: string): string {
+  if (!path.includes(" ")) {
+    return path;
+  }
+  return `"${path}"`;
+}
+
+export function prepareDroppedPathForTerminal(path: string): string {
+  const platform = getDesktopBridge()?.platform;
+  if (platform === "win32") {
+    return escapeWindowsPath(path);
+  }
+  return escapeNonWindowsPath(path);
+}
+
+export function prepareDroppedPathsForTerminal(paths: readonly string[]): string {
+  return paths.map(prepareDroppedPathForTerminal).join(" ");
+}