================================================================ QA MANUELLE - Redmine #20 "Preuves sociales / social-proof sur la landing page" ================================================================ Date : 2026-06-11 Branche : feat/redmine-20-social-proof PR : https://github.com/omdev-tech/GetYourJob/pull/231 (base dev) Worktree : .worktrees/redmine-20-social-proof Commit testé: a14122b feat(landing): add custom social-proof carousel section (Redmine #20) Statut entree: QA Verdict : PASS (tous les criteres d'acceptation OK) NB sur l'approche (decision de spec, voir spec_ref) : composant React custom stylé (Atomic Design) alimenté par une config (src/config/social-proof.ts) plutôt que le TrustBox officiel Trustpilot (style figé, ~0 avis en pre-launch). Critere "widget Trustpilot iframe" lu comme "section preuve sociale + lien Trustpilot" conformement a la decision de spec actee sur l'epic. ---------------------------------------------------------------- 1. FICHIERS DE LA FEATURE (diff vs origin/dev) ---------------------------------------------------------------- src/components/atoms/RatingStars.tsx src/components/atoms/__tests__/RatingStars.test.tsx src/components/molecules/TestimonialCard.tsx src/components/molecules/__tests__/TestimonialCard.test.tsx src/components/organisms/landing/LandingSocialProof.tsx src/components/organisms/landing/__tests__/LandingSocialProof.test.tsx src/components/organisms/landing/__tests__/socialProof.i18n.test.ts src/components/templates/LandingPage.tsx src/config/social-proof.ts src/infrastructure/i18n/translations/en.ts src/infrastructure/i18n/translations/fr.ts ---------------------------------------------------------------- 2. SUITES DE TESTS (vitest) - suites touchees ---------------------------------------------------------------- Commande: npx vitest run \ src/components/atoms/__tests__/RatingStars.test.tsx \ src/components/molecules/__tests__/TestimonialCard.test.tsx \ src/components/organisms/landing/__tests__/LandingSocialProof.test.tsx \ src/components/organisms/landing/__tests__/socialProof.i18n.test.ts Resultat: Test Files 4 passed (4) Tests 20 passed (20) (warnings React "act(...)" non bloquants sur les tests timer/click) ---------------------------------------------------------------- 3. TYPECHECK (tsc --noEmit) ---------------------------------------------------------------- Commande: npx tsc --noEmit Resultat: erreurs PRE-EXISTANTES repo-wide uniquement, AUCUNE sur les fichiers de la feature (companyPageData.ts, subscription-limits.ts, cron-geocode-jobs.ts, test-real-job-recommendations.ts, validateurs de routes API .next/types). Le grep cible (social-proof|SocialProof|RatingStars|TestimonialCard|config/social) ne remonte aucune erreur dans le code de la feature. (Le repo build avec next.config ignoreBuildErrors; erreurs tsc historiques.) ---------------------------------------------------------------- 4. BUILD DE PRODUCTION (npm run build) ---------------------------------------------------------------- Commande: npm run build Resultat: BUILD_EXIT=0 - "Compiled successfully in 16.1s" - Route racine "/" (landing) = ƒ (Dynamic, server-rendered on demand) -> OK - Aucune erreur liee a la feature. - Le LandingSocialProof est importe via next/dynamic({ssr:false}) + 'use client'; pas d'import Prisma cote client -> pas de fuite client/Prisma. ---------------------------------------------------------------- 5. SMOKE NAVIGATEUR (gstack browse, headless) ---------------------------------------------------------------- Serveur de dev: npm run dev -- -p 3010 (port dedie, GET / -> 200) Navigation: http://localhost:3010/ -> 200, wait --networkidle. Verifications DOM/CSS (selecteur [data-social-proof-carousel]): - Section presente et rendue cote client (dynamic ssr:false) -> FOUND - Heading : "Ils font deja confiance a GetYourJob" - Note moyenne : 4,9/5 - Nombre d'avis : "120 avis verifies" - Cartes desktop visibles: 3 (grille lg:grid-cols-3, centrale emphase) - Fleches prev/next : presentes (aria "Temoignage precedent/suivant") - Dots : 3 (aria "Aller au temoignage N") - Navigation manuelle : clic "suivant" -> dot actif change (1 -> 0) OK - Lien "Voir tous les avis": target=_blank, rel="noopener noreferrer", href=https://www.trustpilot.com/review/getyourjob.pro (nouvel onglet OK) - Couleur fond section : rgb(249,249,249) = #F9F9F9 (charte OK) - Couleur etoiles pleines: #00B67A (vert Trustpilot) (charte OK) - Couleur etoiles vides : #E5E5E5 (gris bordure) (charte OK) Responsive: - Desktop 1440px : grille 3 cartes visible, bloc mobile masque. - Mobile 390px : bloc single-card + swipe visible (lg:hidden), grille desktop masquee (desktopGridVisible=false). -> 1 carte + swipe conforme. Auto-defilement: - Intervalle 5000ms (AUTO_ADVANCE_MS), demarre a l'entree en viewport (IntersectionObserver), en pause au hover/focus/onglet cache/reduced-motion. Observe en pratique (le dot actif avait deja avance avant interaction). ---------------------------------------------------------------- 6. CONSOLE NAVIGATEUR ---------------------------------------------------------------- Erreurs console = PRE-EXISTANTES et SANS rapport avec la feature: - Badge ProductHunt (footer) bloque par CSP img-src (local). - Widget chat Tawk.to bloque par CORS (local). - Warnings next/image aspect-ratio sur logos du footer. Aucune erreur emise par la section preuves sociales. ---------------------------------------------------------------- 7. NON-REGRESSION LANDING ---------------------------------------------------------------- - Reste de la landing rendu normalement (hero, pricing, referral, CTA...). - Build prod complet OK -> pas de regression de compilation. - Section inseree entre les sections existantes et immediatement avant LandingCTA (CTA "Rejoignez le groupe fondateur"), apres LandingHowItWorks. ================================================================ CONCLUSION: PASS - tous les criteres d'acceptation smoke sont OK. (Secrets/tokens/passwords: aucun inclus; logs filtres.) ================================================================