Kevin L'Hereec a7788e593e
Build & Deploy / build (push) Failing after 4s
Build & Deploy / docker (push) Skipped
feat: add Materiel.net, Cdiscount and PCComponentes via headless browser
Google/Bing/DuckDuckGo/Qwant were tested as a way to find prices on the
3 remaining requested merchants and all four block scraping immediately
(visible captcha or JS-only anti-bot challenge on the very first
automated request) - not usable as an intermediary. Instead, a headless
browser was used to scrape these 3 merchants directly, since their
blocking (JS-only search, empty body, 403) turned out to be bypassable
with real browser rendering rather than needing to get past a captcha:

- Materiel.net: search is entirely client-side (Stimulus/Turbo), a plain
  GET on /recherche/?query=... always returns the empty "no results"
  template. Fixed by actually filling the search input and clicking
  submit in a real page.
- Cdiscount: returns a fully empty response body to plain HTTP fetches
  (no error, just nothing) but renders fine in a real browser.
- PCComponentes: blocks plain HTTP requests with a 403, but a headless
  browser with a normal user agent goes through.

Implementation:
- New playwright-core dependency, pointed at a system-installed
  Chromium binary via CHROMIUM_EXECUTABLE_PATH (set to /usr/bin/chromium
  here) instead of downloading Playwright's own ~300MB browser
- New headless_browser_service.ts: lazily launches a single shared
  Chromium instance reused across lookups (avoids paying browser launch
  cost per request), with a withPage() helper that always closes its
  browser context afterwards. A new start/browser.ts preload registers
  an app.terminating() hook so the browser process is closed on shutdown
  instead of leaking a child process.
- fetchMaterielNetPrice/fetchCdiscountPrice/fetchPcComponentesPrice
  follow the same model-token matching strategy as the existing
  cheerio-based merchants (LDLC/Grosbill/TopAchat): search on a short
  brand+series query, then pick the result whose label/attribute
  contains the extracted model number, to avoid misreporting an
  unrelated product's price
- PCComponentes exposes clean data-product-price/data-product-category
  attributes directly on result links, so full pre-built "Sobremesa" PCs
  that happen to mention the searched CPU are excluded rather than
  reported as its price
- Fixed two bugs found while testing with a Ryzen 5 9600X (a case with
  multiple search results, unlike the Ryzen 3 3200G single-redirect case
  used earlier):
  - Materiel.net: a search results list page also has .o-product__price
    elements (one per card), so checking for their mere presence isn't
    enough to detect the "redirected to a single product" case; now
    disambiguated by URL pattern (/produit/ vs /recherche/)
  - New parseFlattenedFragmentedPriceText(): Playwright's innerText()
    flattens "<whole>€<sup>cents</sup>" prices to plain strings like
    "284€95" or "2 049€95", which the existing parser misread as
    28495/204995. Cheerio-based scrapers (LDLC/Grosbill) already handled
    this correctly via DOM structure (parseFragmentedPrice); this adds
    the equivalent for already-flattened text.
- findCheapestOffers() now queries all 7 merchants in parallel
- Extended the MerchantOffer type/favicon domain map on the frontend for
  the 3 new merchants

All 30 existing tests still pass unchanged (they don't exercise live
network scraping, only the surrounding auth/validation/caching logic).
2026-07-23 15:25:12 +02:00
2026-06-28 13:26:22 +02:00
2026-06-29 22:48:59 +02:00
fix
2026-06-28 11:37:12 +02:00
2026-06-28 12:06:48 +02:00
2026-06-28 12:06:48 +02:00
2026-06-28 13:36:44 +02:00
2026-06-28 12:06:48 +02:00
2026-06-29 22:48:59 +02:00
fix
2026-06-28 11:37:12 +02:00

PC Builder

Une application web moderne pour construire et gérer des configurations PC personnalisées. Construite avec AdonisJS et Vue.js (Inertia).

🎯 Fonctionnalités

  • Gestion des composants : Cataloguer et gérer les composants informatiques (CPU, GPU, RAM, etc.)
  • Construction de PC : Créer et configurer des ordinateurs personnalisés
  • Galerie de photos : Ajouter et gérer des images de vos configurations
  • Authentification utilisateur : Système d'inscription et de connexion sécurisé
  • Interface réactive : Interface utilisateur moderne avec Vue.js et Tailwind CSS

