dom.js 7.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317
  1. (function() {
  2. var paper,
  3. url = 'http://raphaeljs.com';
  4. module('DOM', {
  5. setup: function() {
  6. paper = new Raphael(document.getElementById('qunit-fixture'), 1000, 1000);
  7. },
  8. teardown: function() {
  9. paper.remove();
  10. }
  11. });
  12. var equalNodePosition = function(node, expectedParent, expectedPreviousSibling, expectedNextSibling) {
  13. equal(node.parentNode, expectedParent);
  14. equal(node.previousSibling, expectedPreviousSibling);
  15. equal(node.nextSibling, expectedNextSibling);
  16. };
  17. var equalNodePositionWrapped = function(node, anchor, expectedParent, expectedPreviousSibling, expectedNextSibling) {
  18. equal(node.parentNode, anchor);
  19. equalNodePosition(anchor, expectedParent, expectedPreviousSibling, expectedNextSibling);
  20. };
  21. // Element#insertBefore
  22. // --------------------
  23. test('insertBefore: no element', function() {
  24. var el = paper.rect();
  25. el.insertBefore(null);
  26. equalNodePosition(el.node, paper.canvas, paper.defs, null);
  27. });
  28. test('insertBefore: first element', function() {
  29. var x = paper.rect();
  30. var el = paper.rect();
  31. el.insertBefore(x);
  32. equalNodePosition(el.node, paper.canvas, paper.defs, x.node);
  33. });
  34. test('insertBefore: middle element', function() {
  35. var x = paper.rect();
  36. var y = paper.rect();
  37. var el = paper.rect();
  38. el.insertBefore(y);
  39. equalNodePosition(el.node, paper.canvas, x.node, y.node);
  40. });
  41. test('insertBefore: no element when wrapped in <a>', function() {
  42. var el = paper.rect().attr('href', url),
  43. anchor = el.node.parentNode;
  44. el.insertBefore(null);
  45. equalNodePositionWrapped(el.node, anchor, paper.canvas, paper.defs, null);
  46. });
  47. test('insertBefore: first element when wrapped in <a>', function() {
  48. var x = paper.rect();
  49. var el = paper.rect().attr('href', url),
  50. anchor = el.node.parentNode;
  51. el.insertBefore(x);
  52. equalNodePositionWrapped(el.node, anchor, paper.canvas, paper.defs, x.node);
  53. });
  54. test('insertBefore: first element wrapped in <a> and wrapped in <a>', function() {
  55. var x = paper.rect().attr('href', url),
  56. xAnchor = x.node.parentNode;
  57. var el = paper.rect().attr('href', url),
  58. anchor = el.node.parentNode;
  59. el.insertBefore(x);
  60. equalNodePositionWrapped(el.node, anchor, paper.canvas, paper.defs, xAnchor);
  61. });
  62. test('insertBefore: middle element when wrapped in <a>', function() {
  63. var x = paper.rect();
  64. var y = paper.rect();
  65. var el = paper.rect().attr('href', url),
  66. anchor = el.node.parentNode;
  67. el.insertBefore(y);
  68. equalNodePositionWrapped(el.node, anchor, paper.canvas, x.node, y.node);
  69. });
  70. test('insertBefore: middle element wrapped in <a> and wrapped in <a>', function() {
  71. var x = paper.rect().attr('href', url),
  72. xAnchor = x.node.parentNode;
  73. var y = paper.rect().attr('href', url),
  74. yAnchor = y.node.parentNode;
  75. var el = paper.rect().attr('href', url),
  76. anchor = el.node.parentNode;
  77. el.insertBefore(y);
  78. equalNodePositionWrapped(el.node, anchor, paper.canvas, xAnchor, yAnchor);
  79. });
  80. // TODO...
  81. // insertBefore: with set
  82. // insertBefore: with nested set.
  83. // Element#insertAfter
  84. // -------------------
  85. test('insertAfter: no element', function() {
  86. var el = paper.rect();
  87. el.insertAfter(null);
  88. equalNodePosition(el.node, paper.canvas, paper.defs, null);
  89. });
  90. test('insertAfter: last element', function() {
  91. var x = paper.rect();
  92. var el = paper.rect();
  93. el.insertAfter(x);
  94. equalNodePosition(el.node, paper.canvas, x.node, null);
  95. });
  96. test('insertAfter: middle element', function() {
  97. var x = paper.rect();
  98. var y = paper.rect();
  99. var el = paper.rect();
  100. el.insertAfter(x);
  101. equalNodePosition(el.node, paper.canvas, x.node, y.node);
  102. });
  103. test('insertAfter: no element when wrapped in <a>', function() {
  104. var el = paper.rect().attr('href', url),
  105. anchor = el.node.parentNode;
  106. el.insertAfter(null);
  107. equalNodePositionWrapped(el.node, anchor, paper.canvas, paper.defs, null);
  108. });
  109. test('insertAfter: last element when wrapped in <a>', function() {
  110. var x = paper.rect();
  111. var el = paper.rect().attr('href', url),
  112. anchor = el.node.parentNode;
  113. el.insertAfter(x);
  114. equalNodePositionWrapped(el.node, anchor, paper.canvas, x.node, null);
  115. });
  116. test('insertAfter: last element wrapped in <a> and wrapped in <a>', function() {
  117. var x = paper.rect().attr('href', url),
  118. xAnchor = x.node.parentNode;
  119. var el = paper.rect().attr('href', url),
  120. anchor = el.node.parentNode;
  121. el.insertAfter(x);
  122. equalNodePositionWrapped(el.node, anchor, paper.canvas, xAnchor, null);
  123. });
  124. test('insertAfter: middle element when wrapped in <a>', function() {
  125. var x = paper.rect();
  126. var y = paper.rect();
  127. var el = paper.rect().attr('href', url),
  128. anchor = el.node.parentNode;
  129. el.insertAfter(x);
  130. equalNodePositionWrapped(el.node, anchor, paper.canvas, x.node, y.node);
  131. });
  132. test('insertAfter: middle element wrapped in <a> and wrapped in <a>', function() {
  133. var x = paper.rect().attr('href', url),
  134. xAnchor = x.node.parentNode;
  135. var y = paper.rect().attr('href', url),
  136. yAnchor = y.node.parentNode;
  137. var el = paper.rect().attr('href', url),
  138. anchor = el.node.parentNode;
  139. el.insertAfter(x);
  140. equalNodePositionWrapped(el.node, anchor, paper.canvas, xAnchor, yAnchor);
  141. });
  142. // TODO...
  143. // insertAfter: with set
  144. // insertAfter: with nested set.
  145. // Element#remove
  146. // --------------
  147. test('remove: after added', function() {
  148. var el = paper.rect(),
  149. node = el.node;
  150. el.remove();
  151. equal(el.node, null);
  152. equal(node.parentNode, null);
  153. });
  154. test('remove: when wrapped in <a>', function() {
  155. var el = paper.rect().attr('href', url),
  156. node = el.node,
  157. anchor = node.parentNode;
  158. el.remove();
  159. equal(el.node, null);
  160. equal(node.parentNode, anchor);
  161. equal(anchor.parentNode, null);
  162. });
  163. test('remove: when already removed', function() {
  164. var el = paper.rect(),
  165. node = el.node;
  166. el.remove();
  167. el.remove();
  168. equal(el.node, null);
  169. equal(node.parentNode, null);
  170. });
  171. test('remove: when the canvas is removed', function() {
  172. var el = paper.rect(),
  173. node = el.node;
  174. paper.remove();
  175. el.remove();
  176. equal(el.node, null);
  177. equal(node.parentNode, null);
  178. });
  179. // Element#toFront
  180. // --------------
  181. test('toFront: normal', function() {
  182. var el = paper.rect();
  183. var x = paper.rect();
  184. el.toFront();
  185. equalNodePosition(el.node, paper.canvas, x.node, null);
  186. });
  187. test('toFront: when wrapped in <a>', function() {
  188. var el = paper.rect().attr('href', url),
  189. anchor = el.node.parentNode;
  190. var x = paper.rect();
  191. el.toFront();
  192. equalNodePositionWrapped(el.node, anchor, paper.canvas, x.node, null);
  193. });
  194. // Element#toBack
  195. // --------------
  196. test('toBack: normal', function() {
  197. var x = paper.rect();
  198. var el = paper.rect();
  199. el.toBack();
  200. equalNodePosition(el.node, paper.canvas, null, paper.desc);
  201. equalNodePosition(x.node, paper.canvas, paper.defs, null);
  202. });
  203. test('toBack: when wrapped in <a>', function() {
  204. var x = paper.rect();
  205. var el = paper.rect().attr('href', url),
  206. anchor = el.node.parentNode;
  207. el.toBack();
  208. equalNodePositionWrapped(el.node, anchor, paper.canvas, null, paper.desc);
  209. equalNodePosition(x.node, paper.canvas, paper.defs, null);
  210. });
  211. // Element#attrs
  212. // -------------
  213. // #x
  214. // #y
  215. // #rx
  216. // #ry
  217. // #transform
  218. // #title
  219. // #href
  220. //keep adding and testing!
  221. })();