test-console-output-dom-elements.html 2.3 KB

1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677787980818283848586878889909192
  1. <!DOCTYPE HTML>
  2. <html dir="ltr" lang="en-US">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>Test the web console output - dom elements</title>
  6. <!--
  7. - Any copyright is dedicated to the Public Domain.
  8. - http://creativecommons.org/publicdomain/zero/1.0/
  9. -->
  10. </head>
  11. <body class="body-class" id="body-id">
  12. <p some-attribute="some-value">hello world!</p>
  13. <p id="lots-of-attributes" a b c d e f g h i j k l m n></p>
  14. <!--
  15. Be sure we have a charset in our iframe's data URI, otherwise we get the following extra
  16. console output message:
  17. "The character encoding of a framed document was not declared. The document may appear different if viewed without the document framing it."
  18. This wouldn't be a big deal, but when we look for a "<p>" in our `waitForMessage` helper,
  19. this extra encoding warning line contains the data URI source, returning a message
  20. that was unexpected
  21. -->
  22. <iframe src="data:text/html;charset=US-ASCII,<p>hello from iframe</p>"></iframe>
  23. <div class="some classname here with more classnames here"></div>
  24. <svg>
  25. <clipPath>
  26. <rect x="0" y="0" width="10" height="5"></rect>
  27. </clipPath>
  28. </svg>
  29. <script type="text/javascript">
  30. function testBodyNode() {
  31. return document.body;
  32. }
  33. function testDocumentElement() {
  34. return document.documentElement;
  35. }
  36. function testLotsOfAttributes() {
  37. return document.querySelector("#lots-of-attributes");
  38. }
  39. function testDocument() {
  40. return document;
  41. }
  42. function testNode() {
  43. return document.querySelector("p");
  44. }
  45. function testSvgNode() {
  46. return document.querySelector("clipPath");
  47. }
  48. function testNodeList() {
  49. return document.querySelectorAll("body *");
  50. }
  51. function testNodeInIframe() {
  52. return document.querySelector("iframe").contentWindow.document.querySelector("p");
  53. }
  54. function testDocumentFragment() {
  55. var frag = document.createDocumentFragment();
  56. var span = document.createElement("span");
  57. span.className = 'foo';
  58. span.dataset.lolz = 'hehe';
  59. var div = document.createElement('div')
  60. div.id = 'fragdiv';
  61. frag.appendChild(span);
  62. frag.appendChild(div);
  63. return frag;
  64. }
  65. function testNodeInDocumentFragment() {
  66. var frag = testDocumentFragment();
  67. return frag.firstChild;
  68. }
  69. function testUnattachedNode() {
  70. var p = document.createElement("p");
  71. p.className = "such-class";
  72. p.dataset.data = "such-data";
  73. return p;
  74. }
  75. </script>
  76. </body>
  77. </html>