Make cloneNode() copy files of <input type=file> 
https://bugs.webkit.org/show_bug.cgi?id=28123
Summary Make cloneNode() copy files of <input type=file>
Mikhail
Reported 2009-08-09 05:11:20 PDT
The code below In browsers based on WebKit, could not clone form (formObj) with param's. In the form on the site if selected file. Then I copy the form with this parameter in the iframe, and then I do have a request, for download the file in the background. But this don't work in WebKit (Safari and Google Crome) function createIFrame() { var id = 'f' + Math.floor(Math.random() * 99999); var div = document.createElement('div'); div.innerHTML = '<iframe src="about:blank" id="'+id+'" name="'+id+'" onload="sendComplete(this)"></iframe>'; document.body.appendChild(div); return document.getElementById(id); } function AJAXRequest2 (formObj) ( var iframe = createIFrame (); var idocument = window.frames [iframe.id]. document; var iform = idocument.importNode (formObj, true); var ibody = idocument.getElementsByTagName ( "body") [0]; ibody.appendChild (iform); idocument.getElementById ( 'ttt'). click (); )
Attachments
reduction (444 bytes, text/html)
2009-08-10 22:40 PDT, Alexey Proskuryakov 		no flags
Details
View All Add attachment proposed patch, testcase, etc.
Alexey Proskuryakov
Comment 1 2009-08-10 13:39:24 PDT
Would it be possible for you to attach a complete test case showing the problem?
Mikhail
Comment 2 2009-08-10 18:51:43 PDT
Please create two files: index.html <html> <head> <script language="javascript"> function init() { var formObj = document.getElementById('fff'); formObj.onclick = ajaxsubmit; } function createIFrame() { var id = 'f' + Math.floor(Math.random() * 99999); var div = document.createElement('div'); div.innerHTML = '<iframe src="about:blank" id="'+id+'" name="'+id+'" onload="sendComplete(this)"></iframe>'; document.body.appendChild(div); 'idElement' ); return document.getElementById(id); } function AJAXRequest(url, param, formObj) { var iframe = createIFrame(); formObj.target = iframe.id; alert('Запрос 1 готов'); } function AJAXRequest2(url, param, formObj) { var iframe = createIFrame(); ).contentWindow.document.getElementById( 'idElement' ) var idocument = iframe.contentWindow.document; var iform = idocument.importNode(formObj, true); var ibody = idocument.getElementsByTagName("body")[0]; ibody.appendChild(iform); alert('Запрос 2 готов'); idocument.getElementById('ttt').click(); } function ajaxsubmit(event) { event = event || window.event; var oSubmit = event.target || event.srcElement; if (oSubmit.type != 'submit') return; // window.location.hash = this.action.replace(/^.*?\?/,'#'); if (oSubmit.name == 'submit1') AJAXRequest(this.action, oSubmit.name + "=" + encodeURI(oSubmit.value), this); else { AJAXRequest2(this.action, oSubmit.name + "=" + encodeURI(oSubmit.value), this); return false; } }; function killform() { var divObj = document.getElementById('ccc'); divObj.innerHTML = 'Все!'; } </script> </head> <body onload = "init()"> <div id="ccc"> <form id="fff" name="myForm" action="upload.php" method="post" enctype="multipart/form-data"> <input type='file' name='file'/> <input type='text' name='text' value='test string'/> <input id='tt1' type='submit' name='submit1' value='upload method 1'/> <input id='ttt' type='submit' name='submit2' value='upload method 2'/> </form> </div> <input type="button" value="Kill form" onclick="killform();"/> </body> </html> and upload.php <?php print_r($_FILES); print_r($_POST); ?> When used 'upload method 2' parameter tag "input type='file'" not imported to iframe. In Opera and Mozilla both method worked.
Mikhail
Comment 3 2009-08-10 19:00:00 PDT
Sorry in function AJAXRequest2 when copied got extra row ").contentWindow.document.getElementById( 'idElement' )" please remove it before test.
Alexey Proskuryakov
Comment 4 2009-08-10 22:40:25 PDT
Created attachment 34541 [details] reduction OK, I think that this is a reduction of the issue at hand.
Patrick Strateman
Comment 5 2010-01-21 14:55:56 PST
This bug is actually fairly straight forward. The importNode code uses the standard functions for changing the value of an element, it's almost identical to if you tried to change it using javascript, except you're not allowed to change it from javascript to anything but an empty string.
Ridley Combs
Comment 6 2011-05-14 10:49:03 PDT
I'll confirm that the same thing is true when using cloneNode within the same document.
Ahmad Saleem
Comment 7 2022-09-03 07:31:42 PDT
I am able to reproduce this bug in Safari Technology Preview 152 using attached reduction, when trying to link any file for upload, it does not show "same" file as attached in the iframe but Chrome Canary 107 and Firefox Nightly 106 do replicate and upload the file also reflect same in iframe. Thanks!
Radar WebKit Bug Importer
Comment 8 2022-09-03 09:50:53 PDT
<rdar://problem/99527194>
Ahmad Saleem
Comment 9 2022-11-22 16:06:48 PST
Hi Team, Just wanted to post that I tried to merge Chrome / Blink patch to fix this bug in following PR: https://github.com/WebKit/WebKit/pull/5755 But I think I am not able to define the output of "Clone" function (sourceList->item(i)->clone()) as rniwa mentioned in following: Source/WebCore/fileapi/File.h and then return value of itself. So I would leave it for someone else to take it up. Thanks!
Anne van Kesteren
Comment 10 2023-08-26 01:26:59 PDT
It seems this is not covered by the HTML Standard at the moment, but Chromium and Gecko indeed implement it. I filed https://github.com/whatwg/html/issues/9638 to get that sorted.
Note You need to log in before you can comment on or make changes to this bug.