codemirror want to disaplay loader on dragover

1

I want to display the loader once user dragover the file on the codemirror editor.

I have added the webhook for that with below code

const options = {
        matchBrackets: true,
        autoCloseBrackets: true,
        mode: "application/json",
        gutters: ["CodeMirror-lint-markers"],
        lineWrapping: true,
        lineNumbers: true,
        dragdrop:true
    };
    editor = CodeMirror.fromTextArea(container, options);

    editor.on("dragover",function(editor,e){
        $("#file-loading").addClass("is-active");
        console.log("dragover");
        e.preventDefault();
    });
    editor.on("drop",function(editor,e){
        $("#file-loading").removeClass("is-active");
        console.log("drop");
        e.preventDefault();
    });

When I am going to drop the file it will directly open that file into the browser once I added the javascript/Jquery code into the dragover event/hook.

Please help me to resolve this issue.