test(assets): add E2E tests for delete confirmation flow

browser_tests/fixtures/helpers/AssetsHelper.ts

@@ -4,6 +4,7 @@ import type { RawJobListItem } from '../../../src/platform/remote/comfyui/jobs/j
 
 const jobsListRoutePattern = /\/api\/jobs(?:\?.*)?$/
 const inputFilesRoutePattern = /\/internal\/files\/input(?:\?.*)?$/
+const historyRoutePattern = /\/api\/history$/
 
 /** Factory to create a mock completed job with preview output. */
 export function createMockJob(
@@ -88,6 +89,8 @@ export class AssetsHelper {
   private jobsRouteHandler: ((route: Route) => Promise<void>) | null = null
   private inputFilesRouteHandler: ((route: Route) => Promise<void>) | null =
     null
+  private deleteHistoryRouteHandler: ((route: Route) => Promise<void>) | null =
+    null
   private generatedJobs: RawJobListItem[] = []
   private importedFiles: string[] = []
 
@@ -179,6 +182,36 @@ export class AssetsHelper {
     await this.page.route(inputFilesRoutePattern, this.inputFilesRouteHandler)
   }
 
+  /**
+   * Mock the POST /api/history endpoint used for deleting history items.
+   * On receiving a `{ delete: [id] }` payload, removes matching jobs from
+   * the in-memory mock state so subsequent /api/jobs fetches reflect the
+   * deletion.
+   */
+  async mockDeleteHistory(): Promise<void> {
+    if (this.deleteHistoryRouteHandler) return
+
+    this.deleteHistoryRouteHandler = async (route: Route) => {
+      const request = route.request()
+      if (request.method() !== 'POST') {
+        await route.continue()
+        return
+      }
+
+      const body = request.postDataJSON() as { delete?: string[] }
+      if (body.delete) {
+        const idsToRemove = new Set(body.delete)
+        this.generatedJobs = this.generatedJobs.filter(
+          (job) => !idsToRemove.has(job.id)
+        )
+      }
+
+      await route.fulfill({ status: 200, body: '{}' })
+    }
+
+    await this.page.route(historyRoutePattern, this.deleteHistoryRouteHandler)
+  }
+
   async mockEmptyState(): Promise<void> {
     await this.mockOutputHistory([])
     await this.mockInputFiles([])
@@ -200,5 +233,13 @@ export class AssetsHelper {
       )
       this.inputFilesRouteHandler = null
     }
+
+    if (this.deleteHistoryRouteHandler) {
+      await this.page.unroute(
+        historyRoutePattern,
+        this.deleteHistoryRouteHandler
+      )
+      this.deleteHistoryRouteHandler = null
+    }
   }
 }

browser_tests/tests/sidebar/assets.spec.ts

@@ -667,3 +667,83 @@ test.describe('Assets sidebar - settings menu', () => {
     await expect(tab.gridViewOption).toBeVisible()
   })
 })
+
+// ==========================================================================
+// 11. Delete confirmation
+// ==========================================================================
+
+test.describe('Assets sidebar - delete confirmation', () => {
+  test.beforeEach(async ({ comfyPage }) => {
+    await comfyPage.assets.mockOutputHistory(SAMPLE_JOBS)
+    await comfyPage.assets.mockDeleteHistory()
+    await comfyPage.assets.mockInputFiles([])
+    await comfyPage.setup()
+  })
+
+  test.afterEach(async ({ comfyPage }) => {
+    await comfyPage.assets.clearMocks()
+  })
+
+  test('Right-click delete shows confirmation dialog', async ({
+    comfyPage
+  }) => {
+    const tab = comfyPage.menu.assetsTab
+    await tab.open()
+    await tab.waitForAssets()
+
+    await tab.assetCards.first().click({ button: 'right' })
+    await tab.contextMenuItem('Delete').click()
+
+    const dialog = comfyPage.confirmDialog.root
+    await expect(dialog).toBeVisible()
+    await expect(dialog.getByText('Delete this asset?')).toBeVisible()
+    await expect(
+      dialog.getByText('This asset will be permanently removed.')
+    ).toBeVisible()
+  })
+
+  test('Confirming delete removes asset and shows success toast', async ({
+    comfyPage
+  }) => {
+    const tab = comfyPage.menu.assetsTab
+    await tab.open()
+    await tab.waitForAssets()
+
+    const initialCount = await tab.assetCards.count()
+
+    await tab.assetCards.first().click({ button: 'right' })
+    await tab.contextMenuItem('Delete').click()
+
+    const dialog = comfyPage.confirmDialog.root
+    await expect(dialog).toBeVisible()
+
+    await comfyPage.confirmDialog.delete.click()
+
+    await expect(dialog).not.toBeVisible()
+    await expect(tab.assetCards).toHaveCount(initialCount - 1, {
+      timeout: 5000
+    })
+
+    const successToast = comfyPage.page.locator('.p-toast-message-success')
+    await expect(successToast).toBeVisible({ timeout: 5000 })
+  })
+
+  test('Cancelling delete preserves asset', async ({ comfyPage }) => {
+    const tab = comfyPage.menu.assetsTab
+    await tab.open()
+    await tab.waitForAssets()
+
+    const initialCount = await tab.assetCards.count()
+
+    await tab.assetCards.first().click({ button: 'right' })
+    await tab.contextMenuItem('Delete').click()
+
+    const dialog = comfyPage.confirmDialog.root
+    await expect(dialog).toBeVisible()
+
+    await comfyPage.confirmDialog.reject.click()
+
+    await expect(dialog).not.toBeVisible()
+    await expect(tab.assetCards).toHaveCount(initialCount)
+  })
+})