Skip to content

Fix web file input never being attached to the document - #2228

Merged
vicajilau merged 3 commits into
mainfrom
fix/web-safari-input-detached
Oct 5, 2026
Merged

vicajilau merged 3 commits into
mainfrom
fix/web-safari-input-detached

Conversation

@vicajilau

Copy link
Copy Markdown
Owner

Fixes #2222

Problem

On Safari (macOS and iOS) picking a file never returned the selection. The future either hung or completed with null, while Chrome worked fine.

The root cause is that the hidden <input type="file"> was never inserted into the DOM. HTMLCollection has no add method in package:web, so target.children.add(uploadInput) resolved to the dart:js_interop JSAny.add extension (the JS + operator). It compiled without warnings and silently did nothing. The same applied to the flt-file-picker-inputs container on body. Chromium still fires change on a detached file input, WebKit does not.

Changes

  • Insert the input and its container with appendChild, and keep the input attached until the picking session completes.
  • When the window regains focus before change arrives, return a selection already present on the input instead of treating it as a cancellation.
  • Add browser tests for WebFileInputSession covering attachment, selection, focus cancellation, focus before change, and the cancel event.
  • Bump file_picker_web to 4.0.1 with a changelog entry.
  • Fix the file_picker README, which pointed to a nonexistent WebOptions.cancelUploadOnWindowBlur instead of FilePickerWebOptions.

Testing

flutter test --platform chrome passes in file_picker_web (11 tests) and flutter analyze is clean. Still needs a manual check on Safari.

children.add() on an HTMLCollection does not exist in package:web, so the call resolved to the dart:js_interop JSAny.add extension (the JS + operator) and silently did nothing. Neither the hidden file input nor its flt-file-picker-inputs container was ever inserted into the DOM. Chromium still fires change on a detached input, but WebKit does not, so on Safari the picker future hung or completed with null.

The input is now inserted with appendChild and kept attached until the session completes. When the window regains focus before change arrives, a selection already present on the input is returned instead of being treated as a cancellation.

Bumps file_picker_web to 4.0.1.

Fixes #2222
The option lives on FilePickerWebOptions, exported by file_picker_web, not on the empty WebOptions class from the platform interface.
Comment thread packages/file_picker_web/CHANGELOG.md Resolved
End the session in the attachment test so its window focus listener does not leak into later tests, and shorten the changelog entries.
@vicajilau
vicajilau merged commit eb9b151 into main Oct 5, 2026
19 checks passed
@vicajilau
vicajilau deleted the fix/web-safari-input-detached branch October 5, 2026 13:33
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

Not working for Safari/Chrome on macOS/iOS

2 participants