Improve camera reliability and diagnose capture issues more effectively

Adds detailed logging and retry logic to address camera startup and dimension detection failures in CameraModal and useCamera.

Replit-Commit-Author: Agent
Replit-Commit-Session-Id: dec54137-d5a2-4406-8ad4-5f2f9fb110bf
Replit-Commit-Screenshot-Url: https://storage.googleapis.com/screenshot-production-us-central1/0715008c-7244-40f4-befc-26c014852236/eb403944-9342-469a-8dd7-95b8b1a1cf40.jpg

client/src/components/CameraModal.tsx

@@ -25,31 +25,47 @@ export default function CameraModal({
 }: CameraModalProps) {
   useEffect(() => {
     if (isOpen && videoRef.current) {
-      // Ensure video starts playing when modal opens
       const video = videoRef.current;
+      console.log('CameraModal useEffect - video element ready');
       
       const handleLoadedMetadata = () => {
-        console.log('Video loaded metadata:', video.videoWidth, 'x', video.videoHeight);
+        console.log('CameraModal: Video metadata loaded, dimensions:', video.videoWidth, 'x', video.videoHeight);
       };
       
       const handleCanPlay = () => {
-        console.log('Video can play');
+        console.log('CameraModal: Video can play, readyState:', video.readyState);
       };
       
       const handleError = (error: Event) => {
-        console.error('Video error:', error);
+        console.error('CameraModal: Video error event:', error);
+      };
+      
+      const handlePlay = () => {
+        console.log('CameraModal: Video started playing');
       };
       
       video.addEventListener('loadedmetadata', handleLoadedMetadata);
       video.addEventListener('canplay', handleCanPlay);
       video.addEventListener('error', handleError);
+      video.addEventListener('play', handlePlay);
       
-      video.play().catch(console.error);
+      // Forcer le play avec gestion d'erreur
+      const startPlayback = async () => {
+        try {
+          await video.play();
+          console.log('CameraModal: Video play() successful');
+        } catch (playError) {
+          console.error('CameraModal: Video play() failed:', playError);
+        }
+      };
+      
+      startPlayback();
       
       return () => {
         video.removeEventListener('loadedmetadata', handleLoadedMetadata);
         video.removeEventListener('canplay', handleCanPlay);
         video.removeEventListener('error', handleError);
+        video.removeEventListener('play', handlePlay);
       };
     }
   }, [isOpen, videoRef]);

client/src/components/NewSaleForm.tsx

@@ -184,7 +184,8 @@ export default function NewSaleForm() {
 
   // Photo capture functions
   const handlePhotoCapture = async (photoType: PhotoType) => {
-    console.log('Photo capture requested for:', photoType);
+    console.log('=== PHOTO CAPTURE REQUESTED ===');
+    console.log('Photo type:', photoType);
     
     // Vérifications préliminaires
     if (!navigator.mediaDevices || !navigator.mediaDevices.getUserMedia) {
@@ -208,8 +209,35 @@ export default function NewSaleForm() {
 
     try {
       console.log('Attempting to start camera...');
+      
+      // Afficher toast de démarrage
+      toast({
+        title: "Démarrage de la caméra",
+        description: "Préparation de la caméra en cours...",
+      });
+      
+      // Démarrer la caméra
       await startCamera(photoType);
       console.log('Camera started successfully');
+      
+      // Attendre 2 secondes supplémentaires pour s'assurer que la vidéo est prête
+      console.log('Waiting for video to be fully ready...');
+      await new Promise(resolve => setTimeout(resolve, 2000));
+      
+      // Vérifier l'état final de la vidéo
+      if (videoRef.current) {
+        const video = videoRef.current;
+        console.log('Final video state check:', {
+          videoWidth: video.videoWidth,
+          videoHeight: video.videoHeight,
+          readyState: video.readyState,
+          paused: video.paused,
+          currentTime: video.currentTime
+        });
+      }
+      
+      console.log('Camera should be ready for capture');
+      
     } catch (error) {
       console.error('Camera start failed:', error);
       toast({