Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

[bug] <input accept="audio/mpeg" type="file" /> does not filter file types #9158

Open
bradleat opened this issue Mar 12, 2024 · 7 comments
Open
Labels
platform: macOS status: needs triage This issue needs to triage, applied to new issues status: upstream This issue is blocked by upstream dependencies and we need to wait or contribute upstream fixes type: bug

Comments

@bradleat
Copy link

bradleat commented Mar 12, 2024

Describe the bug

Similar to #6915.

<input accept="audio/mpeg" type="file" /> does not filter for the right type of files on macOS 14.3

Reproduction

Just a react app with <input accept="audio/mpeg" type="file" /> should do it.

Expected behavior

It should only allow mp3 files to be selected on on macOS 14.3

Full tauri info output

WARNING: no lock files found, defaulting to npm

[✔] Environment
    - OS: Mac OS 14.3.0 X64
    ✔ Xcode Command Line Tools: installed
    ✔ rustc: 1.74.0 (79e9716c9 2023-11-13)
    ✔ cargo: 1.74.0 (ecb9851af 2023-10-18)
    ✔ rustup: 1.26.0 (5af9b9484 2023-04-05)
    ✔ Rust toolchain: stable-aarch64-apple-darwin (default)
    - node: 20.4.0
    - npm: 9.7.2

[-] Packages
    - tauri [RUST]: 1.6.1
    - tauri-build [RUST]: 1.5.1
    - wry [RUST]: 0.24.7
    - tao [RUST]: 0.16.7
    - @tauri-apps/api [NPM]: 1.5.3
    - @tauri-apps/cli [NPM]: 1.5.11

[-] App

Stack trace

No response

Additional context

No response

@bradleat bradleat added status: needs triage This issue needs to triage, applied to new issues type: bug labels Mar 12, 2024
@FabianLars
Copy link
Member

Same question i had in that other issue, could you test the same in Safari please?

@bradleat
Copy link
Author

bradleat commented Mar 15, 2024

In Safari it works. It filters the file types.

Not Working in Tauri

Screenshot of it not working in Tauri

Working in Safari

Screenshot of it working in Safari

@FabianLars
Copy link
Member

Thanks. So the issue we're dealing with here is that the apis we'd have to use to get the file types are private: https://github.com/WebKit/WebKit/blob/448446ef4d14d7648787ac0d062b2c759a1e935e/Source/WebKit/UIProcess/API/Cocoa/WKOpenPanelParameters.mm#L55-L72 which means using them would prevent the app from being accepted to the app store. 😮‍💨

We could add that behind a feature flag of course like we do for fullscreen and transparency but that's still super annoying of course.

p.s. I'd recommend to use tauri's dialog own dialog apis for this instead of the browser's native one. Those apis should have working filters. Main drawback of that is of course that you couldn't drop file onto the element as easily anymore (tauri has a custom drag drop implementation but it doesn't contain coordinates in v1)

@FabianLars
Copy link
Member

/upstream tauri-apps/wry

@tauri-apps tauri-apps bot added the status: upstream This issue is blocked by upstream dependencies and we need to wait or contribute upstream fixes label Mar 15, 2024
@bradleat
Copy link
Author

I'd appreciate a feature flag to enable the private file type API on MacOS. We are not so concerned about the App Store at this moment in time.

@PavelLaptev
Copy link

Looks like it also doesn't work on Windows

@ryleu
Copy link

ryleu commented Jul 14, 2024

image

Weirdly it seems to be working fine on linux? There are more non-image files in my Downloads folder that aren't showing up in the file picker.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
platform: macOS status: needs triage This issue needs to triage, applied to new issues status: upstream This issue is blocked by upstream dependencies and we need to wait or contribute upstream fixes type: bug
Projects
None yet
Development

No branches or pull requests

4 participants