Merge branch 'main' into feat/template-document-name-options

packages/app-tests/e2e/api/v2/unauthorized-api-access/api-access-file-download.spec.ts

@@ -0,0 +1,118 @@
+import { NEXT_PUBLIC_WEBAPP_URL } from '@documenso/lib/constants/app';
+import { seedDraftDocument, seedPendingDocument } from '@documenso/prisma/seed/documents';
+import { seedUser } from '@documenso/prisma/seed/users';
+import { expect, test } from '@playwright/test';
+
+import { apiSignin } from '../../../fixtures/authentication';
+
+const WEBAPP_BASE_URL = NEXT_PUBLIC_WEBAPP_URL();
+
+test.describe.configure({
+  mode: 'parallel',
+});
+
+const downloadUrl = (envelopeId: string, envelopeItemId: string, version: 'original' | 'signed' | 'pending') =>
+  `${WEBAPP_BASE_URL}/api/files/envelope/${envelopeId}/envelopeItem/${envelopeItemId}/download/${version}`;
+
+const seedOwnerWithDraft = async () => {
+  const owner = await seedUser();
+
+  const draft = await seedDraftDocument(owner.user, owner.team.id, [], {
+    createDocumentOptions: { title: 'File Download Auth Test' },
+  });
+
+  return { owner, draft, draftItem: draft.envelopeItems[0] };
+};
+
+test.describe('Envelope item file download endpoint authorization', () => {
+  test('rejects an unauthenticated download request', async ({ request }) => {
+    const { draft, draftItem } = await seedOwnerWithDraft();
+
+    const res = await request.get(downloadUrl(draft.id, draftItem.id, 'original'));
+
+    expect(res.ok()).toBeFalsy();
+    expect(res.status()).toBe(401);
+  });
+
+  test('rejects a download request from a user outside the organisation', async ({ page }) => {
+    const { draft, draftItem } = await seedOwnerWithDraft();
+    const { user: outsider } = await seedUser();
+
+    await apiSignin({ page, email: outsider.email });
+
+    const res = await page.request.get(downloadUrl(draft.id, draftItem.id, 'original'));
+
+    expect(res.ok()).toBeFalsy();
+    expect(res.status()).toBe(403);
+  });
+
+  test('returns 404 for a nonexistent envelope', async ({ page }) => {
+    const { user } = await seedUser();
+
+    await apiSignin({ page, email: user.email });
+
+    const res = await page.request.get(
+      downloadUrl('envelope_does_not_exist', 'envelope_item_does_not_exist', 'original'),
+    );
+
+    expect(res.ok()).toBeFalsy();
+    expect(res.status()).toBe(404);
+  });
+
+  test('rejects a pending version download for a draft envelope', async ({ page }) => {
+    const { owner, draft, draftItem } = await seedOwnerWithDraft();
+
+    await apiSignin({ page, email: owner.user.email });
+
+    const res = await page.request.get(downloadUrl(draft.id, draftItem.id, 'pending'));
+
+    expect(res.ok()).toBeFalsy();
+    expect(res.status()).toBe(400);
+  });
+
+  test('rejects a pending version download for a legacy envelope', async ({ page }) => {
+    const owner = await seedUser();
+    const { user: recipient } = await seedUser();
+
+    // Default internalVersion is 1 (legacy).
+    const pendingDocument = await seedPendingDocument(owner.user, owner.team.id, [recipient], {
+      createDocumentOptions: { title: 'Legacy Pending Download Test' },
+    });
+
+    const envelopeItem = pendingDocument.envelopeItems[0];
+
+    await apiSignin({ page, email: owner.user.email });
+
+    const res = await page.request.get(downloadUrl(pendingDocument.id, envelopeItem.id, 'pending'));
+
+    expect(res.ok()).toBeFalsy();
+    expect(res.status()).toBe(400);
+  });
+
+  test('allows the owner to download their own document', async ({ page }) => {
+    const { owner, draft, draftItem } = await seedOwnerWithDraft();
+
+    await apiSignin({ page, email: owner.user.email });
+
+    const res = await page.request.get(downloadUrl(draft.id, draftItem.id, 'original'));
+
+    expect(res.ok()).toBeTruthy();
+    expect(res.headers()['content-type']).toContain('application/pdf');
+
+    const body = await res.body();
+
+    // %PDF magic bytes.
+    expect(Array.from(body.subarray(0, 4))).toEqual([0x25, 0x50, 0x44, 0x46]);
+  });
+
+  test('rejects a recipient-token download with an invalid token', async ({ request }) => {
+    const { draftItem } = await seedOwnerWithDraft();
+
+    const res = await request.get(
+      `${WEBAPP_BASE_URL}/api/files/token/invalid-token-12345/envelopeItem/${draftItem.id}/download/original`,
+    );
+
+    expect(res.ok()).toBeFalsy();
+    expect(res.status()).toBe(404);
+  });
+});

packages/app-tests/e2e/documents/bulk-document-actions.spec.ts

@@ -1,3 +1,5 @@
+import fs from 'node:fs';
+import { createTeam } from '@documenso/lib/server-only/team/create-team';
 import { prisma } from '@documenso/prisma';
 import { seedCompletedDocument, seedDraftDocument, seedPendingDocument } from '@documenso/prisma/seed/documents';
 import { seedBlankFolder } from '@documenso/prisma/seed/folders';
@@ -5,6 +7,7 @@ import { seedTeam, seedTeamMember } from '@documenso/prisma/seed/teams';
 import { seedUser } from '@documenso/prisma/seed/users';
 import { expect, test } from '@playwright/test';
 import { DocumentStatus, TeamMemberRole } from '@prisma/client';
+import { unzipSync } from 'fflate';
 
 import { apiSignin, apiSignout } from '../fixtures/authentication';
 import { expectToastTextToBeVisible } from '../fixtures/generic';
