Générer des PDF prêts à l’impression à partir de pages dynamiques

Pourquoi les pages dynamiques cassent les pipelines PDF naïfs

Les applications monopage ne livrent pas du HTML figé. Elles livrent une coque, hydratent le JavaScript, récupèrent du JSON, puis seulement peignent prix, graphiques et clauses. Un job PDF déclenché au moment de DOMContentLoaded archivera volontiers un spinner vide — capture fidèle du DOM à cette milliseconde, mais inutile pour la finance ou la relation client.

Les PDF prêts à l’impression exigent la même rigueur que les captures de production : attentes explicites, étapes d’interaction et souvent du CSS d’impression. Le PDF amplifie les défauts de mise en page par la pagination — une capture légèrement anticipée peut couper une ligne de totaux de façon peu professionnelle.

Piloter la page avant d’imprimer

Enchaînez des actions d’automatisation pour atteindre l’état à archiver :

• Accepter les bannières cookies ou fermer les modales qui masquent le contenu.
• Vous connecter avec identifiants stockés ou en-têtes personnalisés lorsque le rapport est authentifié.
• Déplier les accordéons, ouvrir le bon onglet ou faire défiler les zones chargées paresseusement.
• Attendre une fenêtre réseau calme ou un sélecteur connu avant d’appeler l’impression.

ScreenshotCenter modélise ces étapes dans le même corps de requête que pour les captures — voir interactions sur la page pour le vocabulaire complet des clics, saisies, défilements et délais.

CSS d’impression et stratégie de viewport

Les navigateurs appliquent les règles @media print lors de la génération PDF — à la fois opportunité et piège. Si votre site masque la navigation à l’impression mais masque aussi par erreur le tableau de facturation, l’API reproduira fidèlement l’erreur.

Bonnes pratiques :

• Maintenir une feuille de style d’impression dédiée ou des classes print pour les documents destinés au PDF.
• Régler la largeur de viewport proche de la colonne d’impression visée pour que les breakpoints réactifs choisissent le même palier que sur bureau.
• Tester les sauts de page sur les longs tableaux ; utiliser break-inside: avoid sur les lignes de total lorsque c’est supporté.

Stratégies d’attente qui tiennent sur des sites réels

Stratégie	Idéal pour	Risque
Délai fixe	Pages marketing simples	Trop court sur CDN lent ; trop long sinon
Attente sur sélecteur	SPA avec marqueur de succès connu	Casse si le sélecteur change
Idle réseau	Tableaux de bord très dynamiques	Risque de blocage sur analytics permanents
Hybride (plafond + sélecteur)	Automatisation de production	Nécessite un réglage par template

Combinez attentes et automatisation plutôt qu’un unique minuteur magique. Pour les parcours complexes — assistants multi-étapes, contenus hybrides SSR/CSR — documentez la séquence avec le template pour que les opérations puissent rejouer les captures des mois plus tard.

Exemple : interagir, puis PDF

// JSON illustratif — les noms de champs suivent votre schéma OpenAPI
{
  "url": "https://app.example.com/reports/quarterly",
  "steps": [
    { "action": "wait", "duration_ms": 500 },
    { "action": "click", "selector": "#tab-financials" },
    { "action": "wait_for_selector", "selector": "table.qb-totals", "timeout_ms": 15000 }
  ],
  "output": "pdf",
  "format": "A4",
  "print_background": true
}

Synthèse

La génération PDF sur pages dynamiques est un cas particulier d’automatisation navigateur : vous démontrez qu’une instance Chrome headless a atteint le même état qu’un humain avant impression. Centraliser cela dans une infrastructure orientée automatisation garde la logique de capture cohérente que la sortie soit PDF, PNG ou vidéo. Partez du parcours utilisateur, encodez-le en étapes, puis attachez les paramètres PDF — pas l’inverse.