test_output_element.html 5.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183
  1. <!DOCTYPE HTML>
  2. <html>
  3. <!--
  4. https://bugzilla.mozilla.org/show_bug.cgi?id=346485
  5. -->
  6. <head>
  7. <title>Test for Bug 346485</title>
  8. <script type="application/javascript" src="/tests/SimpleTest/SimpleTest.js"></script>
  9. <script type="application/javascript" src="../reflect.js"></script>
  10. <link rel="stylesheet" type="text/css" href="/tests/SimpleTest/test.css"/>
  11. <script type="application/javascript">
  12. frameLoaded = function() {
  13. is(frames['submit_frame'].location.href, "about:blank",
  14. "Blank frame loaded");
  15. }
  16. </script>
  17. </head>
  18. <body>
  19. <a target="_blank" href="https://bugzilla.mozilla.org/show_bug.cgi?id=346485">Mozilla Bug 346485</a>
  20. <p id="display"></p>
  21. <iframe name="submit_frame" onload="frameLoaded()" style="visibility: hidden;"></iframe>
  22. <div id="content" style="display: none">
  23. <form id='f' method='get' target='submit_frame' action='foo'>
  24. <input name='a' id='a'>
  25. <input name='b' id='b'>
  26. <output id='o' for='a b' name='output-name'>tulip</output>
  27. </form>
  28. </div>
  29. <pre id="test">
  30. <script type="application/javascript">
  31. /** Test for Bug 346485 **/
  32. function checkNameAttribute(element)
  33. {
  34. is(element.name, "output-name", "Output name IDL attribute is not correct");
  35. is(element.getAttribute('name'), "output-name",
  36. "Output name content attribute is not correct");
  37. }
  38. function checkValueAndDefaultValueIDLAttribute(element)
  39. {
  40. is(element.value, element.textContent,
  41. "The value IDL attribute should act like the textContent IDL attribute");
  42. element.value = "foo";
  43. is(element.value, "foo", "Value should be 'foo'");
  44. is(element.defaultValue, "", "Default defaultValue is ''");
  45. element.defaultValue = "bar";
  46. is(element.defaultValue, "bar", "defaultValue should be 'bar'");
  47. // More complex situation.
  48. element.textContent = 'foo';
  49. var b = document.createElement('b');
  50. b.textContent = 'bar'
  51. element.appendChild(b);
  52. is(element.value, element.textContent,
  53. "The value IDL attribute should act like the textContent IDL attribute");
  54. }
  55. function checkValueModeFlag(element)
  56. {
  57. /**
  58. * The value mode flag is the flag used to know if value should represent the
  59. * textContent or the default value.
  60. */
  61. // value mode flag should be 'value'
  62. isnot(element.defaultValue, element.value,
  63. "When value is set, defaultValue keeps its value");
  64. var f = document.getElementById('f');
  65. f.reset();
  66. // value mode flag should be 'default'
  67. is(element.defaultValue, element.value, "When reset, defaultValue=value");
  68. is(element.textContent, element.defaultValue,
  69. "textContent should contain the defaultValue");
  70. }
  71. function checkDescendantChanged(element)
  72. {
  73. /**
  74. * Whenever a descendant is changed if the value mode flag is value,
  75. * the default value should be the textContent value.
  76. */
  77. element.defaultValue = 'tulip';
  78. element.value = 'foo';
  79. // set value mode flag to 'default'
  80. var f = document.getElementById('f');
  81. f.reset();
  82. is(element.textContent, element.defaultValue,
  83. "textContent should contain the defaultValue");
  84. element.textContent = "bar";
  85. is(element.textContent, element.defaultValue,
  86. "textContent should contain the defaultValue");
  87. }
  88. function checkFormIDLAttribute(element)
  89. {
  90. is(element.form, document.getElementById('f'),
  91. "form IDL attribute is invalid");
  92. }
  93. function checkHtmlForIDLAttribute(element)
  94. {
  95. is(String(element.htmlFor), 'a b',
  96. "htmlFor IDL attribute should reflect the for content attribute");
  97. // DOMTokenList is tested in another bug so we just test assignation
  98. element.htmlFor.value = 'a b c';
  99. is(String(element.htmlFor), 'a b c', "htmlFor should have changed");
  100. }
  101. function submitForm()
  102. {
  103. // Setting the values for the submit.
  104. document.getElementById('o').value = 'foo';
  105. document.getElementById('a').value = 'afield';
  106. document.getElementById('b').value = 'bfield';
  107. frameLoaded = checkFormSubmission;
  108. // This will call checkFormSubmission() which is going to call ST.finish().
  109. document.getElementById('f').submit();
  110. }
  111. function checkFormSubmission()
  112. {
  113. /**
  114. * All elements values have been set just before the submission.
  115. * The input elements values should be in the submit url but the ouput
  116. * element value should not appear.
  117. */
  118. is(frames['submit_frame'].location.href,
  119. 'http://mochi.test:8888/tests/dom/html/test/forms/foo?a=afield&b=bfield',
  120. "The output element value should not be submitted");
  121. SimpleTest.finish();
  122. }
  123. SimpleTest.waitForExplicitFinish();
  124. addLoadEvent(function() {
  125. reflectString({
  126. element: document.createElement("output"),
  127. attribute: "name",
  128. });
  129. var o = document.getElementsByTagName('output');
  130. is(o.length, 1, "There should be one output element");
  131. o = o[0];
  132. ok(o instanceof HTMLOutputElement,
  133. "The output should be instance of HTMLOutputElement");
  134. o = document.getElementById('o');
  135. ok(o instanceof HTMLOutputElement,
  136. "The output should be instance of HTMLOutputElement");
  137. is(o.type, "output", "Output type IDL attribute should be 'output'");
  138. checkNameAttribute(o);
  139. checkValueAndDefaultValueIDLAttribute(o);
  140. checkValueModeFlag(o);
  141. checkDescendantChanged(o);
  142. checkFormIDLAttribute(o);
  143. checkHtmlForIDLAttribute(o);
  144. submitForm();
  145. });
  146. </script>
  147. </pre>
  148. </body>
  149. </html>