@@ -50,10 +53,10 @@ test('[BULK_ACTIONS]: can select multiple documents with checkboxes', async ({ p
   });
 
   await page.locator('tr', { hasText: 'Bulk Test Doc 1' }).getByRole('checkbox').click();
-  await expect(page.getByText('1 selected')).toBeVisible();
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
 
   await page.locator('tr', { hasText: 'Bulk Test Doc 2' }).getByRole('checkbox').click();
-  await expect(page.getByText('2 selected')).toBeVisible();
+  await expect(page.getByText(/2\s*selected/)).toBeVisible();
 });
 
 test('[BULK_ACTIONS]: header checkbox selects all documents on page', async ({ page }) => {
@@ -67,7 +70,7 @@ test('[BULK_ACTIONS]: header checkbox selects all documents on page', async ({ p
 
   await page.locator('thead').getByRole('checkbox').click();
 
-  await expect(page.getByText(`${documents.length} selected`)).toBeVisible();
+  await expect(page.getByText(new RegExp(`${documents.length}\\s*selected`))).toBeVisible();
 });
 
 test('[BULK_ACTIONS]: can clear selection with X button', async ({ page }) => {
@@ -80,11 +83,11 @@ test('[BULK_ACTIONS]: can clear selection with X button', async ({ page }) => {
   });
 
   await page.locator('thead').getByRole('checkbox').click();
-  await expect(page.getByText(/\d+ selected/)).toBeVisible();
+  await expect(page.getByText(/\d+\s*selected/)).toBeVisible();
 
   await page.getByLabel('Clear selection').click();
 
-  await expect(page.getByText(/\d+ selected/)).not.toBeVisible();
+  await expect(page.getByText(/\d+\s*selected/)).not.toBeVisible();
 });
 
 test('[BULK_ACTIONS]: can move multiple documents to a folder', async ({ page }) => {
@@ -98,13 +101,13 @@ test('[BULK_ACTIONS]: can move multiple documents to a folder', async ({ page })
 
   await page.locator('tr', { hasText: 'Bulk Test Doc 1' }).getByRole('checkbox').click();
   await page.locator('tr', { hasText: 'Bulk Test Doc 2' }).getByRole('checkbox').click();
-  await page.getByRole('button', { name: 'Move to Folder' }).click();
+  await page.getByRole('button', { name: 'Move', exact: true }).click();
 
   await expect(page.getByRole('dialog')).toBeVisible();
   await expect(page.getByText('Move Documents to Folder')).toBeVisible();
 
   await page.getByRole('button', { name: folder.name }).click();
-  await page.getByRole('button', { name: 'Move' }).click();
+  await page.getByRole('dialog').getByRole('button', { name: 'Move' }).click();
 
   await expectToastTextToBeVisible(page, 'Selected items have been moved.');
 
@@ -113,6 +116,122 @@ test('[BULK_ACTIONS]: can move multiple documents to a folder', async ({ page })
   await expect(page.getByRole('link', { name: 'Bulk Test Doc 2' })).toBeVisible();
 });
 
+test('[BULK_ACTIONS]: selection does not leak between teams', async ({ page }) => {
+  const { sender } = await seedBulkActionsTestRequirements();
+
+  const teamBUrl = `team-b-${Date.now()}`;
+
+  await createTeam({
+    userId: sender.user.id,
+    teamName: 'Team B',
+    teamUrl: teamBUrl,
+    organisationId: sender.organisation.id,
+    inheritMembers: true,
+  });
+
+  const teamB = await prisma.team.findFirstOrThrow({
+    where: { url: teamBUrl },
+  });
+
+  await seedDraftDocument(sender.user, teamB.id, [], {
+    createDocumentOptions: { title: 'Team B Doc' },
+  });
+
+  await apiSignin({
+    page,
+    email: sender.user.email,
+    redirectPath: `/t/${sender.team.url}/documents`,
+  });
+
+  await page.locator('tr', { hasText: 'Bulk Test Doc 1' }).getByRole('checkbox').click();
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
+
+  // The selection made in team A must not appear in team B.
+  await page.goto(`/t/${teamBUrl}/documents`);
+  await expect(page.getByRole('link', { name: 'Team B Doc' })).toBeVisible();
+  await expect(page.getByText(/\d+\s*selected/)).not.toBeVisible();
+
+  // Returning to team A restores its selection.
+  await page.goto(`/t/${sender.team.url}/documents`);
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
+});
+
+test('[BULK_ACTIONS]: escape clears selection unless a dialog is open', async ({ page }) => {
+  const { sender } = await seedBulkActionsTestRequirements();
+
+  await apiSignin({
+    page,
+    email: sender.user.email,
+    redirectPath: `/t/${sender.team.url}/documents`,
+  });
+
+  await page.locator('tr', { hasText: 'Bulk Test Doc 1' }).getByRole('checkbox').click();
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
+
+  // Escape while a dialog is open should close the dialog but keep the selection.
+  await page.getByRole('button', { name: 'Move', exact: true }).click();
+  await expect(page.getByRole('dialog')).toBeVisible();
+
+  await page.keyboard.press('Escape');
+
+  await expect(page.getByRole('dialog')).not.toBeVisible();
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
+
+  // Escape with no dialog open should clear the selection.
+  await page.keyboard.press('Escape');
+
+  await expect(page.getByText(/1\s*selected/)).not.toBeVisible();
+});
+
+test('[BULK_ACTIONS]: can bulk download multiple documents as a zip', async ({ page }) => {
+  const { sender, documents } = await seedBulkActionsTestRequirements();
+
+  const [doc1, doc2] = documents;
+
+  await apiSignin({
+    page,
+    email: sender.user.email,
+    redirectPath: `/t/${sender.team.url}/documents`,
+  });
+
+  await page.locator('tr', { hasText: 'Bulk Test Doc 1' }).getByRole('checkbox').click();
+  await page.locator('tr', { hasText: 'Bulk Test Doc 2' }).getByRole('checkbox').click();
+
+  await page.getByRole('button', { name: 'Download', exact: true }).click();
+
+  const dialog = page.getByRole('dialog');
+
+  await expect(dialog).toBeVisible();
+  await expect(dialog.getByText('Download Documents')).toBeVisible();
+  await expect(dialog.getByText('Bulk Test Doc 1')).toBeVisible();
+  await expect(dialog.getByText('Bulk Test Doc 2')).toBeVisible();
+  await expect(dialog.getByText('Draft').first()).toBeVisible();
+
+  const downloadPromise = page.waitForEvent('download', { timeout: 10_000 });
+
+  await dialog.getByRole('button', { name: 'Download' }).click();
+
+  const download = await downloadPromise;
+
+  expect(download.suggestedFilename()).toMatch(/^documenso-documents-\d{4}-\d{2}-\d{2}\.zip$/);
+
+  const downloadPath = await download.path();
+  const zipContents = unzipSync(new Uint8Array(fs.readFileSync(downloadPath)));
+
+  // Each envelope's files are nested inside an `envelopeId_title` folder.
+  expect(Object.keys(zipContents).sort()).toEqual(
+    [`${doc1.id}_Bulk Test Doc 1/Bulk Test Doc 1.pdf`, `${doc2.id}_Bulk Test Doc 2/Bulk Test Doc 2.pdf`].sort(),
+  );
+
+  // Each entry should be a valid non-empty PDF (%PDF magic bytes).
+  for (const entry of Object.values(zipContents)) {
+    expect(Array.from(entry.slice(0, 4))).toEqual([0x25, 0x50, 0x44, 0x46]);
+  }
+
+  await expectToastTextToBeVisible(page, 'Documents downloaded');
+  await expect(page.getByText(/\d+\s*selected/)).not.toBeVisible();
+});
+
 test('[BULK_ACTIONS]: can delete multiple draft documents', async ({ page }) => {
   const { sender } = await seedBulkActionsTestRequirements();
 
@@ -152,14 +271,14 @@ test('[BULK_ACTIONS]: selection clears after successful move', async ({ page })
   });
 
   await page.locator('tr', { hasText: 'Bulk Test Doc 1' }).getByRole('checkbox').click();
-  await expect(page.getByText('1 selected')).toBeVisible();
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
 
-  await page.getByRole('button', { name: 'Move to Folder' }).click();
+  await page.getByRole('button', { name: 'Move', exact: true }).click();
   await page.getByRole('button', { name: folder.name }).click();
-  await page.getByRole('button', { name: 'Move' }).click();
+  await page.getByRole('dialog').getByRole('button', { name: 'Move' }).click();
 
   await expectToastTextToBeVisible(page, 'Selected items have been moved.');
-  await expect(page.getByText(/\d+ selected/)).not.toBeVisible();
+  await expect(page.getByText(/\d+\s*selected/)).not.toBeVisible();
 });
 
 test('[BULK_ACTIONS]: selection clears after successful delete', async ({ page }) => {
@@ -172,13 +291,13 @@ test('[BULK_ACTIONS]: selection clears after successful delete', async ({ page }
   });
 
   await page.locator('tr', { hasText: 'Bulk Test Doc 1' }).getByRole('checkbox').click();
-  await expect(page.getByText('1 selected')).toBeVisible();
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
 
   await page.getByRole('button', { name: 'Delete' }).click();
   await page.getByRole('dialog').getByRole('button', { name: 'Delete' }).click();
 
   await expectToastTextToBeVisible(page, 'Documents deleted');
-  await expect(page.getByText(/\d+ selected/)).not.toBeVisible();
+  await expect(page.getByText(/\d+\s*selected/)).not.toBeVisible();
 });
 
 test('[BULK_ACTIONS]: can search for folders in move dialog', async ({ page }) => {
@@ -199,7 +318,7 @@ test('[BULK_ACTIONS]: can search for folders in move dialog', async ({ page }) =
 
   await page.locator('tr', { hasText: 'Bulk Test Doc 1' }).getByRole('checkbox').click();
 
-  await page.getByRole('button', { name: 'Move to Folder' }).click();
+  await page.getByRole('button', { name: 'Move', exact: true }).click();
   await expect(page.getByRole('dialog')).toBeVisible();
 
   await expect(page.getByRole('button', { name: folder.name })).toBeVisible();
@@ -236,14 +355,14 @@ test('[BULK_ACTIONS]: can move documents from folder to home (root)', async ({ p
   await expect(page.getByRole('link', { name: 'Bulk Test Doc 1' })).toBeVisible();
 
   await page.locator('tr', { hasText: 'Bulk Test Doc 1' }).getByRole('checkbox').click();
-  await expect(page.getByText('1 selected')).toBeVisible();
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
 
-  await page.getByRole('button', { name: 'Move to Folder' }).click();
+  await page.getByRole('button', { name: 'Move', exact: true }).click();
   await expect(page.getByRole('dialog')).toBeVisible();
 
   await page.getByRole('button', { name: 'Home (No Folder)' }).click();
 
-  await page.getByRole('button', { name: 'Move' }).click();
+  await page.getByRole('dialog').getByRole('button', { name: 'Move' }).click();
 
   await expectToastTextToBeVisible(page, 'Selected items have been moved.');
 

packages/app-tests/e2e/documents/cancel-documents.spec.ts

@@ -7,7 +7,7 @@ import { expect, type Page, test } from '@playwright/test';
 import { DocumentStatus, TeamMemberRole } from '@prisma/client';
 
 import { apiSignin, apiSignout } from '../fixtures/authentication';
-import { checkDocumentTabCount } from '../fixtures/documents';
+import { checkDocumentCounts, selectDocumentStatusFilter } from '../fixtures/documents';
 import { expectToastTextToBeVisible, openDropdownMenu } from '../fixtures/generic';
 
 test.describe.configure({ mode: 'serial' });
@@ -61,13 +61,10 @@ test('[DOCUMENTS]: cancelling a pending document keeps it in the owner dashboard
   await expectToastTextToBeVisible(page, 'Document cancelled');
 
   // The document must remain in the dashboard, unlike deleting a pending document.
-  await checkDocumentTabCount(page, 'Inbox', 0);
-  await checkDocumentTabCount(page, 'Pending', 0);
-  await checkDocumentTabCount(page, 'Cancelled', 1);
-  await checkDocumentTabCount(page, 'All', 1);
+  await checkDocumentCounts(page, { inbox: 0, pending: 0, cancelled: 1, all: 1 });
 
   // The cancelled document is still listed.
-  await page.getByRole('tab', { name: 'Cancelled' }).click();
+  await selectDocumentStatusFilter(page, 'Cancelled');
   await expect(page.getByRole('link', { name: 'Document 1 - Pending' })).toBeVisible();
 
   // The envelope status is persisted as CANCELLED.
@@ -131,7 +128,7 @@ test('[DOCUMENTS]: a cancelled document can be deleted, hiding it from the owner
   await expectToastTextToBeVisible(page, 'Document cancelled');
 
   // Delete the now-cancelled document. Being terminal, it should soft delete (hide).
-  await page.getByRole('tab', { name: 'Cancelled' }).click();
+  await selectDocumentStatusFilter(page, 'Cancelled');
 
   const documentActionBtn = page
     .locator('tr', { hasText: 'Document 1 - Pending' })

packages/app-tests/e2e/documents/delete-documents.spec.ts

@@ -3,7 +3,7 @@ import { seedUser } from '@documenso/prisma/seed/users';
 import { expect, test } from '@playwright/test';
 
 import { apiSignin, apiSignout } from '../fixtures/authentication';
-import { checkDocumentTabCount } from '../fixtures/documents';
+import { checkDocumentCounts } from '../fixtures/documents';
 import { expectToastTextToBeVisible, openDropdownMenu } from '../fixtures/generic';
 
 test.describe.configure({ mode: 'serial' });
@@ -174,11 +174,7 @@ test('[DOCUMENTS]: deleting draft documents should permanently remove it', async
   await expect(page.getByRole('row', { name: /Document 1 - Draft/ })).not.toBeVisible();
 
   // Check document counts.
-  await checkDocumentTabCount(page, 'Inbox', 0);
-  await checkDocumentTabCount(page, 'Pending', 1);
-  await checkDocumentTabCount(page, 'Completed', 1);
-  await checkDocumentTabCount(page, 'Draft', 0);
-  await checkDocumentTabCount(page, 'All', 2);
+  await checkDocumentCounts(page, { inbox: 0, pending: 1, completed: 1, draft: 0, all: 2 });
 });
 
 test('[DOCUMENTS]: deleting pending documents should permanently remove it', async ({ page }) => {
@@ -207,11 +203,7 @@ test('[DOCUMENTS]: deleting pending documents should permanently remove it', asy
   await expect(page.getByRole('row', { name: /Document 1 - Pending/ })).not.toBeVisible();
 
   // Check document counts.
-  await checkDocumentTabCount(page, 'Inbox', 0);
-  await checkDocumentTabCount(page, 'Pending', 0);
-  await checkDocumentTabCount(page, 'Completed', 1);
-  await checkDocumentTabCount(page, 'Draft', 1);
-  await checkDocumentTabCount(page, 'All', 2);
+  await checkDocumentCounts(page, { inbox: 0, pending: 0, completed: 1, draft: 1, all: 2 });
 });
 
 test('[DOCUMENTS]: deleting completed documents as an owner should hide it from only the owner', async ({ page }) => {
@@ -239,11 +231,7 @@ test('[DOCUMENTS]: deleting completed documents as an owner should hide it from
 
   // Check document counts.
   await expect(page.getByRole('row', { name: /Document 1 - Completed/ })).not.toBeVisible();
-  await checkDocumentTabCount(page, 'Inbox', 0);
-  await checkDocumentTabCount(page, 'Pending', 1);
-  await checkDocumentTabCount(page, 'Completed', 0);
-  await checkDocumentTabCount(page, 'Draft', 1);
-  await checkDocumentTabCount(page, 'All', 2);
+  await checkDocumentCounts(page, { inbox: 0, pending: 1, completed: 0, draft: 1, all: 2 });
 
   // Sign into the recipient account.
   await apiSignout({ page });
@@ -255,11 +243,7 @@ test('[DOCUMENTS]: deleting completed documents as an owner should hide it from
 
   // Check document counts.
   await expect(page.getByRole('row', { name: /Document 1 - Completed/ })).toBeVisible();
-  await checkDocumentTabCount(page, 'Inbox', 1);
-  await checkDocumentTabCount(page, 'Pending', 0);
-  await checkDocumentTabCount(page, 'Completed', 1);
-  await checkDocumentTabCount(page, 'Draft', 0);
-  await checkDocumentTabCount(page, 'All', 2);
+  await checkDocumentCounts(page, { inbox: 1, pending: 0, completed: 1, draft: 0, all: 2 });
 });
 
 test('[DOCUMENTS]: deleting documents as a recipient should only hide it for them', async ({ page }) => {
@@ -300,11 +284,7 @@ test('[DOCUMENTS]: deleting documents as a recipient should only hide it for the
   // Check document counts.
   await expect(page.getByRole('row', { name: /Document 1 - Completed/ })).not.toBeVisible();
   await expect(page.getByRole('row', { name: /Document 1 - Pending/ })).not.toBeVisible();
-  await checkDocumentTabCount(page, 'Inbox', 0);
-  await checkDocumentTabCount(page, 'Pending', 0);
-  await checkDocumentTabCount(page, 'Completed', 0);
-  await checkDocumentTabCount(page, 'Draft', 0);
-  await checkDocumentTabCount(page, 'All', 0);
+  await checkDocumentCounts(page, { inbox: 0, pending: 0, completed: 0, draft: 0, all: 0 });
 
   // Sign into the sender account.
   await apiSignout({ page });
@@ -315,11 +295,7 @@ test('[DOCUMENTS]: deleting documents as a recipient should only hide it for the
   });
 
   // Check document counts for sender.
-  await checkDocumentTabCount(page, 'Inbox', 0);
-  await checkDocumentTabCount(page, 'Pending', 1);
-  await checkDocumentTabCount(page, 'Completed', 1);
-  await checkDocumentTabCount(page, 'Draft', 1);
-  await checkDocumentTabCount(page, 'All', 3);
+  await checkDocumentCounts(page, { inbox: 0, pending: 1, completed: 1, draft: 1, all: 3 });
 
   // Sign into the other recipient account.
   await apiSignout({ page });
@@ -330,9 +306,5 @@ test('[DOCUMENTS]: deleting documents as a recipient should only hide it for the
   });
 
   // Check document counts for other recipient.
-  await checkDocumentTabCount(page, 'Inbox', 1);
-  await checkDocumentTabCount(page, 'Pending', 0);
-  await checkDocumentTabCount(page, 'Completed', 1);
-  await checkDocumentTabCount(page, 'Draft', 0);
-  await checkDocumentTabCount(page, 'All', 2);
+  await checkDocumentCounts(page, { inbox: 1, pending: 0, completed: 1, draft: 0, all: 2 });
 });

packages/app-tests/e2e/documents/find-documents.spec.ts

@@ -20,7 +20,7 @@ import {
 } from '@prisma/client';
 
 import { apiSignin, apiSignout } from '../fixtures/authentication';
-import { checkDocumentTabCount } from '../fixtures/documents';
+import { checkDocumentCounts, checkDocumentTabCount, toggleDocumentSenderFilter } from '../fixtures/documents';
 
 test.describe.configure({
   mode: 'parallel',
@@ -61,10 +61,7 @@ test.describe('Find Documents UI - Personal Context', () => {
       redirectPath: `/t/${team.url}/documents`,
     });
 
-    await checkDocumentTabCount(page, 'All', 3);
-    await checkDocumentTabCount(page, 'Draft', 1);
-    await checkDocumentTabCount(page, 'Pending', 1);
-    await checkDocumentTabCount(page, 'Completed', 1);
+    await checkDocumentCounts(page, { draft: 1, pending: 1, completed: 1, all: 3 });
   });
 
   test('received documents from other teams should NOT appear in personal context', async ({ page }) => {
@@ -140,10 +137,9 @@ test.describe('Find Documents UI - Personal Context', () => {
       redirectPath: `/t/${ownerTeam.url}/documents`,
     });
 
-    // Inbox should be 0 since there's no team email and received docs are on sender's team
-    await checkDocumentTabCount(page, 'Inbox', 0);
-    // Owner's own doc should still show in All
-    await checkDocumentTabCount(page, 'All', 1);
+    // Inbox should be 0 since there's no team email and received docs are on sender's team.
+    // Owner's own doc should still show in All.
+    await checkDocumentCounts(page, { inbox: 0, all: 1 });
     await expect(page.getByRole('link', { name: 'Owner Draft Control' })).toBeVisible();
   });
 
@@ -707,9 +703,8 @@ test.describe('Find Documents UI - Team with Team Email', () => {
       redirectPath: `/t/${team.url}/documents`,
     });
 
-    await checkDocumentTabCount(page, 'Inbox', 0);
-    // But pending should still show
-    await checkDocumentTabCount(page, 'Pending', 1);
+    // Inbox should be 0, but pending should still show.
+    await checkDocumentCounts(page, { inbox: 0, pending: 1 });
   });
 
   test('documents sent BY team email user should appear in team context', async ({ page }) => {
@@ -810,12 +805,9 @@ test.describe('Find Documents UI - Data Isolation & No Leaking', () => {
     });
 
     // UserA should see only their own docs
-    await checkDocumentTabCount(page, 'All', 3);
-    await checkDocumentTabCount(page, 'Draft', 1);
-    await checkDocumentTabCount(page, 'Completed', 1);
+    await checkDocumentCounts(page, { draft: 1, completed: 1, all: 3 });
 
     // Verify no B docs leaked
-    await page.getByRole('tab', { name: 'All' }).click();
     await expect(page.getByRole('link', { name: 'A Own Draft' })).toBeVisible();
     await expect(page.getByRole('link', { name: 'B Draft Private', exact: true })).not.toBeVisible();
     await expect(page.getByRole('link', { name: 'B Pending Private', exact: true })).not.toBeVisible();
@@ -966,9 +958,9 @@ test.describe('Find Documents UI - Data Isolation & No Leaking', () => {
       redirectPath: `/t/${outsideTeam.url}/documents`,
     });
 
-    // Only the outside user's own draft should appear (cross-team docs are not visible)
-    await checkDocumentTabCount(page, 'Inbox', 0); // No team email → 0
-    await checkDocumentTabCount(page, 'All', 1); // Check All tab last so we can verify visible links
+    // Only the outside user's own draft should appear (cross-team docs are not visible).
+    // Inbox is 0 since there is no team email.
+    await checkDocumentCounts(page, { inbox: 0, all: 1 });
     await expect(page.getByRole('link', { name: 'Outside Own Draft' })).toBeVisible();
     await expect(page.getByRole('link', { name: 'Team Doc For Outside User', exact: true })).not.toBeVisible();
     await expect(page.getByRole('link', { name: 'Team Doc For Other User Only', exact: true })).not.toBeVisible();
@@ -1013,12 +1005,10 @@ test.describe('Find Documents UI - Tab Counts Consistency', () => {
       redirectPath: `/t/${ownerTeam.url}/documents`,
     });
 
-    // Only owner's own docs appear (received docs are on sender's team)
-    await checkDocumentTabCount(page, 'Draft', 2);
-    await checkDocumentTabCount(page, 'Pending', 1);
-    await checkDocumentTabCount(page, 'Inbox', 0); // No team email → inbox returns null → 0
-    await checkDocumentTabCount(page, 'Completed', 1); // Only owned completed (received is on sender's team)
-    await checkDocumentTabCount(page, 'All', 4); // 2 drafts + 1 pending + 1 completed
+    // Only owner's own docs appear (received docs are on sender's team).
+    // Inbox is 0 since there is no team email, and only the owned completed
+    // doc counts (received is on sender's team). All = 2 drafts + 1 pending + 1 completed.
+    await checkDocumentCounts(page, { inbox: 0, draft: 2, pending: 1, completed: 1, all: 4 });
   });
 
   test('team context tab counts should be accurate with mixed documents', async ({ page }) => {
@@ -1070,10 +1060,7 @@ test.describe('Find Documents UI - Tab Counts Consistency', () => {
       redirectPath: `/t/${team.url}/documents`,
     });
 
-    await checkDocumentTabCount(page, 'Draft', 2);
-    await checkDocumentTabCount(page, 'Pending', 1);
-    await checkDocumentTabCount(page, 'Completed', 1);
-    await checkDocumentTabCount(page, 'All', 4);
+    await checkDocumentCounts(page, { draft: 2, pending: 1, completed: 1, all: 4 });
   });
 
   test('team with team email tab counts should include received documents', async ({ page }) => {
@@ -1107,11 +1094,9 @@ test.describe('Find Documents UI - Tab Counts Consistency', () => {
       redirectPath: `/t/${team.url}/documents`,
     });
 
-    await checkDocumentTabCount(page, 'Draft', 1);
-    await checkDocumentTabCount(page, 'Inbox', 1); // One pending doc received by team email (NOT_SIGNED)
-    await checkDocumentTabCount(page, 'Pending', 1); // Own pending
-    await checkDocumentTabCount(page, 'Completed', 1); // Received completed via email
-    await checkDocumentTabCount(page, 'All', 4); // All of the above
+    // Inbox = one pending doc received by team email (NOT_SIGNED), pending = own
+    // pending, completed = received completed via email, all = all of the above.
+    await checkDocumentCounts(page, { inbox: 1, draft: 1, pending: 1, completed: 1, all: 4 });
   });
 });
 
@@ -1163,9 +1148,7 @@ test.describe('Find Documents UI - Sender Filter', () => {
     await checkDocumentTabCount(page, 'All', 3);
 
     // Filter by member1
-    await page.locator('button').filter({ hasText: 'Sender: All' }).click();
-    await page.getByRole('option', { name: member1.name ?? '' }).click();
-    await page.waitForURL(/senderIds/);
+    await toggleDocumentSenderFilter(page, member1.name ?? '');
 
     // Should only show member1's doc
     await checkDocumentTabCount(page, 'All', 1);

packages/app-tests/e2e/fixtures/documents.ts

@@ -1,11 +1,116 @@
 import type { Page } from '@playwright/test';
 import { expect } from '@playwright/test';
 
-export const checkDocumentTabCount = async (page: Page, tabName: string, count: number) => {
-  await page.getByRole('tab', { name: tabName }).click();
+type DocumentStatusCounts = {
+  inbox?: number;
+  pending?: number;
+  completed?: number;
+  draft?: number;
+  cancelled?: number;
+  rejected?: number;
+  expired?: number;
+  all?: number;
+};
 
-  if (tabName !== 'All') {
-    await expect(page.getByRole('tab', { name: tabName })).toContainText(count.toString());
+const STATUS_KEYS = {
+  inbox: 'INBOX',
+  pending: 'PENDING',
+  completed: 'COMPLETED',
+  draft: 'DRAFT',
+  cancelled: 'CANCELLED',
+  rejected: 'REJECTED',
+  expired: 'EXPIRED',
+  all: 'ALL',
+} as const;
+
+/**
+ * Check the counts for multiple document statuses in one go via the
+ * visually hidden stats rendered alongside the status filter.
+ *
+ * When `all` is provided the status filter is also cleared and the
+ * unfiltered table count (or empty state) is verified.
+ */
+export const checkDocumentCounts = async (page: Page, counts: DocumentStatusCounts) => {
+  for (const [key, status] of Object.entries(STATUS_KEYS)) {
+    const count = counts[key as keyof typeof STATUS_KEYS];
+
+    if (count === undefined) {
+      continue;
+    }
+
+    await expect(page.getByTestId(`documents-status-count-${status}`)).toHaveText(count.toString());
+  }
+
+  if (counts.all !== undefined) {
+    await clearDocumentStatusFilter(page);
+
+    if (counts.all === 0) {
+      await expect(page.getByTestId('empty-document-state')).toBeVisible();
+      return;
+    }
+
+    await expect(page.getByTestId('data-table-count')).toContainText(`Showing ${counts.all}`);
+  }
+};
+
+/**
+ * Select a status in the documents status filter pill.
+ *
+ * No-op if the status is already selected, since selecting the active
+ * option again would clear the filter.
+ */
+export const selectDocumentStatusFilter = async (page: Page, statusName: string) => {
+  const currentStatus = new URL(page.url()).searchParams.get('status');
+
+  if (currentStatus === statusName.toUpperCase()) {
+    return;
+  }
+
+  await page.getByTestId('documents-table-status-filter').click();
+  await page.getByRole('option', { name: statusName }).click();
+};
+
+/**
+ * Toggle a sender in the documents sender filter pill.
+ *
+ * The sender filter is a multi select, so the popover stays open after
+ * picking and is closed with Escape.
+ */
+export const toggleDocumentSenderFilter = async (page: Page, senderName: string) => {
+  await page.getByTestId('documents-table-sender-filter').click();
+  await page.getByRole('option', { name: senderName }).click();
+  await page.waitForURL(/senderIds/);
+  await page.keyboard.press('Escape');
+};
+
+/**
+ * Clear the documents status filter pill, returning to the "All" view.
+ */
+export const clearDocumentStatusFilter = async (page: Page) => {
+  const currentStatus = new URL(page.url()).searchParams.get('status');
+
+  if (!currentStatus) {
+    return;
+  }
+
+  await page.getByTestId('documents-table-status-filter').click();
+  await page.getByRole('option', { name: 'Clear' }).click();
+};
+
+/**
+ * Apply a status filter (or 'All' to clear it) and verify both the hidden
+ * stats count and the resulting table.
+ *
+ * The count is not asserted against the stats for 'All', since tests use it
+ * with search queries applied which only the table respects.
+ */
+export const checkDocumentTabCount = async (page: Page, tabName: string, count: number) => {
+  if (tabName === 'All') {
+    await clearDocumentStatusFilter(page);
+  } else {
+    await expect(page.getByTestId(`documents-status-count-${tabName.toUpperCase()}`)).toHaveText(count.toString());
+
+    await selectDocumentStatusFilter(page, tabName);
   }
 
   if (count === 0) {

packages/app-tests/e2e/teams/team-documents.spec.ts

@@ -5,7 +5,7 @@ import { expect, test } from '@playwright/test';
 import { DocumentStatus, DocumentVisibility, TeamMemberRole } from '@prisma/client';
 
 import { apiSignin, apiSignout } from '../fixtures/authentication';
-import { checkDocumentTabCount } from '../fixtures/documents';
+import { checkDocumentCounts, checkDocumentTabCount, toggleDocumentSenderFilter } from '../fixtures/documents';
 import { expectTextToBeVisible, expectToastTextToBeVisible, openDropdownMenu } from '../fixtures/generic';
 
 test('[TEAMS]: check team documents count', async ({ page }) => {
@@ -20,23 +20,13 @@ test('[TEAMS]: check team documents count', async ({ page }) => {
     });
 
     // Check document counts.
-    await checkDocumentTabCount(page, 'Inbox', 0);
-    await checkDocumentTabCount(page, 'Pending', 2);
-    await checkDocumentTabCount(page, 'Completed', 1);
-    await checkDocumentTabCount(page, 'Draft', 2);
-    await checkDocumentTabCount(page, 'All', 5);
+    await checkDocumentCounts(page, { inbox: 0, pending: 2, completed: 1, draft: 2, all: 5 });
 
     // Apply filter.
-    await page.locator('button').filter({ hasText: 'Sender: All' }).click();
-    await page.getByRole('option', { name: teamMember2.name ?? '' }).click();
-    await page.waitForURL(/senderIds/);
+    await toggleDocumentSenderFilter(page, teamMember2.name ?? '');
 
     // Check counts after filtering.
-    await checkDocumentTabCount(page, 'Inbox', 0);
-    await checkDocumentTabCount(page, 'Pending', 2);
-    await checkDocumentTabCount(page, 'Completed', 0);
-    await checkDocumentTabCount(page, 'Draft', 1);
-    await checkDocumentTabCount(page, 'All', 3);
+    await checkDocumentCounts(page, { inbox: 0, pending: 2, completed: 0, draft: 1, all: 3 });
 
     await apiSignout({ page });
   }
@@ -115,23 +105,13 @@ test('[TEAMS]: check team documents count with internal team email', async ({ pa
     });
 
     // Check document counts.
-    await checkDocumentTabCount(page, 'Inbox', 2);
-    await checkDocumentTabCount(page, 'Pending', 3);
-    await checkDocumentTabCount(page, 'Completed', 3);
-    await checkDocumentTabCount(page, 'Draft', 3);
-    await checkDocumentTabCount(page, 'All', 11);
+    await checkDocumentCounts(page, { inbox: 2, pending: 3, completed: 3, draft: 3, all: 11 });
 
     // Apply filter.
-    await page.locator('button').filter({ hasText: 'Sender: All' }).click();
-    await page.getByRole('option', { name: teamMember2.name ?? '' }).click();
-    await page.waitForURL(/senderIds/);
+    await toggleDocumentSenderFilter(page, teamMember2.name ?? '');
 
     // Check counts after filtering.
-    await checkDocumentTabCount(page, 'Inbox', 0);
-    await checkDocumentTabCount(page, 'Pending', 2);
-    await checkDocumentTabCount(page, 'Completed', 0);
-    await checkDocumentTabCount(page, 'Draft', 1);
-    await checkDocumentTabCount(page, 'All', 3);
+    await checkDocumentCounts(page, { inbox: 0, pending: 2, completed: 0, draft: 1, all: 3 });
 
     await apiSignout({ page });
   }
@@ -202,23 +182,13 @@ test('[TEAMS]: check team documents count with external team email', async ({ pa
   });
 
   // Check document counts.
-  await checkDocumentTabCount(page, 'Inbox', 3);
-  await checkDocumentTabCount(page, 'Pending', 2);
-  await checkDocumentTabCount(page, 'Completed', 2);
-  await checkDocumentTabCount(page, 'Draft', 2);
-  await checkDocumentTabCount(page, 'All', 9);
+  await checkDocumentCounts(page, { inbox: 3, pending: 2, completed: 2, draft: 2, all: 9 });
 
   // Apply filter.
-  await page.locator('button').filter({ hasText: 'Sender: All' }).click();
-  await page.getByRole('option', { name: teamMember2.name ?? '' }).click();
-  await page.waitForURL(/senderIds/);
+  await toggleDocumentSenderFilter(page, teamMember2.name ?? '');
 
   // Check counts after filtering.
-  await checkDocumentTabCount(page, 'Inbox', 0);
-  await checkDocumentTabCount(page, 'Pending', 2);
-  await checkDocumentTabCount(page, 'Completed', 0);
-  await checkDocumentTabCount(page, 'Draft', 1);
-  await checkDocumentTabCount(page, 'All', 3);
+  await checkDocumentCounts(page, { inbox: 0, pending: 2, completed: 0, draft: 1, all: 3 });
 });
 
 test('[TEAMS]: resend pending team document', async ({ page }) => {
@@ -273,11 +243,7 @@ test('[TEAMS]: delete draft team document', async ({ page }) => {
     });
 
     // Check document counts.
-    await checkDocumentTabCount(page, 'Inbox', 0);
-    await checkDocumentTabCount(page, 'Pending', 2);
-    await checkDocumentTabCount(page, 'Completed', 1);
-    await checkDocumentTabCount(page, 'Draft', 1);
-    await checkDocumentTabCount(page, 'All', 4);
+    await checkDocumentCounts(page, { inbox: 0, pending: 2, completed: 1, draft: 1, all: 4 });
 
     await apiSignout({ page });
   }
@@ -316,11 +282,7 @@ test('[TEAMS]: delete pending team document', async ({ page }) => {
     });
 
     // Check document counts.
-    await checkDocumentTabCount(page, 'Inbox', 0);
-    await checkDocumentTabCount(page, 'Pending', 1);
-    await checkDocumentTabCount(page, 'Completed', 1);
-    await checkDocumentTabCount(page, 'Draft', 2);
-    await checkDocumentTabCount(page, 'All', 4);
+    await checkDocumentCounts(page, { inbox: 0, pending: 1, completed: 1, draft: 2, all: 4 });
 
     await apiSignout({ page });
   }
@@ -359,11 +321,7 @@ test('[TEAMS]: delete completed team document', async ({ page }) => {
     });
 
     // Check document counts.
-    await checkDocumentTabCount(page, 'Inbox', 0);
-    await checkDocumentTabCount(page, 'Pending', 2);
-    await checkDocumentTabCount(page, 'Completed', 0);
-    await checkDocumentTabCount(page, 'Draft', 2);
-    await checkDocumentTabCount(page, 'All', 4);
+    await checkDocumentCounts(page, { inbox: 0, pending: 2, completed: 0, draft: 2, all: 4 });
 
     await apiSignout({ page });
   }

packages/app-tests/e2e/templates/bulk-template-actions.spec.ts

@@ -49,10 +49,10 @@ test('[BULK_ACTIONS]: can select multiple templates with checkboxes', async ({ p
   });
 
   await page.locator('tr', { hasText: 'Bulk Test Template 1' }).getByRole('checkbox').click();
-  await expect(page.getByText('1 selected')).toBeVisible();
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
 
   await page.locator('tr', { hasText: 'Bulk Test Template 2' }).getByRole('checkbox').click();
-  await expect(page.getByText('2 selected')).toBeVisible();
+  await expect(page.getByText(/2\s*selected/)).toBeVisible();
 });
 
 test('[BULK_ACTIONS]: header checkbox selects all templates on page', async ({ page }) => {
@@ -66,7 +66,7 @@ test('[BULK_ACTIONS]: header checkbox selects all templates on page', async ({ p
 
   await page.locator('thead').getByRole('checkbox').click();
 
-  await expect(page.getByText(`${templates.length} selected`)).toBeVisible();
+  await expect(page.getByText(new RegExp(`${templates.length}\\s*selected`))).toBeVisible();
 });
 
 test('[BULK_ACTIONS]: can clear selection with X button', async ({ page }) => {
@@ -79,11 +79,11 @@ test('[BULK_ACTIONS]: can clear selection with X button', async ({ page }) => {
   });
 
   await page.locator('thead').getByRole('checkbox').click();
-  await expect(page.getByText(/\d+ selected/)).toBeVisible();
+  await expect(page.getByText(/\d+\s*selected/)).toBeVisible();
 
   await page.getByLabel('Clear selection').click();
 
-  await expect(page.getByText(/\d+ selected/)).not.toBeVisible();
+  await expect(page.getByText(/\d+\s*selected/)).not.toBeVisible();
 });
 
 test('[BULK_ACTIONS]: can move multiple templates to a folder', async ({ page }) => {
@@ -97,13 +97,13 @@ test('[BULK_ACTIONS]: can move multiple templates to a folder', async ({ page })
 
   await page.locator('tr', { hasText: 'Bulk Test Template 1' }).getByRole('checkbox').click();
   await page.locator('tr', { hasText: 'Bulk Test Template 2' }).getByRole('checkbox').click();
-  await page.getByRole('button', { name: 'Move to Folder' }).click();
+  await page.getByRole('button', { name: 'Move', exact: true }).click();
 
   await expect(page.getByRole('dialog')).toBeVisible();
   await expect(page.getByText('Move Templates to Folder')).toBeVisible();
 
   await page.getByRole('button', { name: folder.name }).click();
-  await page.getByRole('button', { name: 'Move' }).click();
+  await page.getByRole('dialog').getByRole('button', { name: 'Move' }).click();
 
   await expectToastTextToBeVisible(page, 'Selected items have been moved.');
 
@@ -151,14 +151,14 @@ test('[BULK_ACTIONS]: selection clears after successful move', async ({ page })
   });
 
   await page.locator('tr', { hasText: 'Bulk Test Template 1' }).getByRole('checkbox').click();
-  await expect(page.getByText('1 selected')).toBeVisible();
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
 
-  await page.getByRole('button', { name: 'Move to Folder' }).click();
+  await page.getByRole('button', { name: 'Move', exact: true }).click();
   await page.getByRole('button', { name: folder.name }).click();
-  await page.getByRole('button', { name: 'Move' }).click();
+  await page.getByRole('dialog').getByRole('button', { name: 'Move' }).click();
 
   await expectToastTextToBeVisible(page, 'Selected items have been moved.');
-  await expect(page.getByText(/\d+ selected/)).not.toBeVisible();
+  await expect(page.getByText(/\d+\s*selected/)).not.toBeVisible();
 });
 
 test('[BULK_ACTIONS]: selection clears after successful delete', async ({ page }) => {
@@ -171,13 +171,13 @@ test('[BULK_ACTIONS]: selection clears after successful delete', async ({ page }
   });
 
   await page.locator('tr', { hasText: 'Bulk Test Template 1' }).getByRole('checkbox').click();
-  await expect(page.getByText('1 selected')).toBeVisible();
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
 
   await page.getByRole('button', { name: 'Delete' }).click();
   await page.getByRole('dialog').getByRole('button', { name: 'Delete' }).click();
 
   await expectToastTextToBeVisible(page, 'Templates deleted');
-  await expect(page.getByText(/\d+ selected/)).not.toBeVisible();
+  await expect(page.getByText(/\d+\s*selected/)).not.toBeVisible();
 });
 
 test('[BULK_ACTIONS]: can search for folders in move dialog', async ({ page }) => {
@@ -199,7 +199,7 @@ test('[BULK_ACTIONS]: can search for folders in move dialog', async ({ page }) =
 
   await page.locator('tr', { hasText: 'Bulk Test Template 1' }).getByRole('checkbox').click();
 
-  await page.getByRole('button', { name: 'Move to Folder' }).click();
+  await page.getByRole('button', { name: 'Move', exact: true }).click();
   await expect(page.getByRole('dialog')).toBeVisible();
 
   await expect(page.getByRole('button', { name: folder.name })).toBeVisible();
@@ -236,14 +236,14 @@ test('[BULK_ACTIONS]: can move templates from folder to home (root)', async ({ p
   await expect(page.getByRole('link', { name: 'Bulk Test Template 1' })).toBeVisible();
 
   await page.locator('tr', { hasText: 'Bulk Test Template 1' }).getByRole('checkbox').click();
-  await expect(page.getByText('1 selected')).toBeVisible();
+  await expect(page.getByText(/1\s*selected/)).toBeVisible();
 
-  await page.getByRole('button', { name: 'Move to Folder' }).click();
+  await page.getByRole('button', { name: 'Move', exact: true }).click();
   await expect(page.getByRole('dialog')).toBeVisible();
 
   await page.getByRole('button', { name: 'Home (No Folder)' }).click();
 
-  await page.getByRole('button', { name: 'Move' }).click();
+  await page.getByRole('dialog').getByRole('button', { name: 'Move' }).click();
 
   await expectToastTextToBeVisible(page, 'Selected items have been moved.');
 

packages/app-tests/package.json

@@ -18,9 +18,9 @@
     "@playwright/test": "1.56.1",
     "@types/node": "^20",
     "@types/pngjs": "^6.0.5",
-    "tsx": "^4.23.1",
     "pixelmatch": "^7.1.0",
-    "pngjs": "^7.0.0"
+    "pngjs": "^7.0.0",
+    "tsx": "^4.23.1"
   },
   "dependencies": {
     "start-server-and-test": "^2.1.3"