question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Same file upload doesn't fire input event, even when clearing `input.value`

See original GitHub issue
  • @testing-library/user-event version: 12.8.2
  • Testing Framework and version: jest 26.6.0
  • DOM Environment: jsdom 16.4.0

Relevant code or config

const handleChange = jest.fn();
render(<InputComponent changeHandler={handleChange} />);
const inputEl = screen.getByLabelText("Select file") as HTMLInputElement;
const file = new File([], "image.jpg");
userEvent.upload(inputEl, file);
await waitFor(() => expect(handleChange).toBeCalled());

inputEl.value = "";
userEvent.upload(inputEl, file);
//fails
await waitFor(() => expect(handleChange).toBeCalledTimes(2));

What you did: In #575, upload was changed so it correctly doesn’t fire an onChange/onInput event when the same files are selected. In our use case, we do want it to fire again, and our workaround is adding an onClick event that sets inputEl.value = "".

What happened: Second input event doesn’t fire, even when the value is reset to blank.

Problem description: Looking at the source, it doesn’t appear to take value into account.

Suggested solution: It should consider the value of the input field, but I’m not sure how the value relates to input.files, which is what is normally used.

Issue Analytics

  • State:closed
  • Created 2 years ago
  • Comments:6 (3 by maintainers)

github_iconTop GitHub Comments

github_iconTop Results From Across the Web

HTML input file selection event not firing upon selecting the ...
This will reset the input 's value and trigger the onchange event even if the same path is selected. var input = document.getElementsByTagName('input')[0]; ......
Read more >
Input File change event not working - EncodeDna.com
A simple solution to get rid of this issue will be, to clear the file input value. I'll show you how. Let's see...
Read more >
Solved: on change of html input form element does not work...
I assume it's since the "change" event has not occurred since it remembers the previous file.
Read more >
Using files from web applications - Web APIs - MDN Web Docs
Here, we retrieve the dataTransfer field from the event, pull the file list out of it, and then pass that to handleFiles() ....
Read more >
Upload same image not working - OutSystems
The solution is to set the value of inputs[i] to "" so that the next time you upload the same image, the upload...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found