Is there a way in Test Cafè to select and upload a file with react-DropZone?

Question

I have to select and upload a file, with Test Cafè, in DropZone. The plugin is set to start the upload just after the selection of the file in the dialog window or just after dropping files in the area. After reading the TestCafè "setFilesUpload" documentation I wrote this:

const fileInput = await Selector('input[type="file"]');
await page.setFilesToUpload( fileInput, './e2efile.pdf');

The test doesn't crash or fail, and it looks fine in testcafè, but nothing is getting uploaded for real, am I missing something?

Answer 1

The behavior you described looks like a bug so I suggest you post a new issue in the TestCafe GitHub repository.

I did not manage to reproduce this issue. Please check the following test example with which I tried:

import { Selector } from 'testcafe';

fixture `Fixture 1`
    .page `https://01kw5vw840.csb.app/`;

test('Test 1', async t => {
    await t
        .setFilesToUpload(Selector('.app').find('div').withText('Drop an image, get a preview!').find('input[type=\"file\"]'), ['Untitled.png'])
        .debug();
});

In addition, it looks a bit strange how you call the setFilesToUpload action. It's a method of the TestContoller class, so the page variable in your code example should be a test controller.