modal.js 6.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196
  1. $(function () {
  2. module("modal")
  3. test("should provide no conflict", function () {
  4. var modal = $.fn.modal.noConflict()
  5. ok(!$.fn.modal, 'modal was set back to undefined (org value)')
  6. $.fn.modal = modal
  7. })
  8. test("should be defined on jquery object", function () {
  9. var div = $("<div id='modal-test'></div>")
  10. ok(div.modal, 'modal method is defined')
  11. })
  12. test("should return element", function () {
  13. var div = $("<div id='modal-test'></div>")
  14. ok(div.modal() == div, 'document.body returned')
  15. $('#modal-test').remove()
  16. })
  17. test("should expose defaults var for settings", function () {
  18. ok($.fn.modal.Constructor.DEFAULTS, 'default object exposed')
  19. })
  20. test("should insert into dom when show method is called", function () {
  21. stop()
  22. $.support.transition = false
  23. $("<div id='modal-test'></div>")
  24. .on("shown.bs.modal", function () {
  25. ok($('#modal-test').length, 'modal inserted into dom')
  26. $(this).remove()
  27. start()
  28. })
  29. .modal("show")
  30. })
  31. test("should fire show event", function () {
  32. stop()
  33. $.support.transition = false
  34. $("<div id='modal-test'></div>")
  35. .on("show.bs.modal", function () {
  36. ok(true, "show was called")
  37. })
  38. .on("shown.bs.modal", function () {
  39. $(this).remove()
  40. start()
  41. })
  42. .modal("show")
  43. })
  44. test("should not fire shown when default prevented", function () {
  45. stop()
  46. $.support.transition = false
  47. $("<div id='modal-test'></div>")
  48. .on("show.bs.modal", function (e) {
  49. e.preventDefault()
  50. ok(true, "show was called")
  51. start()
  52. })
  53. .on("shown.bs.modal", function () {
  54. ok(false, "shown was called")
  55. })
  56. .modal("show")
  57. })
  58. test("should hide modal when hide is called", function () {
  59. stop()
  60. $.support.transition = false
  61. $("<div id='modal-test'></div>")
  62. .on("shown.bs.modal", function () {
  63. ok($('#modal-test').is(":visible"), 'modal visible')
  64. ok($('#modal-test').length, 'modal inserted into dom')
  65. $(this).modal("hide")
  66. })
  67. .on("hidden.bs.modal", function() {
  68. ok(!$('#modal-test').is(":visible"), 'modal hidden')
  69. $('#modal-test').remove()
  70. start()
  71. })
  72. .modal("show")
  73. })
  74. test("should toggle when toggle is called", function () {
  75. stop()
  76. $.support.transition = false
  77. var div = $("<div id='modal-test'></div>")
  78. div
  79. .on("shown.bs.modal", function () {
  80. ok($('#modal-test').is(":visible"), 'modal visible')
  81. ok($('#modal-test').length, 'modal inserted into dom')
  82. div.modal("toggle")
  83. })
  84. .on("hidden.bs.modal", function() {
  85. ok(!$('#modal-test').is(":visible"), 'modal hidden')
  86. div.remove()
  87. start()
  88. })
  89. .modal("toggle")
  90. })
  91. test("should remove from dom when click [data-dismiss=modal]", function () {
  92. stop()
  93. $.support.transition = false
  94. var div = $("<div id='modal-test'><span class='close' data-dismiss='modal'></span></div>")
  95. div
  96. .on("shown.bs.modal", function () {
  97. ok($('#modal-test').is(":visible"), 'modal visible')
  98. ok($('#modal-test').length, 'modal inserted into dom')
  99. div.find('.close').click()
  100. })
  101. .on("hidden.bs.modal", function() {
  102. ok(!$('#modal-test').is(":visible"), 'modal hidden')
  103. div.remove()
  104. start()
  105. })
  106. .modal("toggle")
  107. })
  108. test("should allow modal close with 'backdrop:false'", function () {
  109. stop()
  110. $.support.transition = false
  111. var div = $("<div>", { id: 'modal-test', "data-backdrop": false })
  112. div
  113. .on("shown.bs.modal", function () {
  114. ok($('#modal-test').is(":visible"), 'modal visible')
  115. div.modal("hide")
  116. })
  117. .on("hidden.bs.modal", function() {
  118. ok(!$('#modal-test').is(":visible"), 'modal hidden')
  119. div.remove()
  120. start()
  121. })
  122. .modal("show")
  123. })
  124. test("should close modal when clicking outside of modal-content", function () {
  125. stop()
  126. $.support.transition = false
  127. var div = $("<div id='modal-test'><div class='contents'></div></div>")
  128. div
  129. .bind("shown.bs.modal", function () {
  130. ok($('#modal-test').length, 'modal insterted into dom')
  131. $('.contents').click()
  132. ok($('#modal-test').is(":visible"), 'modal visible')
  133. $('#modal-test').click()
  134. })
  135. .bind("hidden.bs.modal", function() {
  136. ok(!$('#modal-test').is(":visible"), 'modal hidden')
  137. div.remove()
  138. start()
  139. })
  140. .modal("show")
  141. })
  142. test("should trigger hide event once when clicking outside of modal-content", function () {
  143. stop()
  144. $.support.transition = false
  145. var div = $("<div id='modal-test'><div class='contents'></div></div>")
  146. var triggered
  147. div
  148. .bind("shown.bs.modal", function () {
  149. triggered = 0
  150. $('#modal-test').click()
  151. })
  152. .one("hidden.bs.modal", function() {
  153. div.modal("show")
  154. })
  155. .bind("hide.bs.modal", function () {
  156. triggered += 1
  157. ok(triggered === 1, 'modal hide triggered once')
  158. start()
  159. })
  160. .modal("show")
  161. })
  162. test("should close reopened modal with [data-dismiss=modal] click", function () {
  163. stop()
  164. $.support.transition = false
  165. var div = $("<div id='modal-test'><div class='contents'><div id='close' data-dismiss='modal'></div></div></div>")
  166. div
  167. .bind("shown.bs.modal", function () {
  168. $('#close').click()
  169. ok(!$('#modal-test').is(":visible"), 'modal hidden')
  170. })
  171. .one("hidden.bs.modal", function() {
  172. div.one('hidden.bs.modal', function () {
  173. start()
  174. }).modal("show")
  175. })
  176. .modal("show")
  177. div.remove()
  178. })
  179. })