CAMERA NOT DICONNECTING AFTER QUAGGA.STOP() CALLED

[BISWAJITABISWAL]

import React, { useEffect } from "react";
import config from "./config.json";
import Quagga from "quagga";

const Scanner = (props) => {
const { onDetected } = props;

useEffect(() => {
Quagga.init(config, (err) => {
if (err) {
console.log(err, "error msg");
}

  Quagga.start();
});

//detecting boxes on stream
Quagga.onProcessed(onProcessed);

Quagga.onDetected(detected);

return () => {
    Quagga.offDetected(detected);
  };
}, [onDetected]);

const onProcessed = (result) => {
    var drawingCtx = Quagga.canvas.ctx.overlay,
        drawingCanvas = Quagga.canvas.dom.overlay;

    if (result) {
        if (result.boxes) {
            drawingCtx.clearRect(
                0,
                0,
                Number(drawingCanvas.getAttribute("width")),
                Number(drawingCanvas.getAttribute("height"))
            );
            result.boxes
                .filter(function (box) {
                    return box !== result.box;
                })
                .forEach(function (box) {
                    Quagga.ImageDebug.drawPath(box, { x: 0, y: 1 }, drawingCtx, {
                        color: "green",
                        lineWidth: 2
                    });
                });
        }

        if (result.box) {
            Quagga.ImageDebug.drawPath(result.box, { x: 0, y: 1 }, drawingCtx, {
                color: "#00F",
                lineWidth: 2
            });
        }

        if (result.codeResult && result.codeResult.code) {
            Quagga.ImageDebug.drawPath(
                result.line,
                { x: "x", y: "y" },
                drawingCtx,
                { color: "red", lineWidth: 3 }
            );
        }
    }
}
const detected = (result) => {
if (result.codeResult.code.toLowerCase().includes("assetid")) {
Quagga.offDetected(detected);
onDetected(result.codeResult.code);
}
};

useEffect(() => {
return () => {
Quagga.offProcessed(onProcessed);
Quagga.offDetected(detected);
Quagga.stop();
}
}, []);

return (
// If you do not specify a target,
// QuaggaJS would look for an element that matches
// the CSS selector #interactive.viewport

);
};
export default Scanner;

My issue is when the component is destroyed the camera is not turing off, even if i do stop(). I tried all possible ways but still none of them work

[github-actions]

Thank you for filing an issue! Please be patient. :-)

[ericblade]

I made a bit of an attempt to try to figure out what's going on here, but the formatting of this code is just completely illegible... so I pasted it into a browser, and this code just doesn't parse/run. Could you please reformat it and fix the errors and try again? (i edited your post to use the correct 3 backticks to start a code run, not single backticks)

[usamahassankhan]

Getting same error ,did you find solution?

[ericblade]

@usamahassankhan if you're using the same code as @BISWAJITABISWAL it's because their code doesn't even parse, so it's never running the stop.

[ericblade]

Closing due to no further input