AudiOhm/backend/DIAGNOSTIC_REPORT.md

RAPPORT DE DIAGNOSTIC COMPLET - AudiOhm

Date: 2026-01-19 20:30 Version: 2.0 Statut: 🔴 BLOQUANT - Plusieurs bugs critiques identifiés

---

📋 RÉSUMÉ EXÉCUTIF

AudiOhm souffre de plusieurs bugs critiques qui empêchent le bon fonctionnement des fonctionnalités principales:

• ✅ Dropdown z-index - CORRIGÉ (non confirmé)
• ✅ Liked tracks endpoint - CORRIGÉ
• ✅ Auto-play queue race condition - CORRIGÉ
• 🔴 AJOUT À LA PLAYLIST - BUG CRITIQUE
• 🔴 CONVERSION TRACKID - BUG CRITIQUE

---

🐛 BUGS CRITIQUES IDENTIFIÉS

1. BUG CRITIQUE: Conversion trackId (youtube_id vs UUID)

Localisation: /opt/audiOhm/backend/app/static/js/app.js Fonctions affectées:

• addTrackToPlaylist() (ligne 3248)
• toggleLikeTrack() (ligne 1591)
• Probablement d'autres fonctions utilisant trackId

Problème:

// Dans renderTracks() - ligne 2249-2255
<div data-id="${track.id}"              // ← C'est l'UUID de la BDD
     data-youtube-id="${track.youtube_id || ''}"  // ← C'est l'ID YouTube
     onclick="playTrack('${track.id}', ${isYoutubeTrack})">

// Dans addTrackToPlaylist() - ligne 3264-3266
body: JSON.stringify({
    track_ids: [trackId]  // ← Problème: trackId peut être youtube_id (string) au lieu de UUID
})

Détail du problème:

• Lors de la recherche YouTube, track.id contient l'UUID de la base de données
• MAIS pour les pistes YouTube qui ne sont pas encore dans la BDD, track.id pourrait être le youtube_id
• L'API backend /api/v1/playlists/{id}/tracks attend un UUID valide
• Le schéma AddTrackRequest valide: track_ids: List[UUID]
• Si on envoie un string youtube_id, Pydantic génère une erreur 422

Preuve:

# Dans les logs du backend:
"POST /api/v1/playlists/6244fc0b-dce5-4626-a4ab-5bbb737a82c0/tracks HTTP/1.1" 422 Unprocessable Content

2. BUG CRITIQUE: addTrackToPlaylist utilise le mauvais ID

Localisation: /opt/audiOhm/backend/app/static/js/app.js ligne 3265

Problème: La fonction addTrackToPlaylist(trackId, playlistId, playlistName) reçoit un trackId qui est passé depuis renderTracks(). Dans renderTracks(), le trackId passé est track.id (ligne 2255), qui peut être:

