Files
serv_benchmark/TEST_FRONTEND_RESTRUCTURE.md
2025-12-14 10:40:54 +01:00

8.0 KiB

Guide de Test - Frontend Restructuré

Date : 14 décembre 2025 Version : Frontend 2.0.0

🚀 Accès à l'Interface

L'interface restructurée est maintenant accessible :

http://localhost:8087/device_detail.html?id=1

Note : Remplacez id=1 par l'ID du device que vous souhaitez consulter.

Checklist de Vérification

1. Header du Device

  • Le hostname s'affiche correctement
  • Le score global apparaît en haut à droite (badge coloré)
  • Les métadonnées (localisation, owner, asset_tag) s'affichent
  • La date du dernier benchmark est visible

2. Section Carte Mère (Motherboard)

  • Fabricant affiché (ex: ASUSTeK, Gigabyte, MSI)
  • Modèle de la carte mère
  • Version du BIOS
  • Date du BIOS
  • Nombre de slots RAM (utilisés/total)

3. Section 🔲 Processeur (CPU)

  • Fabricant (AMD/Intel)
  • Modèle complet du CPU
  • Microarchitecture (si disponible)
  • Nombre de cores et threads
  • Fréquences (base et max) en GHz
  • TDP (si disponible)
  • Cache L1, L2, L3 en KB
  • Instructions supportées : Liste des flags CPU (limité à 50 + compteur)

Exemple attendu :

Intel(R) Core(TM) i7-9700K
Cores: 8 | Threads: 8
Fréquence max: 4.9 GHz
Cache L3: 12288 KB

Instructions supportées:
[sse] [sse2] [sse3] [ssse3] [sse4_1] [sse4_2] [avx] [avx2] ... +150 autres

4. Section 💾 Mémoire (RAM)

  • Capacité totale en GB
  • Mémoire utilisée (GB et %)
  • Mémoire libre
  • Mémoire partagée
  • Slots utilisés/total
  • Support ECC (Oui/Non)

Configuration des barrettes (si disponible)

  • Détail par slot :
    • Nom du slot (ex: DIMM_A1)
    • Capacité (ex: 16 GB)
    • Type (ex: DDR4)
    • Vitesse (ex: 3200 MHz)
    • Fabricant
    • Part Number (si disponible)

Exemple attendu :

Slot DIMM_A1
  16 GB • DDR4 • 3200 MHz
  Fabricant: Corsair
  Part Number: CMK16GX4M1D3200C16

5. Section 💿 Stockage (Disques)

  • Vue par disque (sda, sdb, nvme0n1, etc.)
  • Icône différente pour SSD (💾) et HDD (💿)
  • Nom du device (ex: /dev/sda)
  • Modèle du disque
  • Capacité en GB
  • Type (SSD/HDD)
  • Interface (sata/nvme/usb)
  • Badge de santé SMART (vert = PASSED, rouge = FAILED)
  • Température (si disponible)

Exemple attendu :

💾 /dev/sda
Samsung SSD 870 EVO 500GB
[PASSED] ✓

Capacité: 500 GB
Type: SSD
Interface: sata
Température: 35°C

6. Section 🎮 Carte Graphique (GPU)

  • Fabricant (NVIDIA/AMD/Intel)
  • Modèle complet
  • Version du driver
  • Mémoire dédiée (VRAM) en MB
  • Mémoire partagée (si applicable)
  • APIs supportées (OpenGL, Vulkan, etc.) en badges verts

Si aucun GPU :

  • Message "Aucun GPU détecté" s'affiche

7. Section 🌐 Réseau (Network)

  • Vue par interface (eth0, enp0s3, wlan0, etc.)
  • Icône selon le type (🔌 ethernet, 📡 wifi)
  • Nom de l'interface
  • Type (ethernet/wifi)
  • Adresse IP
  • Adresse MAC (en code)
  • Vitesse de liaison en Mbps
  • Driver (si disponible)
  • Badge Wake-on-LAN (WoL ✓ vert ou WoL ✗ gris)

Exemple attendu :

🔌 enp0s3 [WoL ✓]
ethernet

Adresse IP: 10.0.1.100
MAC: 08:00:27:12:34:56
Vitesse: 1000 Mbps
Driver: e1000

8. Section 🐧 Système d'exploitation

  • Nom de l'OS (ex: debian, ubuntu)
  • Version (ex: 11, 22.04)
  • Version du kernel (ex: 6.1.0-13-amd64)
  • Architecture (ex: x86_64, aarch64)
  • Type de virtualisation (none, kvm, docker, etc.)

9. Section 📊 Résultats Benchmarks

  • Date du dernier benchmark
  • Version du script de benchmark
  • Score Global (badge coloré)
  • Score CPU
  • Score Mémoire
  • Score Disque
  • Score Réseau
  • Score GPU
  • Bouton "Voir les détails complets (JSON)"

