Blur with drag and drop

blur.js

javascript: {
    var x = null;
    var y = null;
    rect = null;
    document.body.style.userSelect = "none";
    document.body.style.pointerEvents = "none";
    document.addEventListener("mousedown", (e) => {
        document.addEventListener("mousemove", (e) => {
            try {
                rect.remove();
            } catch (err) {}
            rect.style.width = `${e.clientX - x}px`;
            rect.style.height = `${e.clientY - y}px`;
            document.body.appendChild(rect);
        });
        x = e.clientX;
        y = e.clientY;
        rect = document.createElement("DIV");
        rect.style.position = "absolute";
        rect.style.top = `${e.clientY}px`;
        rect.style.left = `${e.clientX}px`;
        rect.style.backdropFilter = "blur(5px)";
        rect.style.width = "20px";
        rect.style.height = "20px";
        rect.style.zIndex = "1000000000";
    });
    document.addEventListener("mouseup", (e) => {
        rect.style.width = `${e.clientX - x}px`;
        rect.style.height = `${e.clientY - y}px`;
        document.body.appendChild(rect);
        rect = null;
        try {
            document.removeEventListener("mousemove");
        } catch (err) {}
    });
}