test(e2e): PR 2 — import OCR + plans + mailing Mailpit
Ajoute 6 scénarios Playwright qui couvrent les surfaces utilisateur
au-delà de l'auth/clients/factures : upload OCR via dropzone, listing
des plans pré-fournis, et la chaîne mailing complète end-to-end.
Import (2 tests) — import.spec.ts :
- Upload PDF via setInputFiles : MockOcrProvider extrait depuis le
filename → drafts créés → SPA redirige sur /factures/import/$batchId
→ on voit le filename listé dans les drafts
- Empty state /factures/import : dropzone + bouton "Parcourir" visibles
Plans (3 tests) — plans.spec.ts :
- Les 4 plans pré-fournis (Standard, Rapide, Patient, Ferme) sont
visibles dès le signup (provisionnés par provisionDefaultPlans)
- Clic "Créer un plan" → arrive sur le wizard /plans/nouveau
- Clic "Modifier" sur une PlanCard → page détail /plans/{slug}
Mailing (1 test, le plus précieux) — mailing.spec.ts :
- Helper helpers/mailpit.ts : clearMailpit, waitForMessageTo (poll
200ms / 10s timeout), getMessage (HTML + texte)
- Scénario : signup → onboarding → créer client avec email →
créer facture saisie manuelle → mark-paid → BullMQ worker enqueue
payment-thanks → email envoyé via SMTP → Mailpit catche →
test inspecte subject + body (numero, montant)
- Valide la chaîne complète : SPA → API → DB → BullMQ → Worker →
Mailpit, en moins de 5 s
Total après cette PR : 26 scénarios Playwright verts en 55 s.
Pré-requis runtime :
- `pnpm dev:up` (Postgres + Redis + Mailpit + MinIO)
- `pnpm e2e:setup` (création DB rubis_test_e2e + migrations)
- Mailpit accessible sur :8025 (clearMailpit l'utilise en beforeEach)
Note check-in flow : pas implémenté en E2E V1 — nécessite un endpoint
test_e2e pour générer un CheckinTask + clear token. Le flow checkin
est déjà couvert par les tests japa functional. À ajouter en PR 3 si
besoin de validation end-to-end UI.
Co-Authored-By: Claude Opus 4.7 <noreply@anthropic.com>
This commit is contained in:
ordinarthur
parent
35ffde9d56
commit
0ecf8ad40f
98
e2e/tests/helpers/mailpit.ts
Normal file
98
e2e/tests/helpers/mailpit.ts
Normal file
@ -0,0 +1,98 @@
|
||||
import { request, type APIRequestContext } from '@playwright/test'
|
||||
|
||||
/**
|
||||
* Helpers pour interagir avec Mailpit (SMTP catcher local).
|
||||
*
|
||||
* Mailpit tourne sur http://localhost:8025 via docker-compose dev
|
||||
* (cf. /docker-compose.dev.yml). L'API REST permet de :
|
||||
* - Lister les messages reçus
|
||||
* - Récupérer le contenu HTML/texte d'un message
|
||||
* - Vider la boîte (utile en beforeEach E2E)
|
||||
*
|
||||
* Doc API : https://mailpit.axllent.org/docs/api-v1/
|
||||
*/
|
||||
|
||||
const MAILPIT_URL = process.env.E2E_MAILPIT_URL ?? 'http://localhost:8025'
|
||||
|
||||
let _ctx: APIRequestContext | null = null
|
||||
async function ctx(): Promise<APIRequestContext> {
|
||||
if (_ctx) return _ctx
|
||||
_ctx = await request.newContext({ baseURL: MAILPIT_URL })
|
||||
return _ctx
|
||||
}
|
||||
|
||||
export type MailpitMessage = {
|
||||
ID: string
|
||||
MessageID: string
|
||||
Read: boolean
|
||||
From: { Name: string; Address: string }
|
||||
To: Array<{ Name: string; Address: string }>
|
||||
Subject: string
|
||||
Created: string
|
||||
Snippet: string
|
||||
}
|
||||
|
||||
export type MailpitMessageDetail = MailpitMessage & {
|
||||
Text: string
|
||||
HTML: string
|
||||
ReplyTo: Array<{ Name: string; Address: string }>
|
||||
}
|
||||
|
||||
/**
|
||||
* Vide TOUS les messages Mailpit. À appeler en `beforeEach` E2E pour
|
||||
* isoler les assertions email entre scénarios.
|
||||
*/
|
||||
export async function clearMailpit(): Promise<void> {
|
||||
const c = await ctx()
|
||||
await c.delete('/api/v1/messages')
|
||||
}
|
||||
|
||||
/**
|
||||
* Liste les messages reçus, plus récent en premier.
|
||||
*/
|
||||
export async function listMessages(): Promise<MailpitMessage[]> {
|
||||
const c = await ctx()
|
||||
const r = await c.get('/api/v1/messages')
|
||||
if (!r.ok()) throw new Error(`Mailpit list failed: ${r.status()}`)
|
||||
const json = (await r.json()) as { messages: MailpitMessage[] }
|
||||
return json.messages ?? []
|
||||
}
|
||||
|
||||
/**
|
||||
* Attend qu'au moins un message arrive pour l'adresse `to`, avec polling
|
||||
* toutes les 200 ms (timeout 10 s par défaut). Renvoie le 1er match.
|
||||
*
|
||||
* Utile parce que les emails partent via BullMQ worker (async) — l'instant
|
||||
* où on clique sur "Relancer maintenant" et l'instant où Mailpit reçoit
|
||||
* peuvent être espacés de 1-2 s.
|
||||
*/
|
||||
export async function waitForMessageTo(
|
||||
to: string,
|
||||
opts: { timeoutMs?: number; subjectIncludes?: string } = {},
|
||||
): Promise<MailpitMessage> {
|
||||
const timeoutMs = opts.timeoutMs ?? 10_000
|
||||
const deadline = Date.now() + timeoutMs
|
||||
while (Date.now() < deadline) {
|
||||
const messages = await listMessages()
|
||||
const match = messages.find(
|
||||
(m) =>
|
||||
m.To.some((t) => t.Address.toLowerCase() === to.toLowerCase()) &&
|
||||
(!opts.subjectIncludes || m.Subject.includes(opts.subjectIncludes)),
|
||||
)
|
||||
if (match) return match
|
||||
await new Promise((r) => setTimeout(r, 200))
|
||||
}
|
||||
throw new Error(
|
||||
`Mailpit : aucun message reçu pour ${to}${opts.subjectIncludes ? ` (subject contient "${opts.subjectIncludes}")` : ''} dans ${timeoutMs} ms`,
|
||||
)
|
||||
}
|
||||
|
||||
/**
|
||||
* Récupère le détail d'un message (HTML + texte).
|
||||
*/
|
||||
export async function getMessage(id: string): Promise<MailpitMessageDetail> {
|
||||
const c = await ctx()
|
||||
const r = await c.get(`/api/v1/message/${id}`)
|
||||
if (!r.ok()) throw new Error(`Mailpit get failed: ${r.status()}`)
|
||||
return (await r.json()) as MailpitMessageDetail
|
||||
}
|
||||
94
e2e/tests/import.spec.ts
Normal file
94
e2e/tests/import.spec.ts
Normal file
@ -0,0 +1,94 @@
|
||||
import { test, expect } from '@playwright/test'
|
||||
import { join } from 'node:path'
|
||||
import { resetDb } from './helpers/api'
|
||||
|
||||
/**
|
||||
* Scénarios import OCR via /factures/import.
|
||||
*
|
||||
* En mode `test_e2e`, le provider OCR est `mock` (cf. .env de l'API
|
||||
* spawn par Playwright config), donc l'upload d'un PDF déclenche le
|
||||
* MockOcrProvider qui génère des champs plausibles depuis le filename
|
||||
* sans appel réseau.
|
||||
*
|
||||
* On utilise un vrai PDF du dossier fixtures (qui est ignoré par git
|
||||
* mais existe en local) pour tester l'upload multipart réel. Si le
|
||||
* dossier est vide (CI fresh), les tests sont skip.
|
||||
*/
|
||||
|
||||
const FIXTURE_PDF = join(
|
||||
process.cwd(),
|
||||
'e2e',
|
||||
'fixtures',
|
||||
'invoices',
|
||||
'facture-pas-en-retard-echeance-30j-001.pdf',
|
||||
)
|
||||
|
||||
async function signupAndOnboard(page: import('@playwright/test').Page, tag = 'imp') {
|
||||
const email = `${tag}+${Date.now()}@rubis.test`
|
||||
await page.goto('/signup')
|
||||
await page.getByLabel(/Prénom \/ Nom/i).fill('Test User')
|
||||
await page.getByLabel(/Email professionnel/i).fill(email)
|
||||
await page.getByLabel(/Mot de passe/i).fill('motdepasse-fort-123')
|
||||
await page.getByRole('button', { name: /créer mon compte/i }).click()
|
||||
await page.waitForURL(/\/onboarding\/compte/, { timeout: 10_000 })
|
||||
await page.getByRole('button', { name: /continuer/i }).click()
|
||||
await page.waitForURL(/\/onboarding\/entreprise/)
|
||||
await page.getByLabel(/nom de l'entreprise/i).fill('Atelier Test')
|
||||
await page.getByRole('button', { name: /continuer/i }).click()
|
||||
await page.waitForURL(/\/onboarding\/signature/)
|
||||
await page.getByRole('button', { name: /terminer/i }).click()
|
||||
await page.waitForURL('/', { timeout: 10_000 })
|
||||
}
|
||||
|
||||
test.describe('Import factures via dropzone', () => {
|
||||
test.beforeEach(async () => {
|
||||
await resetDb()
|
||||
})
|
||||
|
||||
test('upload PDF → drafts générés + redirection /import/$batchId', async ({
|
||||
page,
|
||||
}) => {
|
||||
// Skip si pas de fixture (CI fresh)
|
||||
try {
|
||||
// existsSync via Playwright fs
|
||||
const { existsSync } = await import('node:fs')
|
||||
if (!existsSync(FIXTURE_PDF)) {
|
||||
test.skip(true, `Pas de PDF fixture (${FIXTURE_PDF}) — skip`)
|
||||
}
|
||||
} catch {
|
||||
test.skip(true, 'fs indispo')
|
||||
}
|
||||
|
||||
await signupAndOnboard(page, 'imp-upload')
|
||||
|
||||
await page.goto('/factures/import')
|
||||
await expect(
|
||||
page.getByRole('heading', { name: /importer.*plusieurs.*factures/i }),
|
||||
).toBeVisible()
|
||||
|
||||
// Le file input est caché derrière le Dropzone — Playwright peut
|
||||
// setInputFiles directement même sur un input hidden.
|
||||
const fileInput = page.locator('input[type="file"]')
|
||||
await fileInput.setInputFiles(FIXTURE_PDF)
|
||||
|
||||
// Le SPA fait un POST multipart à /api/v1/invoices/upload puis
|
||||
// navigate sur /factures/import/$batchId
|
||||
await page.waitForURL(/\/factures\/import\/[a-f0-9-]+/, { timeout: 15_000 })
|
||||
|
||||
// Au moins 1 draft visible (le filename apparaît quelque part)
|
||||
await expect(
|
||||
page.getByText(/facture-pas-en-retard/).first(),
|
||||
).toBeVisible({ timeout: 5_000 })
|
||||
})
|
||||
|
||||
test('page /factures/import affiche le dropzone vide', async ({ page }) => {
|
||||
await signupAndOnboard(page, 'imp-empty')
|
||||
await page.goto('/factures/import')
|
||||
// Texte du dropzone
|
||||
await expect(
|
||||
page.getByText(/PDF.*PNG.*JPG.*fichiers.*simultané/i),
|
||||
).toBeVisible()
|
||||
// Bouton parcourir
|
||||
await expect(page.getByRole('button', { name: /parcourir.*fichiers/i })).toBeVisible()
|
||||
})
|
||||
})
|
||||
107
e2e/tests/mailing.spec.ts
Normal file
107
e2e/tests/mailing.spec.ts
Normal file
@ -0,0 +1,107 @@
|
||||
import { test, expect } from '@playwright/test'
|
||||
import { resetDb } from './helpers/api'
|
||||
import { clearMailpit, getMessage, waitForMessageTo } from './helpers/mailpit'
|
||||
|
||||
/**
|
||||
* Scénarios mailing — la chaîne complète passe par Mailpit (SMTP local
|
||||
* sur :1025, UI/API :8025).
|
||||
*
|
||||
* Le scénario validé ici : créer une facture, la marquer encaissée →
|
||||
* BullMQ worker enqueue le job `payment-thanks` → email "Merci, paiement
|
||||
* bien reçu" envoyé au client final → Mailpit catche → on inspecte
|
||||
* subject + body via l'API Mailpit.
|
||||
*
|
||||
* Pré-requis :
|
||||
* - Mailpit container up (`pnpm dev:up`)
|
||||
* - Redis container up (BullMQ workers démarrent au boot API)
|
||||
*
|
||||
* Latence typique : ~2 s entre le clic mark-paid et Mailpit (job BullMQ
|
||||
* + render React Email + envoi SMTP). On poll Mailpit jusqu'à 10 s.
|
||||
*/
|
||||
|
||||
async function signupAndOnboard(
|
||||
page: import('@playwright/test').Page,
|
||||
tag = 'mail',
|
||||
) {
|
||||
const email = `${tag}+${Date.now()}@rubis.test`
|
||||
await page.goto('/signup')
|
||||
await page.getByLabel(/Prénom \/ Nom/i).fill('Test User')
|
||||
await page.getByLabel(/Email professionnel/i).fill(email)
|
||||
await page.getByLabel(/Mot de passe/i).fill('motdepasse-fort-123')
|
||||
await page.getByRole('button', { name: /créer mon compte/i }).click()
|
||||
await page.waitForURL(/\/onboarding\/compte/, { timeout: 10_000 })
|
||||
await page.getByRole('button', { name: /continuer/i }).click()
|
||||
await page.waitForURL(/\/onboarding\/entreprise/)
|
||||
await page.getByLabel(/nom de l'entreprise/i).fill('Atelier Mail')
|
||||
await page.getByRole('button', { name: /continuer/i }).click()
|
||||
await page.waitForURL(/\/onboarding\/signature/)
|
||||
await page.getByRole('button', { name: /terminer/i }).click()
|
||||
await page.waitForURL('/', { timeout: 10_000 })
|
||||
}
|
||||
|
||||
test.describe('Mailing — payment thanks via Mailpit', () => {
|
||||
test.beforeEach(async () => {
|
||||
await resetDb()
|
||||
await clearMailpit()
|
||||
})
|
||||
|
||||
test('mark-paid déclenche l\'email "Merci, paiement bien reçu" au client', async ({
|
||||
page,
|
||||
}) => {
|
||||
const clientEmail = `client-mail-${Date.now()}@example.test`
|
||||
|
||||
await signupAndOnboard(page, 'mail-thanks')
|
||||
|
||||
// 1. Créer un client avec l'email qu'on va surveiller dans Mailpit
|
||||
await page.goto('/clients')
|
||||
await page.getByRole('button', { name: /nouveau client/i }).first().click()
|
||||
await page.getByLabel(/^Nom du client$/i).fill('Boulangerie Mail Test')
|
||||
await page.getByLabel(/^Email du contact$/i).fill(clientEmail)
|
||||
await page.getByRole('button', { name: /^créer le client$/i }).click()
|
||||
await expect(page.getByText('Boulangerie Mail Test').first()).toBeVisible({
|
||||
timeout: 5_000,
|
||||
})
|
||||
|
||||
// 2. Créer une facture saisie manuelle
|
||||
await page.getByRole('button', { name: /^saisir$/i }).first().click()
|
||||
await expect(page.getByRole('dialog')).toBeVisible()
|
||||
|
||||
const combobox = page.getByPlaceholder(/rechercher.*créer un client/i)
|
||||
await combobox.fill('Boulangerie Mail')
|
||||
await expect(
|
||||
page.getByRole('option', { name: /Boulangerie Mail Test/i }),
|
||||
).toBeVisible({ timeout: 5_000 })
|
||||
await page.getByRole('option', { name: /Boulangerie Mail Test/i }).click()
|
||||
|
||||
await page.getByLabel(/N° de facture/i).fill('F-MAIL-001')
|
||||
await page.getByLabel(/Montant TTC/i).fill('1240')
|
||||
|
||||
await page.getByLabel(/Plan de relance/i).click()
|
||||
await page.getByRole('option').first().click()
|
||||
|
||||
await page.getByRole('button', { name: /^créer la facture$/i }).click()
|
||||
|
||||
// 3. Aller sur la liste, ouvrir le détail de la facture
|
||||
await page.goto('/factures')
|
||||
await expect(page.getByText('F-MAIL-001').first()).toBeVisible({ timeout: 5_000 })
|
||||
await page.getByText('F-MAIL-001').first().click()
|
||||
|
||||
// 4. Cliquer "Marquer encaissée"
|
||||
await page.getByRole('button', { name: /marquer encaissée/i }).click()
|
||||
// Toast de confirmation
|
||||
await expect(page.getByText(/encaissée.*rubis/i)).toBeVisible({ timeout: 5_000 })
|
||||
|
||||
// 5. Attendre l'email Mailpit au client
|
||||
const msg = await waitForMessageTo(clientEmail, {
|
||||
subjectIncludes: 'F-MAIL-001',
|
||||
timeoutMs: 15_000,
|
||||
})
|
||||
expect(msg.From.Address).toBeTruthy()
|
||||
|
||||
// 6. Vérifier le contenu : le body mentionne le numero + montant
|
||||
const detail = await getMessage(msg.ID)
|
||||
expect(detail.Subject).toMatch(/paiement|reçu|F-MAIL-001/i)
|
||||
expect(detail.Text + detail.HTML).toMatch(/F-MAIL-001/)
|
||||
expect(detail.Text + detail.HTML).toMatch(/1\s*240/) // "1 240 €" ou variation
|
||||
})
|
||||
})
|
||||
72
e2e/tests/plans.spec.ts
Normal file
72
e2e/tests/plans.spec.ts
Normal file
@ -0,0 +1,72 @@
|
||||
import { test, expect } from '@playwright/test'
|
||||
import { resetDb } from './helpers/api'
|
||||
|
||||
/**
|
||||
* Scénarios plans de relance.
|
||||
*
|
||||
* On valide la list view (4 plans pré-fournis après signup) + la
|
||||
* navigation vers le wizard de création. Le wizard 4 étapes lui-même
|
||||
* (avec génération IA des emails) est testé par les tests japa
|
||||
* functional pour le détail métier, et reste hors scope E2E V1.
|
||||
*/
|
||||
|
||||
async function signupAndOnboard(page: import('@playwright/test').Page, tag = 'pl') {
|
||||
const email = `${tag}+${Date.now()}@rubis.test`
|
||||
await page.goto('/signup')
|
||||
await page.getByLabel(/Prénom \/ Nom/i).fill('Test User')
|
||||
await page.getByLabel(/Email professionnel/i).fill(email)
|
||||
await page.getByLabel(/Mot de passe/i).fill('motdepasse-fort-123')
|
||||
await page.getByRole('button', { name: /créer mon compte/i }).click()
|
||||
await page.waitForURL(/\/onboarding\/compte/, { timeout: 10_000 })
|
||||
await page.getByRole('button', { name: /continuer/i }).click()
|
||||
await page.waitForURL(/\/onboarding\/entreprise/)
|
||||
await page.getByLabel(/nom de l'entreprise/i).fill('Atelier Test')
|
||||
await page.getByRole('button', { name: /continuer/i }).click()
|
||||
await page.waitForURL(/\/onboarding\/signature/)
|
||||
await page.getByRole('button', { name: /terminer/i }).click()
|
||||
await page.waitForURL('/', { timeout: 10_000 })
|
||||
}
|
||||
|
||||
test.describe('Plans de relance', () => {
|
||||
test.beforeEach(async () => {
|
||||
await resetDb()
|
||||
})
|
||||
|
||||
test('les 4 plans pré-fournis sont visibles après signup', async ({ page }) => {
|
||||
await signupAndOnboard(page, 'pl-default')
|
||||
await page.goto('/plans')
|
||||
|
||||
await expect(
|
||||
page.getByRole('heading', { name: /plans de.*relance/i }),
|
||||
).toBeVisible()
|
||||
|
||||
// Les 4 plans pré-fournis ont des slugs `standard-30j`, `rapide-15j`,
|
||||
// `patient-60j`, `ferme-7j`. Leurs noms d'affichage utilisent les mots
|
||||
// "Standard", "Rapide", "Patient", "Ferme".
|
||||
await expect(page.getByText(/standard/i).first()).toBeVisible()
|
||||
await expect(page.getByText(/rapide/i).first()).toBeVisible()
|
||||
await expect(page.getByText(/patient/i).first()).toBeVisible()
|
||||
await expect(page.getByText(/ferme/i).first()).toBeVisible()
|
||||
|
||||
// La carte "+ Créer un plan" est aussi visible
|
||||
await expect(page.getByRole('link', { name: /créer un plan/i })).toBeVisible()
|
||||
})
|
||||
|
||||
test('clic "Créer un plan" → arrive sur le wizard', async ({ page }) => {
|
||||
await signupAndOnboard(page, 'pl-wizard')
|
||||
await page.goto('/plans')
|
||||
await page.getByRole('link', { name: /créer un plan/i }).click()
|
||||
await expect(page).toHaveURL(/\/plans\/nouveau/, { timeout: 5_000 })
|
||||
})
|
||||
|
||||
test('clic "Modifier" sur un plan → page détail du plan', async ({ page }) => {
|
||||
await signupAndOnboard(page, 'pl-detail')
|
||||
await page.goto('/plans')
|
||||
// Chaque PlanCard a un lien "Modifier" → /plans/$slug. On clique sur
|
||||
// le premier (qui correspondra à un des 4 plans pré-fournis).
|
||||
await page.getByRole('link', { name: /^modifier/i }).first().click()
|
||||
await expect(page).toHaveURL(/\/plans\/(standard|rapide|patient|ferme)/, {
|
||||
timeout: 5_000,
|
||||
})
|
||||
})
|
||||
})
|
||||
Loading…
x
Reference in New Issue
Block a user