9.3.0: selectFile: missing mimeType

[mduft]

Current behavior

Switching from cypress-file-upload currently not possible. We're using attachFile to put a PNG file (test.png) in a hidden input[type="file"]. The application uses:

<input type="file" hidden (change)="onImageChange($event)" #fileInput />

/* template */ onImageChange(event) {
    if (event.target.files && event.target.files.length > 0) {
        const selLogoFile: File = event.target.files[0];
        console.log('XX: ' + selLogoFile.type);
    ....

The output when actually filling the file input (triggered using fileInput.click()) with a PNG file is XX: image/png. Using cypress-file-upload we specified this mimeType also in the test:

cy.get('input[type="file"]').attachFile({ filePath: 'test.png', mimeType: 'image/png' });

This also yielded the same console output (XX: image/png).

Now, reworking to selectFile, the code no longer supports mime type, and we need to explicitly force on invisible input:

cy.get('input[type="file"]').selectFile({ contents: 'cypress/fixtures/test.png' }, { force: true });

After this, the output is now only XX: - no mime type is present. According to the documentation manual setting of mime type should not be necessary due to improved binary handling (or so tails tell) xD

Desired behavior

Cypress should detect the mime type and encoding of files used from fixtures directory in selectFile as documented

Test code to reproduce

Unfortunately cypress-test-tiny does not provide a way to host a simple HTML page to test, and I cannot find any good example online of such an input field where the mime type of the file is shown somewhere ...

Cypress Version

9.3.0

Other

No response

[perglervitek]

I hope, that the binary will be fixed and also it will be possible to manually set the mimeType. Luckily cypress-file-upload still does the job.

[BlueWinds]

You're absolutely right, and this is an oversight on our part; I could give a long explanation of how it happened, but short version is 'whoops'.

Starting work on this today, prioritized this for the next minor release.

[mduft]

:D we all 'whoops' from time to time :) Looking forward to the fix

[pauwilk]

Hey, just to be sure - I have a problem when my input has accept="image/png" - the command passes but nothing is uploaded. When I have accept=".png" in my input, everything is ok.
Do I understand correctly that the issue is related to the one described above?

[perglervitek]

Hey, just to be sure - I have a problem when my input has accept="image/png" - the command passes but nothing is uploaded. When I have accept=".png" in my input, everything is ok.

Yes, you either have accept parameter on check file.type in your app. That's the reason, why it's refusing the uploaded file.

[cypress-bot]

The code for this is done in cypress-io/cypress#19794, but has yet to be released.
We'll update this issue and reference the changelog when it's released.

[cypress-bot]

Released in 9.4.0.

This comment thread has been locked. If you are still experiencing this issue after upgrading to
Cypress v9.4.0, please open a new issue.