Page MenuHomePhabricator

Uploading two or more images in IE11 shows same name in UI for first and last image
Closed, ResolvedPublic

Description

When uploading two images with similar name on Commons.wikimedia.org, the software changes the name to the same! See this screendump made during the uploading process. You can see clearly that the images are different, but the names were made the same by the software. The names differed in 1 character (1 and 2)

https://commons.wikimedia.org/wiki/File:Bug_in_upload.png

Event Timeline

Ellywa created this task.Jan 31 2015, 9:19 PM
Ellywa updated the task description. (Show Details)
Ellywa raised the priority of this task from to Normal.
Ellywa added a project: CommonsMetadata.
Ellywa added a subscriber: Ellywa.
Restricted Application added a project: Multimedia. · View Herald TranscriptJan 31 2015, 9:19 PM
Restricted Application added a subscriber: Aklapper. · View Herald Transcript
Reedy set Security to None.
Reedy added a subscriber: Reedy.

What were their original file names?

Reedy removed a subscriber: Reedy.Jan 31 2015, 10:33 PM
Ellywa added a comment.Feb 1 2015, 8:08 AM

the Original filenames were:

Beeld van Westdam Woerden 1.JPG and
Beeld van Westdam Woerden 2.JPG

Elly.

Reedy added a subscriber: Reedy.Feb 1 2015, 12:08 PM

Did the files end up a the correct target file name? Just trying to work out if it's just a visual bug, or there's something more broken

https://commons.wikimedia.org/w/index.php?title=File:Beeld_van_Westdam_Woerden_2.JPG&action=history and https://commons.wikimedia.org/w/index.php?title=File:Beeld_van_Westdam_Woerden_1.JPG&action=history doesn't show any evidence of them being overwritten. Unless they were subsequently deleted and reuploaded

As an aside, if you need to upload screenshots in future, you can add a new "mockup" to phabricator, which leads you to https://phabricator.wikimedia.org/pholio/new/ and then upload the file there, rather than putting them on commons.

I received an error message during the upload and could changes the names by hand in one of the uploading forms. So there is no new version.

It reailly is a bug, I also had bugs when uploading a png and jpg file at the same time.

Please try for yourself, I used IE for uploading.

Sorry for all the mails.... I tried the same again with IE version 11 and with Chrome.

Uploading using Chrome worked correctly, but with IE versieon 11 I got the same error again. So it appears a typical IE bug.

thanks Elly

I received an error message during the upload

Please paste the exact error message.

Please try for yourself, I used IE

No IE available for my operating system... :-/

Aklapper renamed this task from Bug in uploading two images on Commons to Uploading two images in IE11 with similar names on Commons shows same name in UI.Feb 2 2015, 6:21 PM
Tgr added a subscriber: Tgr.Feb 2 2015, 9:42 PM

As an aside, if you need to upload screenshots in future, you can add a new "mockup" to phabricator, which leads you to https://phabricator.wikimedia.org/pholio/new/ and then upload the file there, rather than putting them on commons.

The easy way is to just drag and drop the file into the comment box. That will add it as a file, which has a much simpler UI than a mock. (I think mocks are meant when the image needs to be versioned and/or annotated.)

Tgr added a comment.Feb 2 2015, 9:45 PM

@Ellywa do you happen to remember the order in which you added the files?

Tgr added a comment.Feb 2 2015, 9:50 PM

Title sanitization is done in mw.Title.newFromUserInput but that doesn't mess with numbers. My guess would be that there is some JS error when the wizard processes the second upload so the file name does not get updated.

Ellywa, is there any error message in the browser console? Do you get the error if you rename the second file to something completely different?

I can reproduce this with IE 11 locally. Whenever I try to add two or more files at the same time, the name of the first file will be lost and replaced with the name of the last one. The "middle" files are unaffected. The issue also doesn't appear when adding files one by one.

Restricted Application added subscribers: Steinsplitter, Matanya. · View Herald TranscriptSep 1 2015, 9:53 PM
matmarex renamed this task from Uploading two images in IE11 with similar names on Commons shows same name in UI to Uploading two or more images in IE11 shows same name in UI for first and last image.Sep 1 2015, 10:20 PM
brion added a subscriber: brion.Sep 1 2015, 10:30 PM
matmarex added a comment.EditedSep 1 2015, 11:13 PM

The problem is that in IE 11 (and maybe other versions, I didn't check), given <input type=file multiple />, the node.value of the input is a string with comma-separated file names for each file, rather than the file name of first file, as required by HTML5 spec. As UploadWizard tries to use node.value for the file name of the first file and the newer interface node.files (which functions correctly) only for remaining files (this is attempting to be compatible with legacy browsers), it gets horribly confused. See http://jsfiddle.net/heup0tpk/2/ for demo, explanation and links to relevant spec sections.

Source of http://jsfiddle.net/heup0tpk/2/, for posterity:

<input id="fileinput" type="file" multiple="multiple" />
<p>Choose at least two files. <code>value</code> should reflect the first file name <em>only</em>; further file names should be ignored. On IE 11 (and possibly other versions), it is instead a string with comma-separated file names for each file.</p>
<p>Ref:</p>
<ul>
	<li><a href="http://www.w3.org/html/wg/drafts/html/master/semantics.html#file-upload-state-(type=file)">The value IDL attribute is in mode filename.</a></li>
	<li><a href="http://www.w3.org/html/wg/drafts/html/master/semantics.html#dom-input-value-filename">On getting, it must return the string "C:\fakepath\" followed by the name of the <strong>first file</strong> in the list of selected files, if any, or the empty string if the list is empty.</a></li>
</ul>
<p><code>value</code>: <span id="value"></span></p>
<p>File names:</p>
<ul id="files"></ul>
var input = document.getElementById( 'fileinput' );
var value = document.getElementById( 'value' );
var files = document.getElementById( 'files' );
input.addEventListener( 'change', function () {
    value.textContent = input.value;
    files.textContent = '';
    for ( var i = 0; i < input.files.length; i++ ) {
        var li = document.createElement( 'li' );
        li.textContent = input.files[i].name;
        files.appendChild( li );
    }
}, true );

Change 235377 had a related patch set uploaded (by Bartosz Dziewoński):
Work around <input type=file multiple> having wrong .value on IE 11

https://gerrit.wikimedia.org/r/235377

matmarex claimed this task.Sep 1 2015, 11:22 PM
matmarex updated the task description. (Show Details)Sep 1 2015, 11:27 PM
MarkTraceur closed this task as Resolved.Sep 2 2015, 3:32 PM
MarkTraceur added a subscriber: MarkTraceur.

Merged, should be fixed in production within a week

Change 235377 merged by jenkins-bot:
Work around <input type=file multiple> having wrong .value on IE 11

https://gerrit.wikimedia.org/r/235377

Change 235485 had a related patch set uploaded (by MarkTraceur):
Work around <input type=file multiple> having wrong .value on IE 11

https://gerrit.wikimedia.org/r/235485

Change 235486 had a related patch set uploaded (by MarkTraceur):
Work around <input type=file multiple> having wrong .value on IE 11

https://gerrit.wikimedia.org/r/235486

Change 235485 merged by jenkins-bot:
Work around <input type=file multiple> having wrong .value on IE 11

https://gerrit.wikimedia.org/r/235485

Change 235486 merged by jenkins-bot:
Work around <input type=file multiple> having wrong .value on IE 11

https://gerrit.wikimedia.org/r/235486

Jdforrester-WMF moved this task from Untriaged to Done on the Multimedia board.Sep 11 2015, 6:12 PM