Skip to content

Conversation

@kevinmehall
Copy link
Contributor

@kevinmehall kevinmehall commented Nov 13, 2025

Fixes #128 - The wasm implementation of rfd currently requires a few extra clicks in an ugly popup, but this can be avoided with browser APIs that have now been widely deployed for a couple of years.

Use the change and cancel events on the <input> to automatically dismiss the overlay and complete the Future when the native file picker dialog is completed or cancelled.

Combined with the existing call to click() to automatically open the native dialog, this means the user doesn't have to see or interact with the popup at all.

However, on some platforms like iPad where the native dialog doesn't cover the rfd popup, the existing behavior shows both, which is confusing:

IMG_0484

The click() method is only effective when the app has transient user activation, which is going to be the vast majority of the time, but I wanted to leave the popup to handle any remaining cases. This detects whether we have transient user activation, and hides the popup if so.

This touches pick_file and related only. save_file could perhaps click() the link, but I'll leave that for another PR.

This PR also cleans up the web-trunk example and extends it to be able to test this code.

Tested on

  • Chrome 142 on Linux
  • Chrome 142 on Android
  • Firefox 144 on Linux
  • Firefox 144 on Android
  • Safari 18.7 on iPadOS
  • Safari 16.6 on macOS
  • Edge 142 on Windows

Test steps

  • With the web-trunk example:
    • "Open rfd", select file -> should show file name
    • "Open rfd" cancel native dialog -> should show "No file picked"
    • "Open rfd with delay", click browse, select file -> should show file name
    • "Open rfd with delay", click cancel -> should show "No file picked"
    • "Open rfd with delay", click browse, cancel native dialog -> should show "No file picked"

@kevinmehall kevinmehall mentioned this pull request Nov 13, 2025
@c64zottel
Copy link

Works on Ubuntu 25.10:

  • Firefox 145.0
  • Chrome 142.0.7444.162

@PolyMeilex PolyMeilex added the no changelog Ignore changelog CI check label Nov 18, 2025
Copy link
Owner

@PolyMeilex PolyMeilex left a comment

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

Cool to see this working without any hacks, I was not aware of UserActivation API.
Thanks!

@PolyMeilex
Copy link
Owner

GitHub is partially down atm, so I'll merge this tomorrow.
(ping me if I forget to do so)

@PolyMeilex PolyMeilex merged commit 1092928 into PolyMeilex:master Nov 18, 2025
13 of 27 checks passed
@emilk
Copy link
Contributor

emilk commented Nov 19, 2025

Wow, so happy this landed - thanks @kevinmehall ❤️

@emilk
Copy link
Contributor

emilk commented Nov 24, 2025

Would love to have this released 🙏

@PolyMeilex
Copy link
Owner

Sure, 0.16 should be up now

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

no changelog Ignore changelog CI check

Projects

None yet

Development

Successfully merging this pull request may close these issues.

open os file picker directly on pickfile in wasm

4 participants