[whatwg] Directory upload via <input type="file" directory>

John Gregg johnnyg at google.com
Thu Apr 22 15:37:32 PDT 2010

The use case is not about choosing a directory for some browser
functionality, it is really about choosing a directory that you want
to upload to a web page, such as a collection of photo albums.


>From Ian Fette's original email

Many sites allow you to upload multiple files, often images. HTML5 allows
this via <input type="file" multiple>. This works well when your files are
all in one folder, but it may often be the case that files are spread across
sub-folders, and in this case you have to do multiple transactions (or
multiple <input type=file multiple> tags, which is just awkward) to upload
your files.

On Thu, Apr 22, 2010 at 3:33 PM, Jonas Sicking <jonas at sicking.cc> wrote:
> I still don't understand the use case.
> In all cases I can think of where applications allow me to pick a
> folder (as opposed to a file), it's always been about choosing a
> location to save files. For example choosing where to put the browsers
> cache, or which should be the default download directory.
> Is that the use case? If so, it doesn't seem like <input type=file> is
> even close to what you want.
> / Jonas
> On Thu, Apr 22, 2010 at 3:15 PM, John Gregg <johnnyg at google.com> wrote:
>> So are you suggesting an input element that accepts directories
>> dragged onto it, but has no way of choosing a directory through a
>> system dialog?
>>  -John
>> On Thu, Apr 22, 2010 at 3:11 PM, Ojan Vafai <ojan at chromium.org> wrote:
>>> But there is already a default UI that lets you select a folder, a file or
>>> both (drag-drop). I don't see why this forces the UA to do anything. Just
>>> because you can select both folders and files doesn't mean the UA needs to
>>> expose extra UI on top of drag-drop to let you do so. Again, no more so than
>>> they already have to expose extra UI to deal with multiple inputs.
>>> Ojan
>>> On Tue, Apr 6, 2010 at 2:28 PM, John Gregg <johnnyg at google.com> wrote:
>>>> The most relevant issue is that in Windows/Mac/Linux, there are no system
>>>> dialogs that let the user select either a folder or a file.  They each have
>>>> separate "choose a file" and "choose a folder" dialogs.  I think the logical
>>>> reason for that is that when selecting a file, clicking a directory means to
>>>> enter that directory and select from its files, not to choose that directory
>>>> as the result of selection.
>>>> Thus we would force UAs to reinvent file-picker interfaces in order to
>>>> deal with an input element that allows both folders and files.
>>>>  -John
>>>> On Tue, Apr 6, 2010 at 2:18 PM, Ojan Vafai <ojan at chromium.org> wrote:
>>>>> It's unfortunate that users need to distinguish between single and
>>>>> multiple file inputs. That's not something we can change at this point. The
>>>>> web started with single file inputs. We can avoid adding a third type of
>>>>> file input they need to understand though.
>>>>> Also, what should happen if you drag files and folders onto a "multiple"
>>>>> or "directory" input? Just drop the ones that are of the wrong type? I
>>>>> cannot imagine users making sense of that.
>>>>> It's not clear to me from your original email what issues you encountered
>>>>> during implementation that led to this proposal. Is it just the leaf name
>>>>> conflict issue? I agree that's a problem, but maybe there's a different
>>>>> solution to that?
>>>>> Ojan
>>>>> On Tue, Apr 6, 2010 at 12:53 PM, John Gregg <johnnyg at google.com> wrote:
>>>>>> That's a fair question, but how is it clear today whether an input can
>>>>>> accept multiple files vs. a single file using drag-and-drop?  Currently if I
>>>>>> drag multiple files onto an input that doesn't have 'multiple', I get only
>>>>>> the first one.  (In Chrome.)
>>>>>> Some good default text from the UA, like "Choose folder..." instead of
>>>>>> "Choose file...", would go far to solve that, I think.
>>>>>>  -John
>>>>>> On Tue, Apr 6, 2010 at 12:38 PM, Ojan Vafai <ojan at chromium.org> wrote:
>>>>>>> What about drag-drop? I should be able to drag a directory, a file, or
>>>>>>> a list of files onto an input, no? If not, how is this distinction shown to
>>>>>>> users? How will it be clear to users when they can do one or the other?
>>>>>>> Ojan
>>>>>>> On Thu, Apr 1, 2010 at 3:53 PM, John Gregg <johnnyg at google.com> wrote:
>>>>>>>> For context, Ian Fette started a thread about uploading directories of
>>>>>>>> files in
>>>>>>>> December: http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2009-December/024455.html
>>>>>>>> At that time, it was thought that directory upload could be
>>>>>>>> implemented by a UA in response to a <input type="file" multiple> tag using
>>>>>>>> different UI only, and modifying the FileAPI spec to allow path information
>>>>>>>> in the form
>>>>>>>> input.files[0].name="1.jpg"
>>>>>>>> input.files[0].path="a"
>>>>>>>> input.files[1].name="2.jpg"
>>>>>>>> input.files[1].path="a/b"
>>>>>>>> input.files[2].name="3.jpg"
>>>>>>>> input.files[2].path="a/c"
>>>>>>>> I've started developing a prototype of this in WebKit/Chromium.  Based
>>>>>>>> on what I've encountered so far, I would like to propose adding directory
>>>>>>>> upload functionality using an explicit new 'directory' attribute on the file
>>>>>>>> input element.
>>>>>>>> The existing behavior of <input type="file" multiple> would not
>>>>>>>> change, but when processing <input type="file" directory>, the UA would
>>>>>>>> display a directory selection UI and store the path information, and not
>>>>>>>> allow individual files to be selected.  It would allow multiple files to
>>>>>>>> have the same leaf name (.name attribute), as long as the paths were
>>>>>>>> different.  The path attributes would include the name of the chosen
>>>>>>>> directory
>>>>>>>> This would be preferable for several reasons:
>>>>>>>>  - Most built-in file system UI on major platforms (Windows/Mac/Linux)
>>>>>>>> have distinct dialogs for choosing files and choosing directories.  Allowing
>>>>>>>> the UA to use these directly makes sense rather than creating hybrids.
>>>>>>>>  - Avoiding "leaf name" conflicts in a directory tree is not feasible
>>>>>>>> in many applications -- asking a user to ensure unique photo names in a
>>>>>>>> large set of albums before uploading would fail to meet that use case.
>>>>>>>>  Therefore HTML documents should know in advance whether the path
>>>>>>>> information will be relevant in the eventual storage of the files.  Sites
>>>>>>>> currently using <input type="file" multiple> would have compatibility
>>>>>>>> problems with an implementation which allowed conflicting file names along
>>>>>>>> different paths.
>>>>>>>> What are your thoughts about adding the 'directory' attribute?
>>>>>>>> Thanks,
>>>>>>>>  -John

More information about the whatwg mailing list