Adding dropzone.js on Vaadin Flow + Spring Boot project

I want to add dropzone.js version 5 to my Vaadin Flow 12.0.7 & Spring Boot 2.1.3.RELEASE project but without any success.

I’ve tried both methods adding dropzone on the page: default one, described here: https://www.dropzonejs.com/#usage And programmatically described here: https://www.dropzonejs.com/#create-dropzones-programmatically

I’ve added dropzone.js to static resources in my project:

\src\main\resources\static\frontend\js

and imported it by

@JavaScript("/frontend/js/dropzone.js")

Then I’ve added a new form and div on my view:

@Route
@JavaScript("/frontend/js/dropzone.js")
public class MainView extends VerticalLayout {

    private final Div dropZoneDiv;

    private boolean dropZoneAttached = false;

    private MainView() {
        add(new H1("Vaadin Spring Dropzone"));

        add(new H2("Default adding method"));
        Element form = new Element("form");
        form.setAttribute("action", "file/post");
        form.setAttribute("class", "dropzone");
        form.setAttribute("id", "my-awesome-dropzone");
        getElement().appendChild(form);

        add(new H2("Create dropzone programmatically"));
        dropZoneDiv = new Div();
        dropZoneDiv.setId("dzDiv");
        add(dropZoneDiv);
    }

    @Override
    protected void onAttach(AttachEvent attachEvent) {
        super.onAttach(attachEvent);
        if (dropZoneDiv!=null && !dropZoneAttached) {
            UI.getCurrent().getPage().executeJavaScript(
                    "var myDropzone = new Dropzone(\"div#dzDiv\", { url: \"/file/post\"});\n" //+
            );
            dropZoneAttached = true;
        }
    }
}

I expected to see at least one dropzone on the page, but actually the div and form I’m attaching dropzone to are empty in Chrome or Firefox.

Are there any errors in the browser console log?

Martin Israelsen:
Are there any errors in the browser console log?

no, I don’t see any erreors