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.

Sign up for GitHub

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

Jump to bottom

[Bug Report] VFileInput does not work with Safari on MacOS or iOS #7941

Closed
ChrisLandowski opened this issue Jul 23, 2019 · 15 comments · Fixed by #8498
Closed

[Bug Report] VFileInput does not work with Safari on MacOS or iOS #7941

ChrisLandowski opened this issue Jul 23, 2019 · 15 comments · Fixed by #8498
Assignees
@nekosaur
Labels
C: VFileInput platform specific The issue only occurs on a specific platform S: has PR The issue has a pending Pull Request T: bug Functionality that does not work as intended/expected
Milestone
v2.0.x

Comments

@ChrisLandowski
Copy link

Versions and Environment

Vuetify: 2.0.0
Vue: 2.6.10
Browsers: Safari 12.1.1
OS: Mac OS 10.14.5

Steps to reproduce

Select a file

Expected Behavior

The filename should be displayed in the File Input component

Actual Behavior

Nothing is in the File Input component

Reproduction Link

https://codepen.io/anon/pen/RXaPOX?&editable=true&editors=101

Other comments

None of the examples at https://vuetifyjs.com/en/components/file-inputs show the selected filename when using Safari on both MacOS and iOS.
@ghost ghost added the S: triage label Jul 23, 2019
@johnleider
Copy link
Member

@KaelWD has access to an iPad so I'm blaming this one on him

@johnleider johnleider added T: bug Functionality that does not work as intended/expected and removed S: triage labels Jul 24, 2019
@nekosaur nekosaur added the platform specific The issue only occurs on a specific platform label Jul 24, 2019
@Anton-vBR
Copy link

I experienced the same issue on Chrome (updated 5th August)

@nekosaur
Copy link
Member

@Anton-vBR Did you experience it using the reproduction link in this issue? Which version of Chrome, which OS?

@nekosaur nekosaur assigned nekosaur and unassigned KaelWD Aug 13, 2019
nekosaur added a commit that referenced this issue Aug 13, 2019
@nekosaur
fix(VFileInput): bug in Safari where file is not added
0c5bbcb 
Safari does not seem to emit an input event when selecting a file, even though
from what I can see the HTML spec says both an input and change event should
be emitted.

closes #7941
@nekosaur nekosaur mentioned this issue Aug 13, 2019
Merged
9 tasks
@nekosaur nekosaur added S: has PR The issue has a pending Pull Request C: VFileInput labels Aug 13, 2019
@Anton-vBR
Copy link

Anton-vBR commented Aug 13, 2019 •
edited

@nekosaur

OS: Ipad 12.2
Browser: Chrome 76.0.3809.81

Reproduction Link (same as above)
https://codepen.io/anon/pen/RXaPOX?&editable=true&editors=101

(also tried on Iphone 7)

Edit: I'll have a look at versioning later today and compare to standard file-inputs.

johnleider pushed a commit that referenced this issue Aug 15, 2019
@nekosaur @johnleider
fix(VFileInput): bug in Safari where file is not added (#8498)
0b4a970 
* fix(VFileInput): bug in Safari where file is not added

Safari does not seem to emit an input event when selecting a file, even though
from what I can see the HTML spec says both an input and change event should
be emitted.

closes #7941

* chore(VFileInput): update comment
@johnleider johnleider added this to the v2.0.x milestone Aug 15, 2019
@tgduke
Copy link

tgduke commented Aug 15, 2019

I experience the same on my own site and in the links provided here, but if I use it on vuetify https://vuetifyjs.com/en/components/file-inputs it works fine.

@Anton-vBR
Copy link

@tgduke looking at the codepen linked from the site the Vuetify version is 2.0.7 whereas the links here are 2.0.0. I’ll try to upgrade later.

@tgduke
Copy link

tgduke commented Aug 16, 2019

@Anton-vBR I will try to downgrade to version 2.0.0 and see if it is a bug introduced in 2.0.7 or inbetween

@tgduke
Copy link

tgduke commented Aug 16, 2019

Still not working with downgrade. Maybe it is related to v-model. Trying to remove it and making a new deploy.

@sophiews-up
Copy link

Any update on this?

@jacekkarczmarczyk
Copy link
Member

We kindly ask users to not comment on closed/resolved issues. If you believe that this issue has not been correctly resolved, please create a new issue showing the regression or reach out to us in our Discord community.

Thank you for your contribution and interest in improving Vuetify.

@0x77dev
Copy link

0x77dev commented Feb 3, 2020

Same issue here...

@MingYang2008
Copy link

This bug still exists in the latest version. Only after click the placeholder or label text, it is normal to click other places.

@0x77dev
Copy link

0x77dev commented Apr 29, 2020

Just tested it out, it works on Chrome for iOS.

@Meowzz95
Copy link

Meowzz95 commented May 7, 2020

Same issue here, on iOS safari, sometimes works sometimes not

@nekosaur
Copy link
Member

nekosaur commented May 7, 2020

As already mentioned, please create a new issue with a reproduction in the latest version of vuetify. Thank you.

@vuetifyjs vuetifyjs locked as resolved and limited conversation to collaborators May 7, 2020
Sign up for free to subscribe to this conversation on GitHub. Already have an account? Sign in.
Assignees

@nekosaur nekosaur

Labels
C: VFileInput platform specific The issue only occurs on a specific platform S: has PR The issue has a pending Pull Request T: bug Functionality that does not work as intended/expected
Projects
None yet
Milestone
v2.0.x
Development

Successfully merging a pull request may close this issue.

fix(VFileInput): bug in Safari where file is not added vuetifyjs/vuetify