can't remove event listener from JavaScript element

Question

I am having trouble removing the following event listener once it has been set:

videoTimeline = document.querySelectorAll(".video-timeline")

const draggableProgressBar = e => function(el) {
        let timelineWidth = e.clientWidth;
        e.closest(".container").querySelector(".progress-bar").style.width = `${el.offsetX}px`;
        e.closest(".container").querySelector("video").currentTime = (el.offsetX / timelineWidth) * e.closest(".container").querySelector("video").duration;
        e.closest(".container").querySelector(".current-time").innerText = formatTime(e.closest(".container").querySelector("video").currentTime);

    }

videoTimeline.forEach(el => 
        el.addEventListener("mousedown", () => el.addEventListener("mousemove", draggableProgressBar(el)))
    );

document.addEventListener("mouseup", () =>
        videoTimeline.forEach(el => 
            el.removeEventListener("mousemove", draggableProgressBar(el))
        )
    );

the event listener is added and works perfectly but doesn't get removed.

I've tried looping through to remove the event listener the same way it is applied but nothing works.

My question was marked as a duplicate linked to an answer that doesn’t solve my problem. Can you not do this until my problem is solved.