24352 2014-01-22 07:16:28 +0000 Node removal and form association by HTML Parser 2014-01-30 21:51:47 +0000 1 1 1 Unclassified WHATWG HTML unspecified Other other RESOLVED FIXED http://www.whatwg.org/specs/web-apps/current-work/#association-of-controls-and-forms P3 normal Unsorted 1 contributor ian ian mike tkent contributor oldest_to_newest 98865 0 contributor 2014-01-22 07:16:28 +0000 Specification: http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html Multipage: http://www.whatwg.org/C#association-of-controls-and-forms Complete: http://www.whatwg.org/c#association-of-controls-and-forms Referrer: Comment: Node removal and form association by HTML Parser Posted from: 122.216.99.139 User agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_1) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/33.0.1750.29 Safari/537.36 98866 1 tkent 2014-01-22 07:27:07 +0000 I filed this. The specification says: > When an element is removed from a Document resulting in a form-associated > element and its form owner (if any) no longer being in the same home subtree, > then the user agent must reset the form owner of that form-associated element. None of IE11, Firefox 26, WebKit, and Blink follows this. IE11 behavior: When a form-associated element is removed from a Document, the user agent resets the its form owner. Other browsers: When an element is removed from its home subtree resulting in a ... (the rest is same as the spec.) It seems IE11 wants to support non-tree association by HTML parser only in the document tree, and other browser try to support non-tree association by HTML parser in any home subtree. Proposal: Follow IE11 behavior. Test code: </head> <body> <div id=willBeRemoved> <div> <form id=f1> <input id=input-child> <img id=img-child> </div> <input id=input-outer1> <img id=img-outer1> </div> <input id=input-outer2> <img id=img-outer2> <hr > <pre></pre> <script> function $(id) { return document.getElementById(id); } function log(str) { var c = document.querySelector('pre'); c.innerHTML += str + '\n'; console.log(str); } var f1 = document.querySelector('#f1'); var e = f1.elements; for (var i = 0; i < e.length; ++i) { log(i + ': id=' + e[i].id); } log('form[img-child]: ' + f1['img-child']); log('form[img-outer1]: ' + f1['img-outer1']); log('form[img-outer2]: ' + f1['img-outer2']); log('*** Detach an ancestor of the form and *-outer1 ***'); document.body.removeChild($('willBeRemoved')); for (var i = 0; i < e.length; ++i) { log(i + ': id=' + e[i].id); } log('form[img-child]: ' + f1['img-child']); log('form[img-outer1]: ' + f1['img-outer1']); log('form[img-outer2]: ' + f1['img-outer2']); </script> </body> </html> 98869 2 tkent 2014-01-22 08:31:27 +0000 (In reply to Kent Tamura from comment #1) > IE11 behavior: > When a form-associated element is removed from a Document, the user agent > resets the its form owner. Correction: When a form-associated element or its form owner is removed from its home subtree, the user agent resets the form-associated element's form owner. 98872 3 1432 tkent 2014-01-22 08:43:18 +0000 Created attachment 1432 Test case 98916 4 tkent 2014-01-23 00:25:59 +0000 HTMLFormElement::elements implies we keep association-by-parser only in the document tree. http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#dom-form-elements > The elements IDL attribute must return an HTMLFormControlsCollection rooted > at the Document node while the form element is in a Document and rooted at > the form element itself when it is not, So, the IE11 behavior is reasonable. 99216 5 ian 2014-01-27 23:20:58 +0000 I don't understand why the quote in comment 4 implies that. Can you elaborate? 99217 6 ian 2014-01-27 23:25:24 +0000 The idea of the spec as written was that you should be able to move a section of the document to another part of the document, without breaking forms within it. For example: http://software.hixie.ch/utilities/js/live-dom-viewer/saved/2776 The radio buttons keep working as a pair, unrelated to the top one, even after you click the button, meaning they're still in the form, even though the whole subtree has been moved out of the tree and back in elsewhere. 99227 7 tkent 2014-01-28 00:16:47 +0000 (In reply to Ian 'Hixie' Hickson from comment #5) > I don't understand why the quote in comment 4 implies that. Can you > elaborate? "rooted at the form element itself (when it is not in a Document)" means form.elements doesn't contain elements magically associated by HTML parser. If the intention is to keep magical association, we should change the followings. http://www.whatwg.org/specs/web-apps/current-work/multipage/forms.html#dom-form-elements "rooted at form element" -> "rooted at the root element of form's home subtree" (in order to form.elements contains magical associated elements) http://www.whatwg.org/specs/web-apps/current-work/multipage/association-of-controls-and-forms.html "When an element is removed from a Document resulting in a form-associated element and its form owner (if any) no longer being in the same home subtree, ..." -> "When an element is removed from its home subtree resulting ..." (in order to avoid to associate a form and an element in different home subtrees when a subtree not in a Document is separated into two subtrees) 99354 8 ian 2014-01-28 20:35:55 +0000 That's a fair point, I agree that if we keep this association in the orphaned subtree case that we should do that. 99358 9 ian 2014-01-28 21:41:47 +0000 I think we want all three of these cases to keep working, as they do in all the browsers I tested (not IE): http://software.hixie.ch/utilities/js/live-dom-viewer/saved/2780 This suggests that we want to go more towards the other browsers than towards IE. Any opinions? 99374 10 tkent 2014-01-28 23:51:55 +0000 I'm ok to go forward with the keep-magic-association-in-orphan-tree policy. 99502 11 contributor 2014-01-30 21:51:47 +0000 Checked in as WHATWG revision r8446. Check-in comment: Turns out browsers reset the form owner not just when a node is taken from a document, but also when it's taken from a subtree. which makes sense. http://html5.org/tools/web-apps-tracker?from=8445&to=8446 1432 2014-01-22 08:43:18 +0000 2014-01-22 08:43:18 +0000 Test case form-parse2.html text/html 1637 tkent PCFET0NUWVBFIGh0bWw+CjxodG1sPgo8aGVhZD4KPG1ldGEgY2hhcnNldD11dGYtOD4KPG1ldGEg aHR0cC1lcXVpdj0iWC1VQS1Db21wYXRpYmxlIiBjb250ZW50PSJJRT1lZGdlIj4KPC9oZWFkPgo8 Ym9keT4KCjxkaXYgaWQ9d2lsbEJlUmVtb3ZlZD4KPGRpdj4KPGZvcm0gaWQ9ZjE+CjxpbnB1dCBp ZD1pbnB1dC1jaGlsZD4KPGltZyBpZD1pbWctY2hpbGQ+CjwvZGl2Pgo8aW5wdXQgaWQ9aW5wdXQt b3V0ZXIxPgo8aW1nIGlkPWltZy1vdXRlcjE+CjwvZGl2PjwhLS0gd2lsbEJlUmVtb3ZlZCAtLT4K PGlucHV0IGlkPWlucHV0LW91dGVyMj4KPGltZyBpZD1pbWctb3V0ZXIyPgoKPGhyID4KPHByZT48 L3ByZT4KPHNjcmlwdD4KZnVuY3Rpb24gJChpZCkgeyByZXR1cm4gZG9jdW1lbnQuZ2V0RWxlbWVu dEJ5SWQoaWQpOyB9CmZ1bmN0aW9uIGxvZyhzdHIpIHsKICAgIHZhciBjID0gZG9jdW1lbnQucXVl cnlTZWxlY3RvcigncHJlJyk7CiAgICBjLmlubmVySFRNTCArPSBzdHIgKyAnXG4nOwogICAgY29u c29sZS5sb2coc3RyKTsKfQoKbG9nKCcqKiogQ2hlY2sgaWYgYWxsIG9mIGZvcm0tYXNzb2NpYXRl ZCBlbGVtZW50cyBhcmUgb3duZWQgYnkgZjEnKTsKdmFyIGYxID0gZG9jdW1lbnQucXVlcnlTZWxl Y3RvcignI2YxJyk7CnZhciBlID0gZjEuZWxlbWVudHM7CmZvciAodmFyIGkgPSAwOyBpIDwgZS5s ZW5ndGg7ICsraSkgewogICAgbG9nKGkgKyAnOiBpZD0nICsgZVtpXS5pZCk7Cn0KCi8vbG9nKCdm b3JtW2ltZy1jaGlsZF06ICcgKyBmMVsnaW1nLWNoaWxkJ10pOwovL2xvZygnZm9ybVtpbWctb3V0 ZXIxXTogJyArIGYxWydpbWctb3V0ZXIxJ10pOwovL2xvZygnZm9ybVtpbWctb3V0ZXIyXTogJyAr IGYxWydpbWctb3V0ZXIyJ10pOwoKbG9nKCcqKiogRGV0YWNoIGFuIGFuY2VzdG9yIG9mIHRoZSBm b3JtIGFuZCAqLW91dGVyMS4gV2hhdCBoYXBwZW5zIHdpdGggaW5wdXQtb3V0ZXIxPycpOwpkb2N1 bWVudC5ib2R5LnJlbW92ZUNoaWxkKCQoJ3dpbGxCZVJlbW92ZWQnKSk7Ci8vIElFMTEgZG9lc24n dCBzaG93IGlucHV0LW91dGVyMSB0aG91Z2ggb3RoZXIgYnJvd3NlcnMgc2hvdyBpdC4KZm9yICh2 YXIgaSA9IDA7IGkgPCBlLmxlbmd0aDsgKytpKSB7CiAgICBsb2coaSArICc6IGlkPScgKyBlW2ld LmlkKTsKfQovL2xvZygnZm9ybVtpbWctY2hpbGRdOiAnICsgZjFbJ2ltZy1jaGlsZCddKTsKLy9s b2coJ2Zvcm1baW1nLW91dGVyMV06ICcgKyBmMVsnaW1nLW91dGVyMSddKTsKLy9sb2coJ2Zvcm1b aW1nLW91dGVyMl06ICcgKyBmMVsnaW1nLW91dGVyMiddKTsKCmxvZygnKioqIERldGFjaCBhIGZv cm0tYXNzb2NpYXRlZCBlbGVtZW50IGZyb20gaXRzIGhvbWUgc3VidHJlZSAobm90IGRvY3VtZW50 KScpOwp2YXIgaW5wdXRDaGlsZCA9IGYxLnF1ZXJ5U2VsZWN0b3IoJ2lucHV0Jyk7CmYxLnJlbW92 ZUNoaWxkKGlucHV0Q2hpbGQpOwovLyBBY2NvcmRpbmcgdG8gdGhlIHN0YW5kYXJkLCB3ZSBzaG91 bGQgbm90IHJlc2V0IHdoZW4gYSBmb3JtLWFzc29jaWF0ZWQgZWxlbWVudCBpcyByZW1vdmVkIGZy b20gbm9uLWRvY3VtZW50IHRyZWUuCmxvZygnaW5wdXQtY2hpbGRcJ3Mgb3duZXI6ICcgKyBpbnB1 dENoaWxkLmZvcm0pOwoKPC9zY3JpcHQ+CjwvYm9keT4KPC9odG1sPgo=