| <!doctype html> |
| <html> |
| <head> |
| <script src="../../resources/js-test.js"></script> |
| <script type="text/javascript"> |
| var formOwner; |
| function hasFormOwner(shouldHaveOwner, haveIt, event) |
| { |
| formOwner = haveIt || "not defined"; |
| debug("Testing " + event.target.tagName); |
| if (shouldHaveOwner) |
| shouldBeEqualToString("formOwner", "defined"); |
| else |
| shouldBeEqualToString("formOwner", "not defined"); |
| } |
| </script> |
| </head> |
| <body> |
| <div style="display: none;"> |
| <form id=topForm> |
| <label form=topForm onerror="" onclick="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"><input type="button"/></label> |
| <!-- Form-associated elements per http://whatwg.org/specs/web-apps/current-work/#form-associated-element --> |
| <button onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"></button> |
| <fieldset onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"></fieldset> |
| <input type=radio onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"/> |
| <input type=number onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"/> |
| <keygen keytype=rsa onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"></keygen> |
| <label onerror="" onclick="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"><input type="button"/></label> |
| <object onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"></object> |
| <select onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"></select> |
| <textarea onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"></textarea> |
| <img onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"></img> |
| |
| <!-- Elements that aren't associated. --> |
| <option onerror="hasFormOwner(false, typeof canary !== 'undefined' && canary, event);"></option> |
| <div onerror="hasFormOwner(false, typeof canary !== 'undefined' && canary, event);"></div> |
| <a onerror="hasFormOwner(false, typeof canary !== 'undefined' && canary, event);"></a> |
| <p onerror="hasFormOwner(false, typeof canary !== 'undefined' && canary, event);"></p> |
| </form> |
| |
| <!-- Elements that associated by 'form' reference rather than ancestor. --> |
| <input form=topForm type="number" onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"/> |
| <keygen form=topForm keytype=rsa onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"></keygen> |
| <object form=topForm onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"></object> |
| <select form=topForm onerror="hasFormOwner(true, typeof canary !== 'undefined' && canary, event);"></select> |
| <pre form=topForm onerror="hasFormOwner(false, typeof canary !== 'undefined' && canary, event);"></pre> |
| <span form=topForm onerror="hasFormOwner(false, typeof canary !== 'undefined' && canary, event);"></span> |
| <img form=topForm onerror="hasFormOwner(false, typeof canary !== 'undefined' && canary, event);"></img> |
| |
| <!-- Elements associated to a unclosed <form> by the HTML parser --> |
| <div id="willBeRemoved"> |
| <div><form id="form2"></div> |
| <input name="input1"> |
| <img name="image1"> |
| </div> |
| <input name="input-in-document"> |
| <select name="select-in-document"></select> |
| <img name="image-in-document"> |
| |
| </div> |
| <script> |
| description("Verify that only elements that are 'form associatable' get a form owner."); |
| |
| var elements; |
| function testFormAssociation() |
| { |
| document.forms[0].canary = "defined"; |
| elements = document.querySelectorAll("*[onerror]"); |
| shouldBeTrue("elements.length > 0"); |
| for (var i = 0; i < elements.length; ++i) { |
| // <label/> won't handle 'error', use 'click'. |
| var eventType = (elements[i] instanceof HTMLLabelElement) ? "click" : "error"; |
| elements[i].dispatchEvent(new MouseEvent(eventType)); |
| } |
| } |
| testFormAssociation(); |
| |
| debug(""); |
| debug("Tests for association-by-parser:"); |
| var form2 = document.querySelector("#form2"); |
| shouldBeDefined("form2['input1']"); |
| shouldBeDefined("form2['image1']"); |
| shouldBeDefined("form2['input-in-document']"); |
| shouldBeDefined("form2['image-in-document']"); |
| var removed = document.querySelector("#willBeRemoved"); |
| removed.parentNode.removeChild(removed); |
| debug("Detach a form, input1 and image1 from the document"); |
| shouldBeDefined("form2['input1']"); |
| shouldBeDefined("form2['image1']"); |
| shouldBeUndefined("form2['input-in-document']"); |
| shouldBeUndefined("form2['image-in-document']"); |
| |
| debug("Association-by-parser should not work for non-Document trees"); |
| removed.innerHTML = "<table><form><tr><td><input><object></object><img name='image4'></td></tr></form>"; |
| shouldBeUndefined("removed.querySelector('form')['image4']"); |
| shouldBeNull("removed.querySelector('input').form"); |
| shouldBeNull("removed.querySelector('object').form"); |
| |
| </script> |
| </body> |
| </html> |