📋 Prérequis

  • Node.js >= 18.0.0
  • npm ou yarn
  • PostgreSQL (ou autre base de données supportée)
  • Docker (optionnel, pour l'environnement de développement)

🚀 Installation

1. Cloner le repository

git clone http://192.168.1.39:3000/Stude12/pc_builder
cd pc_builder

2. Installer les dépendances

npm install

3. Configuration de l'environnement

Copier le fichier .env.example en .env et configurer vos variables :

cp .env.example .env

Éditer .env et configurer :

  • DB_CONNECTION : Type de base de données
  • DB_HOST, DB_PORT, DB_USER, DB_PASSWORD, DB_DATABASE : Connexion à la base
  • APP_KEY : Clé de chiffrement (générer avec node ace generate:key)

4. Générer la clé d'application

node ace generate:key

5. Exécuter les migrations

node ace migration:run

6. Démarrer le serveur de développement

npm run dev

L'application sera disponible à http://localhost:3333

🛠️ Scripts disponibles

# Développement avec hot reload
npm run dev

# Compilation pour la production
npm run build

# Serveur de production
npm run start

# Linter (ESLint)
npm run lint

# Tests
npm run test

# Vérifier les types TypeScript
npm run typecheck

📁 Structure du projet

pc_builder/
├── app/                          # Code métier
│   ├── controllers/             # Contrôleurs des routes
│   ├── models/                  # Modèles Lucid (ORM)
│   ├── middleware/              # Middlewares
│   ├── validators/              # Validateurs
│   ├── services/                # Logique métier
│   ├── exceptions/              # Exceptions personnalisées
│   └── transformers/            # Transformeurs de données
├── inertia/                     # Code frontend Vue.js
│   ├── pages/                   # Pages Vue.js
│   ├── components/              # Composants Vue.js réutilisables
│   ├── layouts/                 # Layouts de pages
│   ├── composables/             # Composables Vue.js
│   ├── assets/                  # Images, icônes, CSS
│   └── directives/              # Directives Vue.js personnalisées
├── config/                      # Fichiers de configuration
├── database/                    # Migrations et schema
│   ├── migrations/              # Fichiers de migration
│   └── schema.ts                # Schéma de la base de données
├── start/                       # Points d'entrée de l'application
├── public/                      # Fichiers publics statiques
├── resources/                   # Templates Edge
├── tests/                       # Tests unitaires et fonctionnels
└── node_modules/                # Dépendances (ignorées par git)

🗄️ Modèles de données

User

  • Utilisateurs de l'application
  • Authentification et autorisation

Computer

  • Configurations PC
  • Associations avec les composants
  • Galerie de photos

Component

  • Composants informatiques
  • Classés par type (CPU, GPU, RAM, etc.)

ComputerState

  • État et historique des configurations

ComputerPicture

  • Images des configurations PC

🔐 Sécurité

  • Validation CSRF sur tous les formulaires
  • Hachage sécurisé des mots de passe
  • Middleware d'authentification
  • Protection CORS configurée
  • Échappement des données XSS

🧪 Tests

# Exécuter les tests
npm run test

# Tests avec couverture
npm run test:coverage

📦 Déploiement

Avec Docker

# Construire l'image
docker-compose build

# Lancer les services
docker-compose up -d

Manuel

  1. Compiler le projet : npm run build
  2. Installer les dépendances de production : npm ci --omit=dev
  3. Démarrer l'application : npm start

🤝 Contribution

Les contributions sont bienvenues ! Voici le workflow :

  1. Créer une nouvelle branche : git checkout -b feature/ma-feature
  2. Faire vos modifications
  3. Commiter vos changements : git commit -m "Add: description"
  4. Pousser vers la branche : git push origin feature/ma-feature
  5. Ouvrir une Pull Request

📝 Convention de commits

  • feat: Nouvelle fonctionnalité
  • fix: Correction de bug
  • docs: Documentation
  • style: Formatage, sans changement logique
  • refactor: Refactorisation de code
  • test: Ajout ou modification de tests
  • chore: Maintenance, dépendances

📄 Licence

Ce projet est sous licence MIT.

📧 Support

Pour toute question ou problème, veuillez ouvrir une issue sur le repository.


Repository : http://192.168.1.39:3000/Stude12/pc_builder
Branche principale : main

S
Description
No description provided
Readme
754 KiB
0 Stars 1 Watchers 0 Forks
Languages
TypeScript 65.8%
Vue 32.8%
JavaScript 0.4%
Shell 0.4%
Edge 0.3%
Other 0.3%