feat: remove email requirement for recipients (#2040)

packages/app-tests/e2e/document-flow/autosave-fields-step.spec.ts

@@ -33,7 +33,7 @@ const setupDocumentAndNavigateToFieldsStep = async (page: Page) => {
 };
 
 const triggerAutosave = async (page: Page) => {
-  await page.locator('#document-flow-form-container').click();
+  await page.locator('body').click({ position: { x: 0, y: 0 } });
   await page.locator('#document-flow-form-container').blur();
 
   await page.waitForTimeout(5000);
@@ -70,7 +70,7 @@ test.describe('AutoSave Fields Step', () => {
 
     await triggerAutosave(page);
 
-    await page.getByRole('combobox').click();
+    await page.getByRole('combobox').first().click();
     await page.getByRole('option', { name: 'Recipient 2 (recipient2@documenso.com)' }).click();
 
     await page.getByRole('button', { name: 'Signature' }).click();
@@ -127,7 +127,7 @@ test.describe('AutoSave Fields Step', () => {
 
     await triggerAutosave(page);
 
-    await page.getByRole('combobox').click();
+    await page.getByRole('combobox').first().click();
     await page.getByRole('option', { name: 'Recipient 2 (recipient2@documenso.com)' }).click();
 
     await page.getByRole('button', { name: 'Signature' }).click();
@@ -140,7 +140,7 @@ test.describe('AutoSave Fields Step', () => {
 
     await triggerAutosave(page);
 
-    await page.getByRole('combobox').click();
+    await page.getByRole('combobox').first().click();
     await page.getByRole('option', { name: 'Recipient 1 (recipient1@documenso.com)' }).click();
 
     await page.getByText('Text').nth(1).click();
@@ -191,7 +191,7 @@ test.describe('AutoSave Fields Step', () => {
 
     await triggerAutosave(page);
 
-    await page.getByRole('combobox').click();
+    await page.getByRole('combobox').first().click();
     await page.getByRole('option', { name: 'Recipient 2 (recipient2@documenso.com)' }).click();
 
     await page.getByRole('button', { name: 'Signature' }).click();
@@ -204,7 +204,7 @@ test.describe('AutoSave Fields Step', () => {
 
     await triggerAutosave(page);
 
-    await page.getByRole('combobox').click();
+    await page.getByRole('combobox').first().click();
     await page.getByRole('option', { name: 'Recipient 1 (recipient1@documenso.com)' }).click();
 
     await page.getByText('Signature').nth(1).click();

packages/app-tests/e2e/document-flow/autosave-settings-step.spec.ts

@@ -24,7 +24,7 @@ const setupDocument = async (page: Page) => {
 };
 
 const triggerAutosave = async (page: Page) => {
-  await page.locator('#document-flow-form-container').click();
+  await page.locator('body').click({ position: { x: 0, y: 0 } });
   await page.locator('#document-flow-form-container').blur();
 
   await page.waitForTimeout(5000);

packages/app-tests/e2e/document-flow/autosave-signers-step.spec.ts

@@ -26,7 +26,7 @@ const setupDocumentAndNavigateToSignersStep = async (page: Page) => {
 };
 
 const triggerAutosave = async (page: Page) => {
-  await page.locator('#document-flow-form-container').click();
+  await page.locator('body').click({ position: { x: 0, y: 0 } });
   await page.locator('#document-flow-form-container').blur();
 
   await page.waitForTimeout(5000);
@@ -92,7 +92,7 @@ test.describe('AutoSave Signers Step', () => {
 
     await triggerAutosave(page);
 
-    await page.getByRole('combobox').click();
+    await page.getByRole('combobox').first().click();
     await page.getByRole('option', { name: 'Receives copy' }).click();
 
     await triggerAutosave(page);
@@ -160,9 +160,20 @@ test.describe('AutoSave Signers Step', () => {
       expect(retrievedDocumentData.documentMeta?.signingOrder).toBe('SEQUENTIAL');
       expect(retrievedDocumentData.documentMeta?.allowDictateNextSigner).toBe(true);
       expect(retrievedRecipients.length).toBe(3);
-      expect(retrievedRecipients[0].signingOrder).toBe(2);
-      expect(retrievedRecipients[1].signingOrder).toBe(3);
-      expect(retrievedRecipients[2].signingOrder).toBe(1);
+
+      const firstRecipient = retrievedRecipients.find(
+        (r) => r.email === 'recipient1@documenso.com',
+      );
+      const secondRecipient = retrievedRecipients.find(
+        (r) => r.email === 'recipient2@documenso.com',
+      );
+      const thirdRecipient = retrievedRecipients.find(
+        (r) => r.email === 'recipient3@documenso.com',
+      );
+
+      expect(firstRecipient?.signingOrder).toBe(2);
+      expect(secondRecipient?.signingOrder).toBe(3);
+      expect(thirdRecipient?.signingOrder).toBe(1);
     }).toPass();
   });
 });

packages/app-tests/e2e/document-flow/autosave-subject-step.spec.ts

@@ -42,7 +42,7 @@ export const setupDocumentAndNavigateToSubjectStep = async (page: Page) => {
 };
 
 export const triggerAutosave = async (page: Page) => {
-  await page.locator('#document-flow-form-container').click();
+  await page.locator('body').click({ position: { x: 0, y: 0 } });
   await page.locator('#document-flow-form-container').blur();
 
   await page.waitForTimeout(5000);

packages/app-tests/e2e/document-flow/duplicate-recipients-simple.spec.ts

@@ -0,0 +1,56 @@
+import { expect, test } from '@playwright/test';
+
+import { seedBlankDocument } from '@documenso/prisma/seed/documents';
+import { seedUser } from '@documenso/prisma/seed/users';
+
+import { apiSignin } from '../fixtures/authentication';
+
+test('[DOCUMENT_FLOW]: Simple duplicate recipients test', async ({ page }) => {
+  const { user, team } = await seedUser();
+  const document = await seedBlankDocument(user, team.id);
+
+  await apiSignin({
+    page,
+    email: user.email,
+    redirectPath: `/t/${team.url}/documents/${document.id}/edit`,
+  });
+
+  // Step 1: Settings - Continue with defaults
+  await page.getByRole('button', { name: 'Continue' }).click();
+  await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+  // Step 2: Add duplicate recipients
+  await page.getByPlaceholder('Email').fill('duplicate@example.com');
+  await page.getByPlaceholder('Name').fill('Duplicate 1');
+
+  await page.getByRole('button', { name: 'Add Signer' }).click();
+  await page.getByLabel('Email').nth(1).fill('duplicate@example.com');
+  await page.getByLabel('Name').nth(1).fill('Duplicate 2');
+
+  // Continue to fields
+  await page.getByRole('button', { name: 'Continue' }).click();
+  await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
+
+  // Step 3: Add fields
+  await page.getByRole('button', { name: 'Signature' }).click();
+  await page.locator('canvas').click({ position: { x: 100, y: 100 } });
+
+  await page.getByRole('combobox').first().click();
+
+  // Switch to second duplicate and add field
+  await page.getByText('Duplicate 2 (duplicate@example.com)').first().click();
+  await page.getByRole('button', { name: 'Signature' }).click();
+  await page.locator('canvas').click({ position: { x: 200, y: 100 } });
+
+  // Continue to send
+  await page.getByRole('button', { name: 'Continue' }).click();
+  await expect(page.getByRole('heading', { name: 'Distribute Document' })).toBeVisible();
+
+  // Send document
+  await page.waitForTimeout(2500);
+  await page.getByRole('button', { name: 'Send' }).click();
+
+  await page.waitForURL(new RegExp(`/t/${team.url}/documents/\\d+`));
+
+  await expect(page.getByRole('link', { name: document.title })).toBeVisible();
+});

packages/app-tests/e2e/document-flow/duplicate-recipients.spec.ts

@@ -0,0 +1,355 @@
+import { type Page, expect, test } from '@playwright/test';
+import type { Document, Team } from '@prisma/client';
+
+import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
+import { prisma } from '@documenso/prisma';
+import { seedBlankDocument } from '@documenso/prisma/seed/documents';
+import { seedUser } from '@documenso/prisma/seed/users';
+
+import { apiSignin } from '../fixtures/authentication';
+import { signSignaturePad } from '../fixtures/signature';
+
+/**
+ * Test helper to complete the document creation flow with duplicate recipients
+ */
+const completeDocumentFlowWithDuplicateRecipients = async (options: {
+  page: Page;
+  team: Team;
+  document: Document;
+}) => {
+  const { page, team, document } = options;
+
+  // Step 1: Settings - Continue with defaults
+  await page.getByRole('button', { name: 'Continue' }).click();
+  await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+  // Step 2: Add duplicate recipients
+  await page.getByPlaceholder('Email').fill('duplicate@example.com');
+  await page.getByPlaceholder('Name').fill('Duplicate Recipient 1');
+
+  // Add second signer with same email
+  await page.getByRole('button', { name: 'Add Signer' }).click();
+  await page.getByLabel('Email').nth(1).fill('duplicate@example.com');
+  await page.getByLabel('Name').nth(1).fill('Duplicate Recipient 2');
+
+  // Add third signer with different email for comparison
+  await page.getByRole('button', { name: 'Add Signer' }).click();
+  await page.getByLabel('Email').nth(2).fill('unique@example.com');
+  await page.getByLabel('Name').nth(2).fill('Unique Recipient');
+
+  // Continue to fields
+  await page.getByRole('button', { name: 'Continue' }).click();
+  await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
+
+  // Step 3: Add fields for each recipient
+  // Add signature field for first duplicate recipient
+  await page.getByRole('button', { name: 'Signature' }).click();
+  await page.locator('canvas').click({ position: { x: 100, y: 100 } });
+
+  await page.getByText('Duplicate Recipient 1 (duplicate@example.com)').click();
+
+  // Switch to second duplicate recipient and add their field
+  await page.getByText('Duplicate Recipient 2 (duplicate@example.com)').click();
+  await page.getByRole('button', { name: 'Signature' }).click();
+  await page.locator('canvas').click({ position: { x: 200, y: 100 } });
+
+  await page.getByText('Duplicate Recipient 2 (duplicate@example.com)').click();
+
+  // Switch to unique recipient and add their field
+  await page.getByText('Unique Recipient (unique@example.com)').click();
+  await page.getByRole('button', { name: 'Signature' }).click();
+  await page.locator('canvas').click({ position: { x: 300, y: 100 } });
+
+  // Continue to subject
+  await page.getByRole('button', { name: 'Continue' }).click();
+  await expect(page.getByRole('heading', { name: 'Distribute Document' })).toBeVisible();
+
+  // Step 4: Complete with subject and send
+  await page.waitForTimeout(2500);
+  await page.getByRole('button', { name: 'Send' }).click();
+
+  // Wait for send confirmation
+  await page.waitForURL(new RegExp(`/t/${team.url}/documents/\\d+`));
+
+  await expect(page.getByRole('link', { name: document.title })).toBeVisible();
+};
+
+test.describe('[DOCUMENT_FLOW]: Duplicate Recipients', () => {
+  test('should allow creating document with duplicate recipient emails', async ({ page }) => {
+    const { user, team } = await seedUser();
+
+    const document = await seedBlankDocument(user, team.id);
+
+    await apiSignin({
+      page,
+      email: user.email,
+      redirectPath: `/t/${team.url}/documents/${document.id}/edit`,
+    });
+
+    // Complete the flow
+    await completeDocumentFlowWithDuplicateRecipients({
+      page,
+      team,
+      document,
+    });
+
+    // Verify document was created successfully
+    await expect(page).toHaveURL(new RegExp(`/t/${team.url}/documents`));
+  });
+
+  test('should allow adding duplicate recipient after saving document initially', async ({
+    page,
+  }) => {
+    const { user, team } = await seedUser();
+    const document = await seedBlankDocument(user, team.id);
+
+    await apiSignin({
+      page,
+      email: user.email,
+      redirectPath: `/t/${team.url}/documents/${document.id}/edit`,
+    });
+
+    // Step 1: Settings - Continue with defaults
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+    // Step 2: Add initial recipient
+    await page.getByPlaceholder('Email').fill('test@example.com');
+    await page.getByPlaceholder('Name').fill('Test Recipient');
+
+    // Continue to fields and add a field
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
+
+    await page.getByRole('button', { name: 'Signature' }).click();
+    await page.locator('canvas').click({ position: { x: 100, y: 100 } });
+
+    // Save the document by going to subject
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Distribute Document' })).toBeVisible();
+
+    // Navigate back to signers to add duplicate
+    await page.getByRole('button', { name: 'Go Back' }).click();
+    await page.getByRole('button', { name: 'Go Back' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Signers' })).toBeVisible();
+
+    // Add duplicate recipient
+    await page.getByRole('button', { name: 'Add Signer' }).click();
+    await page.getByLabel('Email').nth(1).fill('test@example.com');
+    await page.getByLabel('Name').nth(1).fill('Test Recipient Duplicate');
+
+    // Continue and add field for duplicate
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
+
+    await page.waitForTimeout(1000);
+
+    // Switch to duplicate recipient and add field
+    await page.getByRole('combobox').first().click();
+    await page.getByText('Test Recipient Duplicate (test@example.com)').first().click();
+
+    await page.getByRole('button', { name: 'Signature' }).click();
+    await page.locator('canvas').click({ position: { x: 200, y: 100 } });
+
+    // Complete the flow
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Distribute Document' })).toBeVisible();
+    await page.waitForTimeout(2500);
+    await page.getByRole('button', { name: 'Send' }).click();
+
+    await page.waitForURL(new RegExp(`/t/${team.url}/documents/\\d+`));
+
+    await expect(page.getByRole('link', { name: document.title })).toBeVisible();
+  });
+
+  test('should isolate fields per recipient token even with duplicate emails', async ({
+    page,
+    context,
+  }) => {
+    const { user, team } = await seedUser();
+
+    const document = await seedBlankDocument(user, team.id);
+
+    await apiSignin({
+      page,
+      email: user.email,
+      redirectPath: `/t/${team.url}/documents/${document.id}/edit`,
+    });
+
+    // Complete the document flow
+    await completeDocumentFlowWithDuplicateRecipients({
+      page,
+      team,
+      document,
+    });
+
+    // Navigate to documents list and get the document
+    await expect(page).toHaveURL(new RegExp(`/t/${team.url}/documents`));
+
+    const recipients = await prisma.recipient.findMany({
+      where: {
+        documentId: document.id,
+      },
+    });
+
+    expect(recipients).toHaveLength(3);
+
+    const tokens = recipients.map((r) => r.token);
+
+    expect(new Set(tokens).size).toBe(3); // All tokens should be unique
+
+    // Test each signing experience in separate browser contexts
+    for (const recipient of recipients) {
+      // Navigate to signing URL
+      await page.goto(`/sign/${recipient.token}`, {
+        waitUntil: 'networkidle',
+      });
+
+      await page.waitForSelector(PDF_VIEWER_PAGE_SELECTOR);
+
+      // Verify only one signature field is visible for this recipient
+      expect(
+        await page.locator(`[data-field-type="SIGNATURE"]:not([data-readonly="true"])`).all(),
+      ).toHaveLength(1);
+
+      // Verify recipient name is correct
+      await expect(page.getByLabel('Full Name')).toHaveValue(recipient.name);
+
+      // Sign the document
+      await signSignaturePad(page);
+
+      await page
+        .locator('[data-field-type="SIGNATURE"]:not([data-readonly="true"])')
+        .first()
+        .click();
+
+      await page.getByRole('button', { name: 'Complete' }).click();
+      await page.getByRole('button', { name: 'Sign' }).click();
+
+      // Verify completion
+      await page.waitForURL(`/sign/${recipient?.token}/complete`);
+      await expect(page.getByText('Document Signed')).toBeVisible();
+    }
+  });
+
+  test('should handle duplicate recipient workflow with different field types', async ({
+    page,
+  }) => {
+    const { user, team } = await seedUser();
+    const document = await seedBlankDocument(user, team.id);
+
+    await apiSignin({
+      page,
+      email: user.email,
+      redirectPath: `/t/${team.url}/documents/${document.id}/edit`,
+    });
+
+    // Step 1: Settings
+    await page.getByRole('button', { name: 'Continue' }).click();
+
+    // Step 2: Add duplicate recipients with different roles
+    await page.getByPlaceholder('Email').fill('signer@example.com');
+    await page.getByPlaceholder('Name').fill('Signer Role');
+
+    await page.getByRole('button', { name: 'Add Signer' }).click();
+    await page.getByLabel('Email').nth(1).fill('signer@example.com');
+    await page.getByLabel('Name').nth(1).fill('Approver Role');
+
+    // Change second recipient role if role selector is available
+    const roleDropdown = page.getByLabel('Role').nth(1);
+
+    if (await roleDropdown.isVisible()) {
+      await roleDropdown.click();
+      await page.getByText('Approver').click();
+    }
+
+    // Step 3: Add different field types for each duplicate
+    await page.getByRole('button', { name: 'Continue' }).click();
+
+    // Add signature for first recipient
+    await page.getByRole('button', { name: 'Signature' }).click();
+    await page.locator('canvas').click({ position: { x: 100, y: 100 } });
+
+    // Add name field for second recipient
+    await page.getByRole('combobox').first().click();
+
+    await page.getByText('Approver Role (signer@example.com)').first().click();
+    await page.getByRole('button', { name: 'Name' }).click();
+    await page.locator('canvas').click({ position: { x: 200, y: 100 } });
+
+    // Add date field for second recipient
+    await page.getByRole('button', { name: 'Date' }).click();
+    await page.locator('canvas').click({ position: { x: 200, y: 150 } });
+
+    // Complete the document
+    await page.getByRole('button', { name: 'Continue' }).click();
+
+    await page.getByRole('button', { name: 'Send' }).click();
+
+    await page.waitForURL(new RegExp(`/t/${team.url}/documents/\\d+`));
+
+    await expect(page.getByRole('link', { name: document.title })).toBeVisible();
+  });
+
+  test('should preserve field assignments when editing document with duplicates', async ({
+    page,
+  }) => {
+    const { user, team } = await seedUser();
+    const document = await seedBlankDocument(user, team.id);
+
+    await apiSignin({
+      page,
+      email: user.email,
+      redirectPath: `/t/${team.url}/documents/${document.id}/edit`,
+    });
+
+    // Create document with duplicates and fields
+    await completeDocumentFlowWithDuplicateRecipients({
+      page,
+      team,
+      document,
+    });
+
+    // Navigate back to edit the document
+    await page.goto(`/t/${team.url}/documents/${document.id}/edit`);
+
+    // Go to fields step
+    await page.getByRole('button', { name: 'Continue' }).click(); // Settings
+    await page.getByRole('button', { name: 'Continue' }).click(); // Signers
+
+    // Verify fields are assigned to correct recipients
+    await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
+
+    // Click on first duplicate recipient
+    await page.getByText('Duplicate Recipient 1 (duplicate@example.com)').click();
+
+    // Verify their field is visible and can be selected
+    const firstRecipientFields = await page
+      .locator(`[data-field-type="SIGNATURE"]:not(:disabled)`)
+      .all();
+    expect(firstRecipientFields.length).toBeGreaterThan(0);
+
+    // Switch to second duplicate recipient
+    await page.getByText('Duplicate Recipient 2 (duplicate@example.com)').click();
+
+    // Verify they have their own field
+    const secondRecipientFields = await page
+      .locator(`[data-field-type="SIGNATURE"]:not(:disabled)`)
+      .all();
+    expect(secondRecipientFields.length).toBeGreaterThan(0);
+
+    // Add another field to the second duplicate
+    await page.getByRole('button', { name: 'Name' }).click();
+    await page.locator('canvas').click({ position: { x: 250, y: 150 } });
+
+    // Save changes
+    await page.getByRole('button', { name: 'Continue' }).click();
+    await expect(page.getByRole('heading', { name: 'Distribute Document' })).toBeVisible();
+    await page.waitForTimeout(2500);
+    await page.getByRole('button', { name: 'Send' }).click();
+
+    await page.waitForURL(new RegExp(`/t/${team.url}/documents/\\d+`));
+
+    await expect(page.getByRole('link', { name: document.title })).toBeVisible();
+  });
+});

packages/app-tests/e2e/document-flow/stepper-component.spec.ts

@@ -573,6 +573,7 @@ test('[DOCUMENT_FLOW]: should be able to create and sign a document with 3 recip
         y: 100 * i,
       },
     });
+
     await page.getByText(`User ${i} (user${i}@example.com)`).click();
   }
 

packages/app-tests/e2e/folders/team-account-folders.spec.ts

@@ -277,13 +277,13 @@ test('[TEAMS]: document folder and its contents can be deleted', async ({ page }
 
   await page.goto(`/t/${team.url}/documents`);
 
-  await expect(page.locator('div').filter({ hasText: folder.name })).not.toBeVisible();
+  await expect(page.locator(`[data-folder-id="${folder.id}"]`)).not.toBeVisible();
   await expect(page.getByText(proposal.title)).not.toBeVisible();
 
   await page.goto(`/t/${team.url}/documents/f/${folder.id}`);
 
   await expect(page.getByText(report.title)).not.toBeVisible();
-  await expect(page.locator('div').filter({ hasText: reportsFolder.name })).not.toBeVisible();
+  await expect(page.locator(`[data-folder-id="${reportsFolder.id}"]`)).not.toBeVisible();
 });
 
 test('[TEAMS]: create folder button is visible on templates page', async ({ page }) => {
@@ -318,9 +318,7 @@ test('[TEAMS]: can create a template folder', async ({ page }) => {
   await expect(page.getByText('Team template folder')).toBeVisible();
 
   await page.goto(`/t/${team.url}/templates`);
-  await expect(
-    page.locator('div').filter({ hasText: 'Team template folder' }).nth(3),
-  ).toBeVisible();
+  await expect(page.locator(`[data-folder-name="Team template folder"]`)).toBeVisible();
 });
 
 test('[TEAMS]: can create a template subfolder inside a template folder', async ({ page }) => {
@@ -374,11 +372,8 @@ test('[TEAMS]: can create a template inside a template folder', async ({ page })
 
   await page.getByRole('button', { name: 'New Template' }).click();
 
-  await page
-    .locator('div')
-    .filter({ hasText: /^Upload Template DocumentDrag & drop your PDF here\.$/ })
-    .nth(2)
-    .click();
+  await page.getByText('Upload Template Document').click();
+
   await page.locator('input[type="file"]').nth(0).waitFor({ state: 'attached' });
 
   await page
@@ -537,7 +532,7 @@ test('[TEAMS]: template folder can be moved to another template folder', async (
   await expect(page.getByText('Team Contract Templates')).toBeVisible();
 });
 
-test('[TEAMS]: template folder and its contents can be deleted', async ({ page }) => {
+test('[TEAMS]: template folder can be deleted', async ({ page }) => {
   const { team, teamOwner } = await seedTeamDocuments();
 
   const folder = await seedBlankFolder(teamOwner, team.id, {
@@ -585,13 +580,16 @@ test('[TEAMS]: template folder and its contents can be deleted', async ({ page }
 
   await page.goto(`/t/${team.url}/templates`);
 
-  await expect(page.locator('div').filter({ hasText: folder.name })).not.toBeVisible();
-  await expect(page.getByText(template.title)).not.toBeVisible();
+  await page.waitForTimeout(1000);
+
+  // !: This is no longer the case, when deleting a folder its contents will be moved to the root folder.
+  // await expect(page.locator(`[data-folder-id="${folder.id}"]`)).not.toBeVisible();
+  // await expect(page.getByText(template.title)).not.toBeVisible();
 
   await page.goto(`/t/${team.url}/templates/f/${folder.id}`);
 
   await expect(page.getByText(reportTemplate.title)).not.toBeVisible();
-  await expect(page.locator('div').filter({ hasText: subfolder.name })).not.toBeVisible();
+  await expect(page.locator(`[data-folder-id="${subfolder.id}"]`)).not.toBeVisible();
 });
 
 test('[TEAMS]: can navigate between template folders', async ({ page }) => {
@@ -843,10 +841,15 @@ test('[TEAMS]: documents inherit folder visibility', async ({ page }) => {
 
   await page.getByText('Admin Only Folder').click();
 
-  const fileInput = page.locator('input[type="file"]').nth(1);
-  await fileInput.waitFor({ state: 'attached' });
+  await page.waitForURL(new RegExp(`/t/${team.url}/documents/f/.+`));
 
-  await fileInput.setInputFiles(
+  // Upload document.
+  const [fileChooser] = await Promise.all([
+    page.waitForEvent('filechooser'),
+    page.getByRole('button', { name: 'Upload Document' }).click(),
+  ]);
+
+  await fileChooser.setFiles(
     path.join(__dirname, '../../../assets/documenso-supporter-pledge.pdf'),
   );
 

packages/app-tests/e2e/templates-flow/duplicate-recipients.spec.ts

@@ -0,0 +1,283 @@
+import { type Page, expect, test } from '@playwright/test';
+import type { Team, Template } from '@prisma/client';
+
+import { PDF_VIEWER_PAGE_SELECTOR } from '@documenso/lib/constants/pdf-viewer';
+import { prisma } from '@documenso/prisma';
+import { seedBlankTemplate } from '@documenso/prisma/seed/templates';
+import { seedUser } from '@documenso/prisma/seed/users';
+
+import { apiSignin } from '../fixtures/authentication';
+
+/**
+ * Test helper to complete template creation with duplicate recipients
+ */
+const completeTemplateFlowWithDuplicateRecipients = async (options: {
+  page: Page;
+  team: Team;
+  template: Template;
+}) => {
+  const { page, team, template } = options;
+  // Step 1: Settings - Continue with defaults
+  await page.getByRole('button', { name: 'Continue' }).click();
+  await expect(page.getByRole('heading', { name: 'Add Placeholders' })).toBeVisible();
+
+  // Step 2: Add duplicate recipients with real emails for testing
+  await page.getByPlaceholder('Email').fill('duplicate@example.com');
+  await page.getByPlaceholder('Name').fill('First Instance');
+
+  // Add second signer with same email
+  await page.getByRole('button', { name: 'Add Placeholder Recipient' }).click();
+  await page.getByPlaceholder('Email').nth(1).fill('duplicate@example.com');
+  await page.getByPlaceholder('Name').nth(1).fill('Second Instance');
+
+  // Add third signer with different email
+  await page.getByRole('button', { name: 'Add Placeholder Recipient' }).click();
+  await page.getByPlaceholder('Email').nth(2).fill('unique@example.com');
+  await page.getByPlaceholder('Name').nth(2).fill('Different Recipient');
+
+  // Continue to fields
+  await page.getByRole('button', { name: 'Continue' }).click();
+  await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
+
+  // Step 3: Add fields for each recipient instance
+  // Add signature field for first instance
+  await page.getByRole('button', { name: 'Signature' }).click();
+  await page.locator('canvas').click({ position: { x: 100, y: 100 } });
+
+  // Switch to second instance and add their field
+  await page.getByRole('combobox').first().click();
+  await page.getByText('Second Instance').first().click();
+  await page.getByRole('button', { name: 'Signature' }).click();
+  await page.locator('canvas').click({ position: { x: 200, y: 100 } });
+
+  // Switch to different recipient and add their field
+  await page.getByRole('combobox').first().click();
+  await page.getByText('Different Recipient').first().click();
+  await page.getByRole('button', { name: 'Name' }).click();
+  await page.locator('canvas').click({ position: { x: 300, y: 100 } });
+
+  // Save template
+  await page.getByRole('button', { name: 'Save Template' }).click();
+
+  // Wait for creation confirmation
+  await page.waitForURL(`/t/${team.url}/templates`);
+  await expect(page.getByRole('link', { name: template.title })).toBeVisible();
+};
+
+test.describe('[TEMPLATE_FLOW]: Duplicate Recipients', () => {
+  test('should allow creating template with duplicate recipient emails', async ({ page }) => {
+    const { user, team } = await seedUser();
+
+    const template = await seedBlankTemplate(user, team.id);
+
+    await apiSignin({
+      page,
+      email: user.email,
+      redirectPath: `/t/${team.url}/templates/${template.id}/edit`,
+    });
+
+    // Complete the template flow
+    await completeTemplateFlowWithDuplicateRecipients({ page, team, template });
+
+    // Verify template was created successfully
+    await expect(page).toHaveURL(`/t/${team.url}/templates`);
+  });
+
+  test('should create document from template with duplicate recipients using same email', async ({
+    page,
+    context,
+  }) => {
+    const { user, team } = await seedUser();
+
+    const template = await seedBlankTemplate(user, team.id);
+
+    await apiSignin({
+      page,
+      email: user.email,
+      redirectPath: `/t/${team.url}/templates/${template.id}/edit`,
+    });
+
+    // Complete template creation
+    await completeTemplateFlowWithDuplicateRecipients({ page, team, template });
+
+    // Navigate to template and create document
+    await page.goto(`/t/${team.url}/templates`);
+
+    await page
+      .getByRole('row', { name: template.title })
+      .getByRole('button', { name: 'Use Template' })
+      .click();
+
+    // Fill recipient information with same email for both instances
+    await expect(page.getByRole('heading', { name: 'Create document' })).toBeVisible();
+
+    // Set same email for both recipient instances
+    const emailInputs = await page.locator('[aria-label="Email"]').all();
+    const nameInputs = await page.locator('[aria-label="Name"]').all();
+
+    // First instance
+    await emailInputs[0].fill('same@example.com');
+    await nameInputs[0].fill('John Doe - Role 1');
+
+    // Second instance (same email)
+    await emailInputs[1].fill('same@example.com');
+    await nameInputs[1].fill('John Doe - Role 2');
+
+    // Different recipient
+    await emailInputs[2].fill('different@example.com');
+    await nameInputs[2].fill('Jane Smith');
+
+    await page.getByLabel('Send document').click();
+
+    // Create document
+    await page.getByRole('button', { name: 'Create and send' }).click();
+    await page.waitForURL(new RegExp(`/t/${team.url}/documents/\\d+`));
+
+    // Get the document ID from URL for database queries
+    const url = page.url();
+    const documentIdMatch = url.match(/\/documents\/(\d+)/);
+
+    const documentId = documentIdMatch ? parseInt(documentIdMatch[1]) : null;
+
+    expect(documentId).not.toBeNull();
+
+    // Get recipients directly from database
+    const recipients = await prisma.recipient.findMany({
+      where: {
+        documentId: documentId!,
+      },
+    });
+
+    expect(recipients).toHaveLength(3);
+
+    // Verify all tokens are unique
+    const tokens = recipients.map((r) => r.token);
+    expect(new Set(tokens).size).toBe(3);
+
+    // Test signing experience for duplicate email recipients
+    const duplicateRecipients = recipients.filter((r) => r.email === 'same@example.com');
+    expect(duplicateRecipients).toHaveLength(2);
+
+    for (const recipient of duplicateRecipients) {
+      // Navigate to signing URL
+      await page.goto(`/sign/${recipient.token}`, {
+        waitUntil: 'networkidle',
+      });
+
+      await page.waitForSelector(PDF_VIEWER_PAGE_SELECTOR);
+
+      // Verify correct recipient name is shown
+      await expect(page.getByLabel('Full Name')).toHaveValue(recipient.name);
+
+      // Verify only one signature field is visible for this recipient
+      expect(
+        await page.locator(`[data-field-type="SIGNATURE"]:not([data-readonly="true"])`).all(),
+      ).toHaveLength(1);
+    }
+  });
+
+  test('should handle template with different types of duplicate emails', async ({ page }) => {
+    const { user, team } = await seedUser();
+
+    const template = await seedBlankTemplate(user, team.id);
+
+    await apiSignin({
+      page,
+      email: user.email,
+      redirectPath: `/t/${team.url}/templates/${template.id}/edit`,
+    });
+
+    // Step 1: Settings
+    await page.getByRole('button', { name: 'Continue' }).click();
+
+    // Step 2: Add multiple recipients with duplicate emails
+    await page.getByPlaceholder('Email').fill('duplicate@example.com');
+    await page.getByPlaceholder('Name').fill('Duplicate Recipient 1');
+
+    await page.getByRole('button', { name: 'Add Placeholder Recipient' }).click();
+    await page.getByPlaceholder('Email').nth(1).fill('duplicate@example.com');
+    await page.getByPlaceholder('Name').nth(1).fill('Duplicate Recipient 2');
+
+    await page.getByRole('button', { name: 'Add Placeholder Recipient' }).click();
+    await page.getByPlaceholder('Email').nth(2).fill('different@example.com');
+    await page.getByPlaceholder('Name').nth(2).fill('Different Recipient');
+
+    // Continue and add fields
+    await page.getByRole('button', { name: 'Continue' }).click();
+
+    // Add fields for each recipient
+    await page.getByRole('button', { name: 'Signature' }).click();
+    await page.locator('canvas').click({ position: { x: 100, y: 100 } });
+
+    await page.getByRole('combobox').first().click();
+    await page.getByText('Duplicate Recipient 2').first().click();
+    await page.getByRole('button', { name: 'Date' }).click();
+    await page.locator('canvas').click({ position: { x: 200, y: 100 } });
+
+    await page.getByRole('combobox').first().click();
+    await page.getByText('Different Recipient').first().click();
+    await page.getByRole('button', { name: 'Name' }).click();
+    await page.locator('canvas').click({ position: { x: 100, y: 200 } });
+
+    // Save template
+    await page.getByRole('button', { name: 'Save Template' }).click();
+
+    await page.waitForURL(`/t/${team.url}/templates`);
+
+    await expect(page.getByRole('link', { name: template.title })).toBeVisible();
+  });
+
+  test('should validate field assignments per recipient in template editing', async ({ page }) => {
+    const { user, team } = await seedUser();
+
+    const template = await seedBlankTemplate(user, team.id);
+
+    await apiSignin({
+      page,
+      email: user.email,
+      redirectPath: `/t/${team.url}/templates/${template.id}/edit`,
+    });
+
+    // Create template with duplicates
+    await completeTemplateFlowWithDuplicateRecipients({ page, team, template });
+
+    // Navigate back to edit the template
+    await page.goto(`/t/${team.url}/templates/${template.id}/edit`);
+
+    // Go to fields step
+    await page.getByRole('button', { name: 'Continue' }).click(); // Settings
+    await page.getByRole('button', { name: 'Continue' }).click(); // Signers
+
+    await expect(page.getByRole('heading', { name: 'Add Fields' })).toBeVisible();
+
+    // Verify fields are correctly assigned to each recipient instance
+    await page.getByRole('combobox').first().click();
+    await page.getByRole('option', { name: 'First Instance' }).first().click();
+    let visibleFields = await page.locator(`[data-field-type="SIGNATURE"]:not(:disabled)`).all();
+    expect(visibleFields.length).toBeGreaterThan(0);
+
+    await page.getByRole('combobox').first().click();
+    await page.getByRole('option', { name: 'Second Instance' }).first().click();
+    visibleFields = await page.locator(`[data-field-type="SIGNATURE"]:not(:disabled)`).all();
+    expect(visibleFields.length).toBeGreaterThan(0);
+
+    await page.getByRole('combobox').first().click();
+    await page.getByRole('option', { name: 'Different Recipient' }).first().click();
+    const nameFields = await page.locator(`[data-field-type="NAME"]:not(:disabled)`).all();
+    expect(nameFields.length).toBeGreaterThan(0);
+
+    // Add additional field to verify proper assignment
+    await page.getByRole('combobox').first().click();
+    await page.getByRole('option', { name: 'First Instance' }).first().click();
+    await page.getByRole('button', { name: 'Name' }).click();
+    await page.locator('canvas').click({ position: { x: 100, y: 300 } });
+
+    await page.waitForTimeout(2500);
+
+    // Save changes
+    await page.getByRole('button', { name: 'Save Template' }).click();
+
+    await page.waitForURL(`/t/${team.url}/templates`);
+    await expect(page.getByRole('link', { name: template.title })).toBeVisible();
+  });
+});

packages/app-tests/e2e/templates-flow/template-autosave-fields-step.spec.ts

@@ -33,7 +33,7 @@ const setupTemplateAndNavigateToFieldsStep = async (page: Page) => {
 };
 
 const triggerAutosave = async (page: Page) => {
-  await page.locator('#document-flow-form-container').click();
+  await page.locator('body').click({ position: { x: 0, y: 0 } });
   await page.locator('#document-flow-form-container').blur();
 
   await page.waitForTimeout(5000);
@@ -70,7 +70,7 @@ test.describe('AutoSave Fields Step', () => {
 
     await triggerAutosave(page);
 
-    await page.getByRole('combobox').click();
+    await page.getByRole('combobox').first().click();
     await page.getByRole('option', { name: 'Recipient 2 (recipient2@documenso.com)' }).click();
 
     await page.getByRole('button', { name: 'Signature' }).click();
@@ -129,7 +129,7 @@ test.describe('AutoSave Fields Step', () => {
 
     await triggerAutosave(page);
 
-    await page.getByRole('combobox').click();
+    await page.getByRole('combobox').first().click();
     await page.getByRole('option', { name: 'Recipient 2 (recipient2@documenso.com)' }).click();
 
     await page.getByRole('button', { name: 'Signature' }).click();
@@ -142,7 +142,7 @@ test.describe('AutoSave Fields Step', () => {
 
     await triggerAutosave(page);
 
-    await page.getByRole('combobox').click();
+    await page.getByRole('combobox').first().click();
     await page.getByRole('option', { name: 'Recipient 1 (recipient1@documenso.com)' }).click();
 
     await page.getByText('Text').nth(1).click();
@@ -195,7 +195,7 @@ test.describe('AutoSave Fields Step', () => {
 
     await triggerAutosave(page);
 
-    await page.getByRole('combobox').click();
+    await page.getByRole('combobox').first().click();
     await page.getByRole('option', { name: 'Recipient 2 (recipient2@documenso.com)' }).click();
 
     await page.getByRole('button', { name: 'Signature' }).click();
@@ -208,7 +208,7 @@ test.describe('AutoSave Fields Step', () => {
 
     await triggerAutosave(page);
 
-    await page.getByRole('combobox').click();
+    await page.getByRole('combobox').first().click();
     await page.getByRole('option', { name: 'Recipient 1 (recipient1@documenso.com)' }).click();
 
     await page.getByText('Signature').nth(1).click();

packages/app-tests/e2e/templates-flow/template-autosave-settings-step.spec.ts

@@ -23,7 +23,7 @@ const setupTemplate = async (page: Page) => {
 };
 
 const triggerAutosave = async (page: Page) => {
-  await page.locator('#document-flow-form-container').click();
+  await page.locator('body').click({ position: { x: 0, y: 0 } });
   await page.locator('#document-flow-form-container').blur();
 
   await page.waitForTimeout(5000);

packages/app-tests/e2e/templates-flow/template-autosave-signers-step.spec.ts

@@ -26,7 +26,7 @@ const setupTemplateAndNavigateToSignersStep = async (page: Page) => {
 };
 
 const triggerAutosave = async (page: Page) => {
-  await page.locator('#document-flow-form-container').click();
+  await page.locator('body').click({ position: { x: 0, y: 0 } });
   await page.locator('#document-flow-form-container').blur();
 
   await page.waitForTimeout(5000);