material-web icon indicating copy to clipboard operation
material-web copied to clipboard

Text field type="file" doesn't use the "accept" attribute

Open treeder opened this issue 1 year ago • 5 comments

What is affected?

Component

Description

<md-outlined-text-field id="file"
                                    type="file"
                                    label="KML file"
                                    accept=".kml"
                                    required>

Accept seems to be ignored. It should filter the files in my file chooser based on accept, but it doesn't.

Reproduction

Add type="file" accept=".png" to a text input then click it.

Workaround

Workaround is to not use a material input.

Is this a regression?

No or unsure. This never worked, or I haven't tried before.

Affected versions

1.X

Browser/OS/Node environment

n/a

treeder avatar Oct 02 '23 19:10 treeder

We need to forward that attribute to the <input> (and input only, not the textarea).

Should be fairly simple, could you submit a PR to add it?

asyncLiz avatar Oct 03 '23 16:10 asyncLiz

I actually wonder whether we should be supporting type=file at all in md-textfield. I think this is better suited to a completely new component as you can't style the native textfield button at all.

example:

https://lit.dev/playground/#gist=666dddf85e8adb8f8f3d97e46c80f723

e111077 avatar Oct 04 '23 23:10 e111077

Doesn't look too bad. I think people will expect that this should work? Could also make another file component at a later date too that looks better.

@asyncLiz is there a "getting started" for contributors doc?

treeder avatar Oct 04 '23 23:10 treeder

I actually wonder whether we should be supporting type=file at all

That's a fair point. type=file currently falls under unsupported types, which means pretty basic support.

There's a few more properties we'd likely need to introduce to make it useful too, such as the files and multiple properties.

asyncLiz avatar Oct 05 '23 00:10 asyncLiz

Actually, now that I think about it more, probably nicer looking UI to have a hidden input field for this. So I think I'm agreeing with y'all. :)

Perhaps it should show an error or something if you use type="file" though so people don't get confused (like I did) and think it should work fully when it only works partially.

treeder avatar Oct 05 '23 18:10 treeder