Où Pratiquer l'Automatisation QA: Le Laboratoire BecomeQA

lab.becomeqa.com est une application d'entraînement conçue pour l'automatisation Playwright. Elle comprend un vrai flux de connexion, des tableaux de données dynamiques, des modales, un upload de fichiers et une API REST associée.

Pourquoi s'entraîner sur des sites au hasard ne fonctionne pas

L'approche évidente : ouvrir n'importe quel site et écrire des tests dessus. Ça marche jusqu'à ce que ça ne marche plus.

Les vrais sites changent sans prévenir. Le formulaire de connexion se voit ajouter un CAPTCHA. Les identifiants d'éléments changent. Une classe CSS sur laquelle vous comptiez est renommée lors d'un déploiement que vous n'avez jamais vu passer. Votre suite de tests casse de façon aléatoire, et déboguer prend plus de temps qu'écrire les tests.

Les sites conçus pour la pratique fonctionnent différemment. Leurs sélecteurs sont stables, leur état est prévisible, et leurs fonctionnalités sont spécifiquement pensées pour couvrir les scénarios d'automatisation. Vous pouvez réinitialiser les données, créer des utilisateurs, tout casser et expérimenter sans conséquences.

Ce que doit avoir un bon environnement de pratique

Un environnement utile comprend :

• Authentification : flux de connexion/déconnexion, routes protégées, gestion des identifiants invalides
• Tableaux de données : tri, filtrage, pagination, sélection de lignes
• Formulaires : erreurs de validation, champs requis, listes déroulantes, sélecteurs de dates
• Modales : comportement d'ouverture/fermeture, dialogues de confirmation, soumission de formulaire dans une modale
• Upload de fichiers : glisser-déposer, validation du type de fichier, indicateur de progression
• API : même backend accessible directement pour les tests API en parallèle des tests UI
• Sélecteurs stables : attributs data-testid ou identifiants fiables qui ne changeront pas

La couverture des scénarios compte plus que la finition visuelle. Un site construit pour la pratique aura tout ça ; un site de production pris au hasard en aura peut-être deux.

L'environnement lab.becomeqa.com

Nous avons construit un lab dédié pour les exercices de ce cours. Il est disponible à lab.becomeqa.com et c'est gratuit.

Ce qu'il contient :

• Flux de connexion valide (e-mail + mot de passe)
• Identifiants invalides avec message d'erreur
• Routes protégées qui redirigent vers la connexion si non authentifié
• Déconnexion

• Ajouter, modifier, supprimer des articles
• Colonne statut : Planned, In Progress, Completed
• Filtrer par statut
• Trier par colonnes
• Pagination

• L'ajout d'un article ouvre une modale avec un formulaire
• La modification d'un article : même modale, pré-remplie
• Modale de confirmation de suppression
• Fermeture par clic sur X, clic en dehors, touche Échap

Identifiants de test par défaut

URL :      https://lab.becomeqa.com
Email :    admin@becomeqa.com
Password : admin123

Ce sont des identifiants partagés pour la pratique. Ne stockez pas de vraies données. Le lab est réinitialisé périodiquement.

Un test simple pour confirmer la configuration

Avant d'aller plus loin, vérifiez que votre environnement se connecte correctement au lab :

import { test, expect } from '@playwright/test';

test('le lab est accessible et la connexion fonctionne', async ({ page }) => {
    await page.goto('https://lab.becomeqa.com');
    await page.getByLabel('Email').fill('admin@becomeqa.com');
    await page.getByLabel('Password').fill('admin123');
    await page.getByRole('button', { name: 'Sign in' }).click();
    
    await expect(page.getByText('Travel Items')).toBeVisible();
});

Si ce test passe, vous êtes prêt.

Autres sites de pratique à connaître

Le lab couvre les scénarios principaux de ce cours. Pour varier, ces sites valent également le détour :

Un classique. Couvre : listes déroulantes, cases à cocher, alertes JavaScript, iframes, glisser-déposer, upload de fichiers, défilement infini. Utile pour pratiquer des techniques spécifiques, mais sans structure d'application réaliste.

Un faux site e-commerce de Sauce Labs. Connexion, catalogue produits, panier, commande. Utile pour pratiquer un flux d'achat complet. Propose des versions cassées de l'application pour s'entraîner au débogage (locked_out_user, error_user).

Une API REST publique qui retourne de fausses données utilisateur. Pas d'interface graphique, API uniquement. Utile pour pratiquer les tests API sans configurer son propre backend.

Couvre les formulaires, widgets, interactions et alertes. Orienté composants UI plutôt que flux métier. Utile pour pratiquer des types d'éléments spécifiques.

Quoi pratiquer et dans quel ordre

Suivez l'ordre de ce cours. Chaque module introduit une nouvelle technique ; les exercices du lab l'appliquent sur une vraie fonctionnalité.

La progression :

1. Écrire un test de connexion (navigation de base, remplissage de formulaire, assertion)

2. Ajouter des assertions sur les lignes du tableau (trouver des éléments dans une liste)

3. Ouvrir et remplir un formulaire dans une modale

4. Tester la validation de formulaire (messages d'erreur sur saisie invalide)

5. Upload de fichiers

6. Interception de requêtes API (vérifier les appels réseau depuis les actions UI)

7. Flux complet (connexion, ajout d'article, vérification dans le tableau)

À la fin du module 5 (POM enterprise), vous aurez une suite de tests complète couvrant l'ensemble du lab. Cette suite est prête pour un portfolio. Elle démontre la même structure utilisée dans les projets d'automatisation en production.