I’m trying to implement a function in my React web application that allows requesting permissions from the browser to access the user’s camera, similar to how Google Meet does it. The first time a user visits my site, the browser displays a dialog with the options “Allow” or “Deny” for camera access.

I’m using react typescript for the first time, and I implemented outside click event. I’m running into a problem where whenever i click on the active or currently selected component, it seems to trigger the onclick and outside click event.

useEffect(() => { document.addEventListener(“dragend”, () => { console.log(“end”); }); document.addEventListener(“mouseleave”, () => { console.log(“hello”); }); }, []); Why is it that after I drag an item, the mouseleave event is no longer being listened to? <div id=”draggable” draggable onDragLeave={(event) => { console.log(“mouseleave”); event.preventDefault(); }} onDragEnd={(event) => { console.log(“onDragEnd”); event.preventDefault(); }} > Drag me! </div> reactjs […]