Codes couleur des badges :

  • 🟢 Vert : Score > 70
  • 🟡 Jaune : Score 40-70
  • 🔴 Rouge : Score < 40
  • Gris : N/A

10. Onglets en bas de page

  • Historique Benchmarks : Tableau avec historique
  • Documents : Upload et liste des documents
  • Liens : Ajout et liste des liens constructeurs

🧪 Tests de Robustesse

Test 1 : Device sans GPU

Résultat attendu : "Aucun GPU détecté" dans la section GPU

Test 2 : Device sans données SMART

Résultat attendu : Disques affichés sans badge de santé ni température

Test 3 : RAM sans layout détaillé

Résultat attendu : Informations générales affichées, pas de section "Configuration des barrettes"

Test 4 : CPU avec beaucoup de flags (>100)

Résultat attendu : 50 premiers flags affichés + badge "+XX autres..."

Test 5 : Interface réseau sans Wake-on-LAN

Résultat attendu : Pas de badge WoL affiché

🎨 Responsive Design

Test sur Desktop

  • Grilles s'affichent sur 3-4 colonnes
  • Sections bien espacées
  • Badges lisibles

Test sur Tablette (simuler avec DevTools)

  • Grilles passent à 2 colonnes
  • Informations restent lisibles
  • Scroll vertical fluide

Test sur Mobile (simuler avec DevTools)

  • Grilles passent à 1 colonne
  • Texte reste lisible
  • Boutons cliquables facilement

🔧 Outils de Test

Chrome DevTools

F12 → Console

Vérifier qu'il n'y a pas d'erreurs JavaScript

Network Tab

F12 → Network → Rafraîchir

Vérifier que :

  • device_detail.html charge (200)
  • device_detail.js charge (200)
  • API /api/devices/{id} retourne les données (200)

Console Logs

Ouvrir la console et chercher :

  • ⚠️ Warnings : Failed to parse... (normal si données manquantes)
  • Errors : Ne devrait pas y en avoir

📊 Cas de Test par Type de Machine

Machine Serveur (Dell PowerEdge, HP ProLiant)

  • Carte mère : Modèle serveur détecté
  • CPU : Processeur Xeon avec beaucoup de cores
  • RAM : ECC activé, plusieurs barrettes détaillées
  • Disques : Plusieurs disques avec SMART
  • GPU : Souvent "Aucun GPU détecté" (serveur headless)

Machine Desktop

  • CPU : Intel Core i7/i9 ou AMD Ryzen
  • RAM : 2-4 barrettes DDR4
  • GPU : NVIDIA/AMD détecté avec VRAM
  • Stockage : SSD + HDD

Machine Virtuelle (VM)

  • Virtualisation : kvm, vmware, ou virtualbox
  • CPU : Moins de cores
  • GPU : virtio ou "Aucun GPU détecté"
  • Stockage : virtio ou scsi

Raspberry Pi / SBC

  • Architecture : aarch64 ou armv7l
  • CPU : ARM Cortex
  • RAM : Pas de layout DIMM (soudée)
  • GPU : VideoCore ou Mali

🐛 Debugging

Si une section ne s'affiche pas

  1. Ouvrir la console (F12)
  2. Chercher les erreurs Failed to parse...
  3. Vérifier que les données existent dans l'API :
    curl http://localhost:8007/api/devices/1 | jq .
    

Si les disques ne s'affichent pas

# Vérifier storage_devices_json
curl http://localhost:8007/api/devices/1 | jq '.last_hardware_snapshot.storage_devices_json'

Si les barrettes RAM ne s'affichent pas

# Vérifier ram_layout_json
curl http://localhost:8007/api/devices/1 | jq '.last_hardware_snapshot.ram_layout_json'

Si les flags CPU ne s'affichent pas

# Vérifier cpu_flags
curl http://localhost:8007/api/devices/1 | jq '.last_hardware_snapshot.cpu_flags'

Validation Finale

Une fois tous les tests passés :

  • Toutes les sections s'affichent correctement
  • Aucune erreur dans la console
  • Responsive fonctionne sur mobile
  • Les données sont séparées logiquement
  • L'interface est claire et lisible

🚀 Prochaines Étapes

Si tout fonctionne :

  1. Tester sur plusieurs devices différents
  2. Vérifier les performances (temps de chargement)
  3. Valider l'UX avec un utilisateur final
  4. Documenter les améliorations futures

📝 Rapport de Bug

En cas de bug, noter :

  • URL de la page (avec l'ID du device)
  • Section concernée
  • Erreur dans la console (copier le message complet)
  • Screenshot si possible

Frontend Restructuré : v2.0.0 Date de test : _______________ Testé par : _______________ Résultat : Validé À corriger