iOS update to 10.3.1 breaks HTML input element
html, ios, safari
Solution
It only open camera because you use boolean attribute `capture`. According to HTML Media Capture specification:
The `capture`...if specified, indicates that the capture of media directly from the device's environment using a media capture mechanism is preferred. When the capture attribute is specified, the user agent should invoke a file picker of the specific capture control type.
In this specification, the term capture control type refers to a specialized type of a file picker control that is optimized, for the user, for directly capturing media of a MIME type specified by the accept attribute, using a media capture mechanism.
The term media capture mechanism refers to a device's local media capture device, such as a camera or microphone.
For your case, it is better to use `<input>` without `capture`, according to HTML specification, it seems offering option is a common browser behavior:
User agents may use the value of this attribute (accept) to display a more appropriate user interface than a generic file picker. For instance, given the value image/*, a user agent could offer the user the option of using a local camera or selecting a photograph from their photo collection;
There is a previous discussion on this "file input control" behavior 3 years ago: HTML file input control with capture and accept attributes works wrong? You can see that "show option dialog when capture attribute exists" makes people confused.
In my opinion, this iOS change in 10.3.1 is a fix for file input control. Otherwise, there would be no difference with or without `capture` attribute.
Problem
We have a site that is used predominantly by iPads in the field (not an app, sized for use on iPad) and apparently an update that just came out is causing issues with input. We have an HTML input that used to allow them to select from saved pictures: ``` <input class="fileInput" type="file" name="file" accept="image/*" capture> ``` And now it only opens the camera without an option to use the roll. Is this something someone else has seen? Is there a workaround? Thanks, James