ObsiViewer/docs/BOOKMARKS_FIXES.md

306 lines
7.0 KiB
Markdown

# Corrections Bookmarks - Tests Failed
## Tests échoués identifiés
D'après le fichier `BOOKMARKS_TEST_PLAN.md`, 3 tests ont échoué:
1. **Test 3**: Drag vers la racine (zone "Drop here to move to root") - FAIL
2. **Test 4**: Drag entre groupes - FAIL
3. **Test 5**: Détection de cycles - FAIL
---
## Corrections appliquées
### 1. Correction de la logique de moveNode
**Problème**: Lors du réordonnancement dans le même conteneur, l'index n'était pas ajusté correctement après la suppression du node.
**Solution**: Ajout d'une logique d'ajustement d'index dans `bookmarks.utils.ts`:
```typescript
// If moving within the same parent, adjust index
let adjustedIndex = newIndex;
if (oldParentCtime === newParentCtime && oldIndex < newIndex) {
// When removing from earlier position, indices shift down
adjustedIndex = newIndex - 1;
}
```
**Fichier modifié**: `src/core/bookmarks/bookmarks.utils.ts`
---
### 2. Ajout de logs de debug
**Problème**: Difficile de diagnostiquer les problèmes de drag & drop sans visibilité.
**Solution**: Ajout de logs console détaillés dans:
- `BookmarksPanelComponent.handleDrop()`
- `BookmarkItemComponent.onChildDrop()`
**Logs affichés**:
```javascript
{
itemCtime: number,
fromParent: number | null,
toParent: number | null,
newIndex: number,
sameContainer: boolean
}
```
**Fichiers modifiés**:
- `src/components/bookmarks-panel/bookmarks-panel.component.ts`
- `src/components/bookmark-item/bookmark-item.component.ts`
---
### 3. Correction du fichier JSON invalide
**Problème**: Le fichier `vault/.obsidian/bookmarks.json` contenait un item invalide:
```json
{
"type": "file",
"ctime": 1759253065812,
"path": "groupeC" // ❌ Pas d'extension
}
```
**Solution**: Ajout de l'extension `.md`:
```json
{
"type": "file",
"ctime": 1759253065812,
"path": "groupeC.md" // ✅ Extension ajoutée
}
```
**Fichier modifié**: `vault/.obsidian/bookmarks.json`
---
## Instructions de test
### Rebuild et relance
```bash
# 1. Rebuild l'application
npm run build
# 2. Relancer le serveur
node server/index.mjs
# 3. Ouvrir http://localhost:3000
# 4. Ouvrir DevTools (F12) pour voir les logs
```
### Tests à refaire
#### Test 3: Drag vers la racine
1. Créer un groupe "Test Group"
2. Ajouter un bookmark dans ce groupe
3. **Ouvrir la console DevTools**
4. Drag le bookmark vers la zone "Drop here to move to root"
5. **Observer les logs dans la console**:
```
Drop event: {
itemCtime: ...,
fromParent: <ctime du groupe>,
toParent: null,
newIndex: 0,
sameContainer: false
}
```
6. Vérifier que le bookmark est maintenant à la racine
**Résultat attendu**: ✅ Le bookmark se déplace à la racine
---
#### Test 4: Drag entre groupes
1. Créer 2 groupes: "Groupe A" et "Groupe B"
2. Ajouter un bookmark dans Groupe A
3. **Ouvrir la console DevTools**
4. Drag le bookmark de Groupe A vers Groupe B
5. **Observer les logs**:
```
Child drop event: {
itemCtime: ...,
fromParent: <ctime de A>,
toParent: <ctime de B>,
toParentTitle: "Groupe B",
newIndex: 0,
sameContainer: false
}
```
6. Vérifier que le bookmark est maintenant dans Groupe B
**Résultat attendu**: ✅ Le bookmark se déplace de A vers B
---
#### Test 5: Détection de cycles
1. Créer Groupe A
2. Créer Groupe B **dans** Groupe A
3. **Ouvrir la console DevTools**
4. Tenter de drag Groupe A dans Groupe B
5. **Observer le warning dans la console**:
```
Cannot move a parent into its own descendant
```
6. Vérifier que la structure reste inchangée
**Résultat attendu**: ✅ Le drop est bloqué avec un warning
---
## Diagnostics supplémentaires
### Si Test 3 échoue encore
**Vérifier**:
1. La zone "Drop here to move to root" a-t-elle l'attribut `cdkDropList` ?
2. L'ID de la drop list est-il bien `"root"` ?
3. Le handler `handleRootDrop()` est-il bien appelé ?
**Debug**:
```typescript
// Dans bookmarks-panel.component.ts
handleRootDrop(event: CdkDragDrop<BookmarkNode[]>): void {
console.log('ROOT DROP TRIGGERED'); // Ajoutez ce log
this.isDraggingOverRoot.set(false);
this.handleDrop(event, null);
}
```
---
### Si Test 4 échoue encore
**Vérifier**:
1. Les groupes ont-ils des IDs de drop list uniques (`group-${ctime}`) ?
2. Les drop lists sont-elles connectées (`cdkDropListConnectedTo`) ?
3. Le handler `onChildDrop()` est-il bien appelé ?
**Debug**:
```typescript
// Dans bookmark-item.component.ts
get dropListId(): string {
const id = `group-${this.bookmark.ctime}`;
console.log('Drop list ID:', id); // Ajoutez ce log
return id;
}
```
---
### Si Test 5 échoue encore
**Vérifier**:
1. La méthode `isDescendantOf()` fonctionne-t-elle correctement ?
2. Le warning apparaît-il dans la console ?
3. Le document reste-t-il inchangé après la tentative ?
**Debug**:
```typescript
// Dans bookmark-item.component.ts
private isDescendantOf(ancestorCtime: number): boolean {
console.log('Checking if', ancestorCtime, 'is ancestor of', this.bookmark.ctime);
const result = /* ... logique existante ... */;
console.log('Result:', result);
return result;
}
```
---
## Problèmes connus résiduels
### 1. Titre affiché avec path complet
**Observation**: Dans votre JSON, ligne 48:
```json
{
"type": "file",
"ctime": 1759252487676,
"path": "folder/test2.md",
"title": "folder/test2.md" // ❌ Path complet dans title
}
```
**Cause**: Le title a été explicitement défini avec le path complet lors de la création.
**Solution**:
- Option 1: Ne pas remplir le champ "Title" lors de l'ajout → basename automatique
- Option 2: Supprimer le champ `title` du JSON pour forcer le fallback
**Correction manuelle**:
```json
{
"type": "file",
"ctime": 1759252487676,
"path": "folder/test2.md"
// Pas de title → affichera "test2.md"
}
```
---
### 2. Groupes avec caractères spéciaux
**Observation**: Ligne 41:
```json
{
"type": "group",
"ctime": 1759253098054,
"title": "groupeA\\groupeD" // Backslash dans le titre
}
```
**Impact**: Aucun problème technique, mais peut prêter à confusion (ressemble à un path).
**Recommandation**: Éviter les caractères `\` et `/` dans les titres de groupes.
---
## Checklist de validation
Après avoir appliqué les corrections:
- [ ] Rebuild effectué (`npm run build`)
- [ ] Serveur relancé (`node server/index.mjs`)
- [ ] DevTools ouvert (F12)
- [ ] Test 3 refait avec logs observés
- [ ] Test 4 refait avec logs observés
- [ ] Test 5 refait avec warning observé
- [ ] Fichier JSON vérifié (pas d'items invalides)
- [ ] Tous les tests passent ✅
---
## Prochaines étapes
Si les tests passent:
1. Retirer les logs de debug (ou les mettre en mode verbose)
2. Continuer avec les tests restants (6-15)
3. Documenter les résultats finaux
Si les tests échouent encore:
1. Copier les logs de la console
2. Vérifier les attributs CDK dans le HTML
3. Tester avec un JSON minimal (1 groupe, 1 bookmark)
4. Signaler les logs et comportements observés
---
**Date**: 2025-01-30
**Version**: 2.0.1
**Statut**: Corrections appliquées, tests en attente