Cypress and file upload using drag n drop

I’m attempting to test, using cypress, the functionality of a file upload widget.

The cypress tests which I’ve tried are:

const filePath = './cypress/fixtures/example.jpg'

    cy.get('.dropzone')
    .selectFile(filePath, 
    { action: 'drag-drop',
      force: true, }).trigger('drop', {force: true})

and

    cy.get('.dropzone > input[type="file"]').should('exist').invoke('show')
    .selectFile(filePath, {
      action: 'drag-drop',
      force: true,
      log: true,
    })
    .trigger('drop', {force: true})

The html that the tests are executing against is:

<div tabindex="0" role="button" class="dropzone  svelte-817dg2" style="">
<input accept="image/*" type="file" name="avatar" autocomplete="off" tabindex="-1" style="display: none;"> 
<p>Drag 'n' drop some files here, or click to select files</p>
</div>

In both cases, and every variation on these, the tests never actually upload a file.

However, in the cypress chrome browser, I’m able to manually perform the drag n drop action successfully.