E2E sign-up flows with real emails.

// tests/fixtures/inbox.ts
import { test as base } from '@playwright/test';
import { CatchOTP, type Inbox } from '@catchotp/sdk';

export const test = base.extend<{ inbox: Inbox }>({
  inbox: async ({}, use) => {
    const otp = new CatchOTP({ apiKey: process.env.CATCHOTP_KEY! });
    const inbox = await otp.inboxes.create({ mode: 'ephemeral', ttlMinutes: 15 });
    await use(inbox);
    // No teardown needed — TTL handles it. Delete explicitly if you want it gone now.
    await otp.inboxes.delete(inbox.id).catch(() => {});
  },
});
export { expect } from '@playwright/test';

// tests/signup.spec.ts
import { test, expect } from './fixtures/inbox';
import { CatchOTP } from '@catchotp/sdk';

const otp = new CatchOTP({ apiKey: process.env.CATCHOTP_KEY! });

test('magic-link signup completes end-to-end', async ({ page, inbox }) => {
  await page.goto('https://example.com/signup');
  await page.getByLabel('Email').fill(inbox.address);
  await page.getByRole('button', { name: 'Send magic link' }).click();
  await expect(page.getByText('Check your inbox')).toBeVisible();

  // Wait for the email; pull the magic-link URL out of the body
  const message = await otp.messages.waitFor(inbox.id, {
    subject: /sign in to example/i,
    timeoutSeconds: 30,
  });
  const link = message.links.find((l) => l.url.includes('/auth/magic'));
  expect(link).toBeDefined();

  await page.goto(link!.url);
  await expect(page.getByRole('heading', { name: 'Welcome back' })).toBeVisible();
});

// cypress/support/commands.ts
import { CatchOTP } from '@catchotp/sdk';
const otp = new CatchOTP({ apiKey: Cypress.env('CATCHOTP_KEY') });

Cypress.Commands.add('createInbox', () => {
  return cy.wrap(otp.inboxes.create({ mode: 'ephemeral', ttlMinutes: 15 }));
});

Cypress.Commands.add('waitForMagicLink', (inboxId: string) => {
  return cy
    .wrap(otp.messages.waitFor(inboxId, { subject: /sign in/i, timeoutSeconds: 30 }))
    .then((msg) => msg.links.find((l) => l.url.includes('/auth/magic'))!.url);
});

// cypress/e2e/signup.cy.ts
describe('signup', () => {
  it('completes via magic link', () => {
    cy.createInbox().then((inbox) => {
      cy.visit('/signup');
      cy.get('input[name="email"]').type(inbox.address);
      cy.contains('Send magic link').click();

      cy.waitForMagicLink(inbox.id).then((url) => {
        cy.visit(url);
        cy.contains('Welcome back').should('be.visible');
      });
    });
  });
});