| <!DOCTYPE html> |
| <html> |
| <head> |
| <script src="../../resources/js-test-pre.js"></script> |
| </head> |
| <body> |
| <p id="description"></p> |
| <div id="console"></div> |
| <script> |
| description("This test examines the order of form associated elements which are classified as 'listed'."); |
| |
| var container = document.createElement('div'); |
| document.body.appendChild(container); |
| var owner; |
| |
| function checkOrder(victims) { |
| if (owner.elements.length != victims.length) |
| return 'length mismatch, elements.length = ' + owner.elements.length + |
| ', expected length = ' + victims.length; |
| for (var i = 0; i < victims.length; ++i) |
| if (owner.elements[i] != victims[i]) |
| return 'element mismatch at index ' + i; |
| return 'OK'; |
| } |
| |
| debug('- Checks the order of form associated elements.'); |
| container.innerHTML = '<form id=owner>' + |
| '<button name=victim></button>' + |
| '<fieldset name=victim>Test</fieldset>' + |
| '<input name=victim/>' + |
| '<keygen name=victim></keygen>' + |
| '<label name=victim></label>' + |
| '<meter name=victim></meter>' + |
| '<object name=victim></object>' + |
| '<output name=victim></output>' + |
| '<progress name=victim></progress>' + |
| '<select name=victim></select>' + |
| '<textarea name=victim></textarea>'+ |
| '</form>'; |
| owner = document.getElementById('owner'); |
| var button = document.getElementsByTagName('button')[0]; |
| var fieldset = document.getElementsByTagName('fieldset')[0]; |
| var input = document.getElementsByTagName('input')[0]; |
| var keygen = document.getElementsByTagName('keygen')[0]; |
| var label = document.getElementsByTagName('label')[0]; |
| var meter = document.getElementsByTagName('meter')[0]; |
| var object = document.getElementsByTagName('object')[0]; |
| var output = document.getElementsByTagName('output')[0]; |
| var progress = document.getElementsByTagName('progress')[0]; |
| var select = document.getElementsByTagName('select')[0]; |
| var textarea = document.getElementsByTagName('textarea')[0]; |
| shouldBe('checkOrder([button, fieldset, input, object, output, select, textarea])', '"OK"'); |
| |
| debug(''); |
| debug('- Checks the order after some elements removed/inserted.'); |
| owner.removeChild(object); |
| shouldBe('checkOrder([button, fieldset, input, output, select, textarea])', '"OK"'); |
| owner.removeChild(button); |
| shouldBe('checkOrder([fieldset, input, output, select, textarea])', '"OK"'); |
| owner.insertBefore(object, fieldset); |
| shouldBe('checkOrder([object, fieldset, input, output, select, textarea])', '"OK"'); |
| owner.appendChild(button); |
| shouldBe('checkOrder([object, fieldset, input, output, select, textarea, button])', '"OK"'); |
| |
| debug(''); |
| debug('- Checks the order of form associated elements with form attribute.'); |
| container.innerHTML = '<button name=victim form=owner></button>' + |
| '<fieldset name=victim form=owner>Test</fieldset>' + |
| '<input name=victim form=owner />' + |
| '<keygen name=victim form=owner></keygen>' + |
| '<form id=owner>' + |
| '<label name=victim></label>' + |
| '<meter name=victim></meter>' + |
| '<object name=victim></object>' + |
| '</form>' + |
| '<output name=victim form=owner></output>' + |
| '<progress name=victim form=owner></progress>' + |
| '<select name=victim form=owner></select>' + |
| '<textarea name=victim form=owner></textarea>'; |
| owner = document.getElementById('owner'); |
| button = document.getElementsByTagName('button')[0]; |
| fieldset = document.getElementsByTagName('fieldset')[0]; |
| input = document.getElementsByTagName('input')[0]; |
| keygen = document.getElementsByTagName('keygen')[0]; |
| label = document.getElementsByTagName('label')[0]; |
| meter = document.getElementsByTagName('meter')[0]; |
| object = document.getElementsByTagName('object')[0]; |
| output = document.getElementsByTagName('output')[0]; |
| progress = document.getElementsByTagName('progress')[0]; |
| select = document.getElementsByTagName('select')[0]; |
| textarea = document.getElementsByTagName('textarea')[0]; |
| shouldBe('checkOrder([button, fieldset, input, object, output, select, textarea])', '"OK"'); |
| |
| debug(''); |
| debug('- Checks the order after some elements removed/inserted with form attribute.'); |
| owner.removeChild(object); |
| shouldBe('checkOrder([button, fieldset, input, output, select, textarea])', '"OK"'); |
| container.removeChild(button); |
| shouldBe('checkOrder([fieldset, input, output, select, textarea])', '"OK"'); |
| container.removeChild(textarea); |
| shouldBe('checkOrder([fieldset, input, output, select])', '"OK"'); |
| owner.appendChild(object); |
| shouldBe('checkOrder([fieldset, input, object, output, select])', '"OK"'); |
| container.insertBefore(textarea, fieldset); |
| shouldBe('checkOrder([textarea, fieldset, input, object, output, select])', '"OK"'); |
| container.appendChild(button); |
| shouldBe('checkOrder([textarea, fieldset, input, object, output, select, button])', '"OK"'); |
| </script> |
| <script src="../../resources/js-test-post.js"></script> |
| </body> |
| </html> |