Cypress · Browser testing end to end

How do you test file uploads in Cypress?

Mediumfile uploadselectFileformsUpdated Oct 2026

Short answer

Use cy.get on the file input and call selectFile with a fixture path, a buffer or a file object. Assert on the resulting UI or on the request the app sends.

Modern Cypress handles uploads through selectFile. It targets an input with type file and attaches one or more files without opening an operating-system dialog. The file can come from the fixtures folder, an in-memory buffer, or a path relative to the project.

cy.visit("/profile");

cy.get("[data-cy=avatar-input]").selectFile(
  "cypress/fixtures/avatar.png",
);

cy.get("[data-cy=avatar-preview]")
  .should("be.visible")
  .and("have.attr", "src")
  .and("include", "blob:");

selectFile attaches the fixture to the input, and the test asserts on the preview the app renders.

Other upload shapes

cy.get("[data-cy=documents]").selectFile({
  contents: Cypress.Buffer.from("hello world"),
  fileName: "notes.txt",
  mimeType: "text/plain",
});

cy.get("[data-cy=documents]").selectFile(
  ["cypress/fixtures/a.pdf", "cypress/fixtures/b.pdf"],
  { action: "drag-drop" },
);

Buffers are useful for generated content, and the drag-drop action simulates dropping files onto a drop zone.

Use a small fixture rather than a large real file
Assert on the preview, filename or the upload request
Intercept the upload endpoint if you need to verify the payload
Test invalid types and oversized files as separate cases
Use the drag-drop action for a drop zone rather than a hidden input

If the input is hidden behind a styled button, selectFile still needs a file input in the DOM. Do not use force to click an invisible input; target the input directly or use the drop-zone action.

Follow-ups you should expect

Interviewers use these to check whether the first answer was understanding or memorisation.

1How do you upload a file from a buffer?
2How do you assert that the upload request carried the file?
3How do you test an invalid file type?
4What if the file input is visually hidden?

Say it in the interview

I use selectFile on the file input, pointing at a fixture or passing a buffer and filename. Then I assert on what the user sees, such as a preview or a success message, or intercept the upload request to check the payload. For a drop zone I use the drag-drop action. I keep fixture files small and test rejects and size limits as their own cases.

Use this as a model, not a script. Saying it in your own words is what makes it survive follow-up pressure.

Now say it out loud.

Understanding an answer and delivering it under pressure are different skills. Rehearse this topic in a live Cypress mock interview and get scored feedback on depth, clarity and confidence.

Start a free Cypress interview Browse all questions

Other upload shapes

Follow-ups you should expect

Related questions

Now say it out loud.