Add backlink

docs/SIDEBAR_RESIZE_TEST.md

@@ -0,0 +1,127 @@
+# Test de la Sidebar Redimensionnable
+
+## Étapes pour tester
+
+### 1. Redémarrer le serveur
+
+```bash
+# Arrêter le serveur actuel (Ctrl+C)
+# Puis relancer :
+cd /home/mathieu/git/project-notes
+go run ./cmd/server
+```
+
+### 2. Ouvrir l'application
+
+```
+http://localhost:8080
+```
+
+### 3. Tester le redimensionnement
+
+1. **Ouvrez la console développeur** (F12) pour voir les logs
+2. Vous devriez voir : `Sidebar resize initialized`
+3. **Survolez le bord droit de la sidebar** (zone de 4px)
+   - Le curseur devrait devenir `↔` (resize cursor)
+   - Une fine ligne bleue devrait apparaître
+4. **Cliquez et glissez** vers la droite ou la gauche
+5. **Relâchez** pour sauvegarder la largeur
+6. **Rechargez la page** (F5) - la largeur devrait être restaurée
+
+### 4. Tests de limites
+
+- **Minimum** : Essayez de réduire en dessous de 200px (bloqué)
+- **Maximum** : Essayez d'agrandir au-delà de 600px (bloqué)
+
+### 5. Reset (si nécessaire)
+
+Dans la console développeur :
+```javascript
+resetSidebarWidth()
+```
+
+## Vérifications si ça ne fonctionne pas
+
+### 1. Le script se charge-t-il ?
+
+Dans la console développeur (F12), onglet Network :
+- Cherchez `sidebar-resize.js`
+- Status devrait être `200 OK`
+- Si `404`, le serveur ne sert pas le fichier
+
+### 2. Y a-t-il des erreurs JavaScript ?
+
+Dans la console développeur (F12), onglet Console :
+- Cherchez des erreurs en rouge
+- Vous devriez voir : `Sidebar resize initialized`
+- Si vous voyez `Sidebar not found`, le sélecteur `#sidebar` ne trouve pas l'élément
+
+### 3. La poignée est-elle créée ?
+
+Dans la console développeur (F12), onglet Elements/Inspecteur :
+- Sélectionnez `<aside id="sidebar">`
+- À l'intérieur, en bas, il devrait y avoir : `<div class="sidebar-resize-handle" title="Drag to resize sidebar"></div>`
+
+### 4. Les styles CSS sont-ils appliqués ?
+
+Dans la console développeur, inspectez `.sidebar-resize-handle` :
+- `width: 4px`
+- `cursor: ew-resize`
+- `position: absolute`
+
+## Débogage avancé
+
+### Test manuel du script
+
+Dans la console développeur :
+```javascript
+// Vérifier que la sidebar existe
+document.querySelector('#sidebar')
+
+// Vérifier que la poignée existe
+document.querySelector('.sidebar-resize-handle')
+
+// Tester le redimensionnement manuel
+const sidebar = document.querySelector('#sidebar');
+sidebar.style.width = '400px';
+document.querySelector('main').style.marginLeft = '400px';
+```
+
+### Test de sauvegarde localStorage
+
+```javascript
+// Sauvegarder une largeur
+localStorage.setItem('sidebar-width', '400');
+
+// Lire la largeur sauvegardée
+localStorage.getItem('sidebar-width');
+
+// Effacer
+localStorage.removeItem('sidebar-width');
+```
+
+## Problèmes connus et solutions
+
+### La poignée n'apparaît pas
+- **Cause** : Styles CSS non chargés
+- **Solution** : Vider le cache (Ctrl+Shift+R) et recharger
+
+### Le curseur ne change pas
+- **Cause** : Z-index trop bas
+- **Solution** : Vérifier que `.sidebar-resize-handle` a `z-index: 11`
+
+### Le resize ne fonctionne pas sur mobile
+- **Normal** : Désactivé volontairement sur mobile (< 768px)
+- La sidebar est fixe à 280px sur mobile
+
+### La sidebar saute au resize
+- **Cause** : Transition CSS qui interfère
+- **Solution** : Désactiver temporairement `transition` pendant le resize (déjà fait dans le CSS)
+
+## Support
+
+Si ça ne fonctionne toujours pas après ces tests, fournir :
+1. Screenshot de la console (onglet Console)
+2. Screenshot de la console (onglet Network, fichier sidebar-resize.js)
+3. Version du navigateur
+4. Si mobile ou desktop