Form-data Xmlhttprequest not submitting data

I am trying to submit a form using the post method and a FormData object. I annotated my servlet with @MultipartConfig but it doesnt work ( i run it in debug mode )

js

async function addAuthors() {
        let xhr = new XMLHttpRequest();
        const form = document.getElementById( "authorForm" );
        const FD = new FormData(form);
        xhr.open("POST", "http://localhost:8081/Task1_war/main?command=addAuthor");
        xhr.send(FD);
} 

html

   <form id="authorForm">
        <h1>Author (required)</h1>
        <input type="text"  name="authorName" class="req"/>
        <h1>Author image></h1>
        <input type="file" id="authorImage" name="path" accept=".jpg,.png,.jpeg ">

    </form>
    <div class="add" onclick="addAuthors()">Send</div>

web.xml

    <servlet>
        <servlet-name>MainServlet</servlet-name>
        <servlet-class>com.example.Task1.controller.MainController</servlet-class>
    </servlet>

    <servlet-mapping>
        <servlet-name>MainServlet</servlet-name>
        <url-pattern>/main</url-pattern>
    </servlet-mapping>