fix(app): make sidebar reordering respond immediately

Mouse input inherited the touch hold delay. Split activation by input so mouse dragging begins after deliberate movement while touch retains long-press arbitration.
2026-07-17 13:00:47 +02:00
parent 266d54463b
commit a7cbf4f61d
7 changed files with 124 additions and 254 deletions
@@ -0,0 +1,71 @@
+import type { Locator } from "@playwright/test";
+import { expect, test } from "./fixtures";
+import { gotoAppShell } from "./helpers/app";
+import { getServerId } from "./helpers/server-id";
+import { seedWorkspace } from "./helpers/seed-client";
+import { waitForSidebarHydration } from "./helpers/workspace-ui";
+
+async function rowTestIds(rows: Locator) {
+  return rows.evaluateAll((elements) =>
+    elements.map((element) => element.getAttribute("data-testid")),
+  );
+}
+
+async function visibleBoundingBox(row: Locator) {
+  const box = await row.boundingBox();
+  if (!box) throw new Error("Expected a visible draggable row");
+  return box;
+}
+
+async function quickDragFirstRowAfterSecond(rows: Locator) {
+  await expect(rows).toHaveCount(2);
+  const before = await rowTestIds(rows);
+  const sourceBox = await visibleBoundingBox(rows.nth(0));
+  const targetBox = await visibleBoundingBox(rows.nth(1));
+
+  const page = rows.page();
+  const source = { x: sourceBox.x + sourceBox.width / 2, y: sourceBox.y + sourceBox.height / 2 };
+  const target = { x: targetBox.x + targetBox.width / 2, y: targetBox.y + targetBox.height / 2 };
+
+  await page.mouse.move(source.x, source.y);
+  await page.mouse.down();
+  await page.mouse.move(source.x, source.y + 7);
+  await page.mouse.move(target.x, target.y, { steps: 4 });
+  await page.mouse.up();
+
+  await expect.poll(() => rowTestIds(rows)).toEqual([before[1], before[0]]);
+}
+
+test("projects and workspaces reorder with an immediate mouse drag", async ({ page }) => {
+  const firstProject = await seedWorkspace({ repoPrefix: "sidebar-reorder-first-" });
+  const secondProject = await seedWorkspace({ repoPrefix: "sidebar-reorder-second-" });
+
+  try {
+    const secondWorkspace = await firstProject.client.createWorkspace({
+      source: {
+        kind: "directory",
+        path: firstProject.repoPath,
+        projectId: firstProject.projectId,
+      },
+      title: "Second workspace",
+    });
+    if (!secondWorkspace.workspace) {
+      throw new Error(secondWorkspace.error ?? "Failed to seed a second workspace");
+    }
+
+    await gotoAppShell(page);
+    await waitForSidebarHydration(page);
+
+    await quickDragFirstRowAfterSecond(page.locator('[data-testid^="sidebar-project-row-"]'));
+    const firstWorkspaceTestId = `sidebar-workspace-row-${getServerId()}:${firstProject.workspaceId}`;
+    const secondWorkspaceTestId = `sidebar-workspace-row-${getServerId()}:${secondWorkspace.workspace.id}`;
+    await quickDragFirstRowAfterSecond(
+      page.locator(
+        `[data-testid="${firstWorkspaceTestId}"], [data-testid="${secondWorkspaceTestId}"]`,
+      ),
+    );
+  } finally {
+    await firstProject.cleanup();
+    await secondProject.cleanup();
+  }
+});