1. Un UUID de base de données (correct)
2. Un youtube_id pour les pistes pas encore en BDD (INCORRECT pour l'API playlist)

Solution requise: Il faut s'assurer que le trackId passé à l'API est toujours un UUID valide. Pour les pistes YouTube pas encore dans la BDD, il faut:

1. Soit les créer d'abord dans la BDD via un endpoint
2. Soit modifier l'API pour accepter les youtube_id
3. Soit empêcher l'ajout à la playlist tant que la piste n'est pas dans la BDD

3. BUG: playNext/playPrevious non implémentés dans app-optimized.js

Localisation: /opt/audiOhm/backend/app/static/js/app-optimized.js lignes 401-409

Problème:

function playPrevious() {
    // Implement previous track logic
    showToast('Non disponible pour le moment', 'error');  // ← PAS IMPLÉMENTÉ!
}

function playNext() {
    // Implement next track logic
    showToast('Non disponible pour le moment', 'error');  // ← PAS IMPLÉMENTÉ!
}

Impact:

• Le fichier app-optimized.js semble être une version minifiée/optimisée
• MAIS le fichier HTML utilise app.js (ligne 780 de index.html)
• Donc ce bug n'est PAS actif actuellement, mais c'est une bombe à retardement

Recommandation:

• Soit supprimer app-optimized.js s'il n'est pas utilisé
• Soit le mettre à jour avec les bonnes implémentations de app.js

---

✅ FONCTIONNALITÉS VÉRIFIÉES

Backend API

• ✅ Serveur uvicorn tourne sur le port 8000
• ✅ Documentation Swagger disponible: http://localhost:8000/api/docs
• ✅ Endpoint /api/v1/library/liked-tracks fonctionne
• ✅ Endpoint /api/v1/library/liked-tracks/{track_id} (POST/DELETE) fonctionne
• ✅ Endpoint /api/v1/playlists fonctionne
• ✅ Endpoint /api/v1/playlists/{id}/tracks fonctionne mais attend des UUIDs valides

Frontend JavaScript

• ✅ playNext() implémenté dans app.js (ligne 932)
• ✅ playPrevious() implémenté dans app.js (ligne 844)
• ✅ toggleLikeTrack() implémenté (ligne 1591)
• ✅ loadLikedTracks() utilise le bon endpoint /api/v1/library/liked-tracks (ligne 1435)
• ✅ Gestion de la queue implémentée
• ✅ Auto-play avec handleTrackEnd() (ligne 1133)

---

🔧 CORRECTIONS À APPORTER

Correction 1: S'assurer que les trackId sont des UUID valides

Fichier: /opt/audiOhm/backend/app/static/js/app.js

Option A: Modifier addTrackToPlaylist pour créer la piste d'abord:

window.addTrackToPlaylist = async function(trackId, playlistId, playlistName) {
    console.log('[addTrackToPlaylist] Track ID:', trackId, 'Playlist ID:', playlistId);

    try {
        const token = localStorage.getItem('token');

        // Vérifier si c'est un UUID valide
        const uuidRegex = /^[0-9a-f]{8}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{4}-[0-9a-f]{12}$/i;
        let actualTrackId = trackId;

        // Si ce n'est pas un UUID, c'est probablement un youtube_id
        // Il faut créer la piste dans la BDD d'abord ou trouver son UUID
        if (!uuidRegex.test(trackId)) {
            console.log('[addTrackToPlaylist] Track ID is not a UUID, searching for track...');
            // TODO: Implémenter la recherche ou création de la piste
            showToast('Cette piste doit être jouée avant d\'être ajoutée à une playlist', 'warning');
            return;
        }

        const response = await fetch(`/api/v1/playlists/${playlistId}/tracks`, {
            method: 'POST',
            headers: {
                'Content-Type': 'application/json',
                'Authorization': `Bearer ${token}`
            },
            body: JSON.stringify({
                track_ids: [actualTrackId]
            })
        });

        // ... reste du code
    } catch (error) {
        console.error('[addTrackToPlaylist] Exception:', error);
        showToast('Erreur de connexion', 'error');
    }
};

Option B: Modifier le backend pour accepter les youtube_id:

# Dans app/api/v1/playlists.py
@router.post("/{playlist_id}/tracks", response_model=PlaylistResponse)
async def add_tracks(
    playlist_id: str,
    track_data: AddTrackRequest,
    current_user: CurrentUser,
    db: DBSession,
):
    # ... code existant qui accepte déjà les UUIDs

Correction 2: Mettre à jour ou supprimer app-optimized.js

Fichier: /opt/audiOhm/backend/app/static/js/app-optimized.js

Soit:

1. Copier les implémentations correctes de app.js vers app-optimized.js
2. Ou supprimer app-optimized.js s'il n'est pas utilisé

Correction 3: Améliorer la gestion des erreurs

Ajouter des messages d'erreur plus clairs pour les utilisateurs quand:

• Une piste YouTube doit être jouée avant d'être ajoutée à une playlist
• Un UUID invalide est détecté

---

📊 TESTS À EFFECTUER

Tests Backend

# 1. Test de l'endpoint add track avec UUID valide
curl -X POST http://localhost:8000/api/v1/playlists/{playlist_id}/tracks \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer {token}" \
  -d '{"track_ids": ["4b7e394f-2c28-4c5a-8e1e-06be72b4bd37"]}'

# 2. Test de l'endpoint avec youtube_id (doit échouer actuellement)
curl -X POST http://localhost:8000/api/v1/playlists/{playlist_id}/tracks \
  -H "Content-Type: application/json" \
  -H "Authorization: Bearer {token}" \
  -d '{"track_ids": ["dQw4w9WgXcQ"]}'

Tests Frontend

1. ✅ Se connecter à l'application
2. ✅ Rechercher une piste YouTube
3. ❌ Cliquer sur "Ajouter à la playlist" → DOIT ÉCHOUER
4. ✅ Jouer une piste
5. ✅ Vérifier que la piste s'ajoute à la queue
6. ✅ Vérifier que le bouton Next fonctionne
7. ✅ Vérifier que l'auto-play fonctionne à la fin du morceau
8. ✅ Vérifier le chargement des liked tracks

---

🎯 PRIORITÉS DE CORRECTION

🔴 URGENT - Bloquant

1. Corriger la conversion trackId pour l'ajout à la playlist
2. Tester manuellement la correction

🟡 MOYEN - Important

3. Mettre à jour app-optimized.js ou le supprimer
4. Améliorer les messages d'erreur

🟢 FAIBLE - Amélioration

5. Ajouter des tests automatisés
6. Améliorer la documentation

---

📝 NOTES

• Le backend est fonctionnel et bien structuré
• L'API respecte les standards REST
• Le schéma Pydantic est correct (attend des UUIDs)
• Le problème principal est dans le frontend qui mélange youtube_id et UUID

Conclusion: Le système est bien conçu mais il y a une incohérence entre les IDs utilisés dans le frontend (youtube_id) et ce que l'API backend attend (UUID de base de données).