The Camera keeps on forever even when a user is directed to different route #8

Activity

1. kawpii commented on Jun 21, 2023

   

   kawpii

   on Jun 21, 2023

   Last edited by kawpii

   More actions

   @mebjas I am also experiencing the same thing in another library which also use html5-qrcode behind the seens?
2. shuvo-me commented on Jul 16, 2026

   

   shuvo-me

   on Jul 16, 2026

   Last edited by shuvo-me

   More actions

   You have to stop the video tracks and camera manually first.

     const stopScanner = useCallback(async () => {
       // 1. Stop tracked stream directly
       if (streamRef.current) {
         streamRef.current.getTracks().forEach((track) => track.stop());
         streamRef.current = null;
       }
   
       // 2. Stop html5-qrcode safely checking its active scanner state
       if (scannerRef.current) {
         try {
           if (scannerRef.current.isScanning) {
             await scannerRef.current.stop();
           }
           scannerRef.current.clear();
         } catch (err) {
           console.warn("Soft warning during scanner stop cleanup:", err);
         } finally {
           // scannerRef.current = null;
         }
       }
   
       // 3. Fallback: stop ALL video tracks in the DOM
       document.querySelectorAll("video").forEach((video) => {
         if (video.srcObject) {
           (video.srcObject as MediaStream)
             .getTracks()
             .forEach((track) => track.stop());
           video.srcObject = null;
         }
       });
   
       setIsScanning(false);
     }, []);

   But one thing I have noticed is that the instance is not fully stopping its scanning function by calling the stop method from the instance. @mebjas is it right or not?