selector.js 7.8 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172
  1. module("selector", { teardown: moduleTeardown });
  2. /**
  3. * This test page is for selector tests that require jQuery in order to do the selection
  4. */
  5. test("element - jQuery only", function() {
  6. expect( 7 );
  7. var fixture = document.getElementById("qunit-fixture");
  8. deepEqual( jQuery("p", fixture).get(), q("firstp","ap","sndp","en","sap","first"), "Finding elements with a Node context." );
  9. deepEqual( jQuery("p", "#qunit-fixture").get(), q("firstp","ap","sndp","en","sap","first"), "Finding elements with a selector context." );
  10. deepEqual( jQuery("p", jQuery("#qunit-fixture")).get(), q("firstp","ap","sndp","en","sap","first"), "Finding elements with a jQuery object context." );
  11. deepEqual( jQuery("#qunit-fixture").find("p").get(), q("firstp","ap","sndp","en","sap","first"), "Finding elements with a context via .find()." );
  12. ok( jQuery("#length").length, "<input name=\"length\"> cannot be found under IE, see #945" );
  13. ok( jQuery("#lengthtest input").length, "<input name=\"length\"> cannot be found under IE, see #945" );
  14. // #7533
  15. equal( jQuery("<div id=\"A'B~C.D[E]\"><p>foo</p></div>").find("p").length, 1, "Find where context root is a node and has an ID with CSS3 meta characters" );
  16. });
  17. test("class - jQuery only", function() {
  18. expect( 4 );
  19. deepEqual( jQuery(".blog", document.getElementsByTagName("p")).get(), q("mark", "simon"), "Finding elements with a context." );
  20. deepEqual( jQuery(".blog", "p").get(), q("mark", "simon"), "Finding elements with a context." );
  21. deepEqual( jQuery(".blog", jQuery("p")).get(), q("mark", "simon"), "Finding elements with a context." );
  22. deepEqual( jQuery("p").find(".blog").get(), q("mark", "simon"), "Finding elements with a context." );
  23. });
  24. test("attributes - jQuery only", function() {
  25. expect( 5 );
  26. t( "Find elements with a tabindex attribute", "[tabindex]", ["listWithTabIndex", "foodWithNegativeTabIndex", "linkWithTabIndex", "linkWithNegativeTabIndex", "linkWithNoHrefWithTabIndex", "linkWithNoHrefWithNegativeTabIndex"] );
  27. // #12600
  28. ok(
  29. jQuery("<select value='12600'><option value='option' selected='selected'></option><option value=''></option></select>")
  30. .prop( "value", "option" )
  31. .is(":input[value='12600']"),
  32. ":input[value=foo] selects select by attribute"
  33. );
  34. ok( jQuery("<input type='text' value='12600'/>").prop( "value", "option" ).is(":input[value='12600']"),
  35. ":input[value=foo] selects text input by attribute"
  36. );
  37. // #11115
  38. ok( jQuery("<input type='checkbox' checked='checked'/>").prop( "checked", false ).is("[checked]"),
  39. "[checked] selects by attribute (positive)"
  40. );
  41. ok( !jQuery("<input type='checkbox'/>").prop( "checked", true ).is("[checked]"),
  42. "[checked] selects by attribute (negative)"
  43. );
  44. });
  45. test("disconnected nodes", function() {
  46. expect( 1 );
  47. var $div = jQuery("<div/>");
  48. equal( $div.is("div"), true, "Make sure .is('nodeName') works on disconnected nodes." );
  49. });
  50. test("disconnected nodes - jQuery only", function() {
  51. expect( 3 );
  52. var $opt = jQuery("<option></option>").attr("value", "whipit").appendTo("#qunit-fixture").detach();
  53. equal( $opt.val(), "whipit", "option value" );
  54. equal( $opt.is(":selected"), false, "unselected option" );
  55. $opt.prop("selected", true);
  56. equal( $opt.is(":selected"), true, "selected option" );
  57. });
  58. testIframe("selector/html5_selector", "attributes - jQuery.attr", function( jQuery, window, document ) {
  59. expect( 35 );
  60. /**
  61. * Returns an array of elements with the given IDs
  62. * q & t are added here for the iFrame's context
  63. */
  64. function q() {
  65. var r = [],
  66. i = 0;
  67. for ( ; i < arguments.length; i++ ) {
  68. r.push( document.getElementById( arguments[i] ) );
  69. }
  70. return r;
  71. }
  72. /**
  73. * Asserts that a select matches the given IDs
  74. * @example t("Check for something", "//[a]", ["foo", "baar"]);
  75. * @param {String} a - Assertion name
  76. * @param {String} b - Sizzle selector
  77. * @param {Array} c - Array of ids to construct what is expected
  78. */
  79. function t( a, b, c ) {
  80. var f = jQuery(b).get(),
  81. s = "",
  82. i = 0;
  83. for ( ; i < f.length; i++ ) {
  84. s += (s && ",") + "'" + f[i].id + "'";
  85. }
  86. deepEqual(f, q.apply( q, c ), a + " (" + b + ")");
  87. }
  88. // ====== All known boolean attributes, including html5 booleans ======
  89. // autobuffer, autofocus, autoplay, async, checked,
  90. // compact, controls, declare, defer, disabled,
  91. // formnovalidate, hidden, indeterminate (property only),
  92. // ismap, itemscope, loop, multiple, muted, nohref, noresize,
  93. // noshade, nowrap, novalidate, open, pubdate, readonly, required,
  94. // reversed, scoped, seamless, selected, truespeed, visible (skipping visible attribute, which is on a barprop object)
  95. t( "Attribute Exists", "[autobuffer]", ["video1"]);
  96. t( "Attribute Exists", "[autofocus]", ["text1"]);
  97. t( "Attribute Exists", "[autoplay]", ["video1"]);
  98. t( "Attribute Exists", "[async]", ["script1"]);
  99. t( "Attribute Exists", "[checked]", ["check1"]);
  100. t( "Attribute Exists", "[compact]", ["dl"]);
  101. t( "Attribute Exists", "[controls]", ["video1"]);
  102. t( "Attribute Exists", "[declare]", ["object1"]);
  103. t( "Attribute Exists", "[defer]", ["script1"]);
  104. t( "Attribute Exists", "[disabled]", ["check1"]);
  105. t( "Attribute Exists", "[formnovalidate]", ["form1"]);
  106. t( "Attribute Exists", "[hidden]", ["div1"]);
  107. t( "Attribute Exists", "[indeterminate]", []);
  108. t( "Attribute Exists", "[ismap]", ["img1"]);
  109. t( "Attribute Exists", "[itemscope]", ["div1"]);
  110. // t( "Attribute Exists", "[loop]", ["video1"]); // IE 6/7 cannot differentiate here. loop is also used on img, input, and marquee tags as well as video/audio. getAttributeNode unfortunately also retrieves the property value.
  111. t( "Attribute Exists", "[multiple]", ["select1"]);
  112. t( "Attribute Exists", "[muted]", ["audio1"]);
  113. // t( "Attribute Exists", "[nohref]", ["area1"]); // IE 6/7 keep this set to false regardless of presence. The attribute node is not retrievable.
  114. t( "Attribute Exists", "[noresize]", ["textarea1"]);
  115. t( "Attribute Exists", "[noshade]", ["hr1"]);
  116. t( "Attribute Exists", "[nowrap]", ["td1", "div1"]);
  117. t( "Attribute Exists", "[novalidate]", ["form1"]);
  118. t( "Attribute Exists", "[open]", ["details1"]);
  119. t( "Attribute Exists", "[pubdate]", ["article1"]);
  120. t( "Attribute Exists", "[readonly]", ["text1"]);
  121. t( "Attribute Exists", "[required]", ["text1"]);
  122. t( "Attribute Exists", "[reversed]", ["ol1"]);
  123. t( "Attribute Exists", "[scoped]", ["style1"]);
  124. t( "Attribute Exists", "[seamless]", ["iframe1"]);
  125. t( "Attribute Exists", "[selected]", ["option1"]);
  126. t( "Attribute Exists", "[truespeed]", ["marquee1"]);
  127. // Enumerated attributes (these are not boolean content attributes)
  128. jQuery.expandedEach = jQuery.each;
  129. jQuery.expandedEach([ "draggable", "contenteditable", "aria-disabled" ], function( i, val ) {
  130. t( "Enumerated attribute", "[" + val + "]", ["div1"]);
  131. });
  132. t( "Enumerated attribute", "[spellcheck]", ["span1"]);
  133. // t( "tabindex selector does not retrieve all elements in IE6/7(#8473)", "form, [tabindex]", ["form1", "text1"] ); // sigh, FF12 QSA mistakenly includes video elements even though they have no tabindex attribute (see https://bugzilla.mozilla.org/show_bug.cgi?id=618737)
  134. t( "Improperly named form elements do not interfere with form selections (#9570)", "form[name='formName']", ["form1"] );
  135. });
  136. testIframe("selector/sizzle_cache", "Sizzle cache collides with multiple Sizzles on a page", function( jQuery, window, document ) {
  137. var $cached = window["$cached"];
  138. expect(4);
  139. notStrictEqual( jQuery, $cached, "Loaded two engines" );
  140. deepEqual( $cached(".test a").get(), [ document.getElementById("collision") ], "Select collision anchor with first sizzle" );
  141. equal( jQuery(".evil a").length, 0, "Select nothing with second sizzle" );
  142. equal( jQuery(".evil a").length, 0, "Select nothing again with second sizzle" );
  143. });