input type=file layout for long filenames (ellipsis / extension)

RESOLVED FIXED

Status

()

enhancement
RESOLVED FIXED
2 years ago
8 months ago

People

(Reporter: karlcow, Assigned: mats)

Tracking

55 Branch
Points:
---
Dependency tree / graph

Firefox Tracking Flags

(Not tracked)

Details

(Whiteboard: [webcompat][fixed by bug 1495153])

Attachments

(1 attachment)

Reporter

Description

2 years ago
I'm just creating this issue as a record of a couple of issues we get in Web Compatibility. 

I created a simple test on
https://codepen.io/webcompat/pen/xdPyrv


The issue is with and long filename which can't fit in the box once selected.

<input type="file">

All browsers have different strategies on desktop with regards to this.

* Firefox (Gecko): 
  - Adds an ellipsis in the middle 
  - Doesn't show the end of the filename
* Safari (WebKit):
  - Adds an ellipsis in the middle
  - Shows the end of the filename WITHOUT the extension
  - Adds an icon relevant to the type of the file
* Chrome (Blink):
  - Adds an ellipisis in the middle
  - Shows the end of the filename WITH the extension

I'm not sure it is something we have to fix, but I would say that Firefox choice is probably the less sensible in terms of UI. Specifically for not showing the end of the filename.


Some of the web compatibility issues.
https://webcompat.com/issues/6435
https://webcompat.com/issues/5620
https://webcompat.com/issues/6764
Reporter

Updated

2 years ago
Whiteboard: [webcompat]

Comment 1

2 years ago
If I may add my 2 cents, FF behavior looks more like a bug than a real feature.

The truncating operation kicks in at what seems to be random range, and the end characters are cut off.

https://i.stack.imgur.com/W2qJj.png

https://jsfiddle.net/532zu6xx/
Assignee

Comment 2

8 months ago
Yes, this was just a bug in Firefox.  It's been fixed in bug 1495153.
Assignee: nobody → mats
Status: NEW → RESOLVED
Closed: 8 months ago
Depends on: 1495153
Resolution: --- → FIXED
Whiteboard: [webcompat] → [webcompat][fixed by bug 1495153]
You need to log in before you can comment on or make changes to this bug.