event.spec.js 14 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500
  1. describe('WalkontableEvent', function () {
  2. var $table,
  3. debug = false;
  4. beforeEach(function () {
  5. $table = $('<table></table>'); // create a table that is not attached to document
  6. $table.appendTo('body');
  7. createDataArray();
  8. });
  9. afterEach(function () {
  10. if (!debug) {
  11. $('.wtHolder').remove();
  12. }
  13. });
  14. it('should call `onCellMouseDown` callback', function () {
  15. var myCoords = null,
  16. myTD = null,
  17. wt = new Walkontable.Core({
  18. table: $table[0],
  19. data: getData,
  20. totalRows: getTotalRows,
  21. totalColumns: getTotalColumns,
  22. onCellMouseDown: function onCellMouseDown(event, coords, TD) {
  23. myCoords = coords;
  24. myTD = TD;
  25. }
  26. });
  27. wt.draw();
  28. var $td = $table.find('tbody tr:eq(1) td:eq(1)');
  29. $td.simulate('mousedown');
  30. expect(myCoords).toEqual(new Walkontable.CellCoords(1, 1));
  31. expect(myTD).toEqual($td[0]);
  32. });
  33. it('should call `onCellMouseOver` callback', function () {
  34. var myCoords = null,
  35. myTD = null,
  36. wt = new Walkontable.Core({
  37. table: $table[0],
  38. data: getData,
  39. totalRows: getTotalRows,
  40. totalColumns: getTotalColumns,
  41. onCellMouseOver: function onCellMouseOver(event, coords, TD) {
  42. myCoords = coords;
  43. myTD = TD;
  44. }
  45. });
  46. wt.draw();
  47. var $td = $table.find('tbody tr:eq(1) td:eq(1)');
  48. $td.simulate('mouseover');
  49. expect(myCoords).toEqual(new Walkontable.CellCoords(1, 1));
  50. expect(myTD).toEqual($td[0]);
  51. });
  52. it('should call `onCellMouseOver` callback with correctly passed TD element when cell contains another table', function () {
  53. var fn = jasmine.createSpy();
  54. var wt = new Walkontable.Core({
  55. table: $table[0],
  56. data: [['<table style="width: 50px;"><tr><td class="test">TEST</td></tr></table>']],
  57. totalRows: 1,
  58. totalColumns: 1,
  59. onCellMouseOver: fn,
  60. cellRenderer: function cellRenderer(row, column, TD) {
  61. TD.innerHTML = wt.wtSettings.getSetting('data', row, column);
  62. }
  63. });
  64. wt.draw();
  65. var outerTD = $table.find('tbody td:not(td.test)');
  66. var innerTD = $table.find('tbody td.test');
  67. innerTD.simulate('mouseover');
  68. expect(fn.calls.argsFor(0)[2]).toBe(outerTD[0]);
  69. });
  70. it('should call `onCellMouseOut` callback', function () {
  71. var myCoords = null,
  72. myTD = null,
  73. wt = new Walkontable.Core({
  74. table: $table[0],
  75. data: getData,
  76. totalRows: getTotalRows,
  77. totalColumns: getTotalColumns,
  78. onCellMouseOut: function onCellMouseOut(event, coords, TD) {
  79. myCoords = coords;
  80. myTD = TD;
  81. }
  82. });
  83. wt.draw();
  84. var $td = $table.find('tbody tr:eq(1) td:eq(1)');
  85. $td.simulate('mouseover');
  86. $td.simulate('mouseout');
  87. expect(myCoords).toEqual(new Walkontable.CellCoords(1, 1));
  88. expect(myTD).toEqual($td[0]);
  89. });
  90. it('should call `onCellMouseOut` callback with correctly passed TD element when cell contains another table', function () {
  91. var fn = jasmine.createSpy();
  92. var wt = new Walkontable.Core({
  93. table: $table[0],
  94. data: [['<table style="width: 50px;"><tr><td class="test">TEST</td></tr></table>']],
  95. totalRows: 1,
  96. totalColumns: 1,
  97. onCellMouseOut: fn,
  98. cellRenderer: function cellRenderer(row, column, TD) {
  99. TD.innerHTML = wt.wtSettings.getSetting('data', row, column);
  100. }
  101. });
  102. wt.draw();
  103. var outerTD = $table.find('tbody td:not(td.test)');
  104. var innerTD = $table.find('tbody td.test');
  105. innerTD.simulate('mouseover');
  106. innerTD.simulate('mouseout');
  107. expect(fn.calls.argsFor(0)[2]).toBe(outerTD[0]);
  108. });
  109. it('should call `onCellDblClick` callback', function () {
  110. var myCoords = null,
  111. myTD = null,
  112. wt = new Walkontable.Core({
  113. table: $table[0],
  114. data: getData,
  115. totalRows: getTotalRows,
  116. totalColumns: getTotalColumns,
  117. onCellDblClick: function onCellDblClick(event, coords, TD) {
  118. myCoords = coords;
  119. myTD = TD;
  120. }
  121. });
  122. wt.draw();
  123. var $td = $table.find('tbody tr:eq(1) td:eq(1)');
  124. $td.simulate('mousedown');
  125. $td.simulate('mouseup');
  126. $td.simulate('mousedown');
  127. $td.simulate('mouseup');
  128. expect(myCoords).toEqual(new Walkontable.CellCoords(1, 1));
  129. expect(myTD).toEqual($td[0]);
  130. });
  131. it('should call `onCellDblClick` callback, even when it is set only after first click', function () {
  132. var myCoords = null,
  133. myTD = null,
  134. wt = new Walkontable.Core({
  135. table: $table[0],
  136. data: getData,
  137. totalRows: getTotalRows,
  138. totalColumns: getTotalColumns
  139. });
  140. wt.draw();
  141. var $td = $table.find('tbody tr:eq(1) td:eq(1)');
  142. $td.simulate('mousedown');
  143. $td.simulate('mouseup');
  144. $td.simulate('mousedown');
  145. wt.update('onCellDblClick', function (event, coords, TD) {
  146. myCoords = coords;
  147. myTD = TD;
  148. });
  149. $td.simulate('mouseup');
  150. expect(myCoords).toEqual(new Walkontable.CellCoords(1, 1));
  151. expect(myTD).toEqual($td[0]);
  152. });
  153. it('should call `onCellMouseDown` callback when clicked on TH', function () {
  154. var called = false,
  155. wt = new Walkontable.Core({
  156. table: $table[0],
  157. data: getData,
  158. totalRows: getTotalRows,
  159. totalColumns: getTotalColumns,
  160. columnHeaders: [function (col, TH) {
  161. TH.innerHTML = col + 1;
  162. }],
  163. onCellMouseDown: function onCellMouseDown(event, coords, TD) {
  164. called = true;
  165. }
  166. });
  167. wt.draw();
  168. var $th = $table.find('th:first');
  169. $th.simulate('mousedown');
  170. expect(called).toEqual(true);
  171. });
  172. it('should not call `onCellMouseDown` callback when clicked on the focusable element (column headers)', function () {
  173. var opt = ['Maserati', 'Mazda', 'Mercedes', 'Mini', 'Mitsubishi'].map(function (opt) {
  174. return '<option value="' + opt + '">' + opt + '</option>';
  175. }).join('');
  176. var called = false;
  177. var wt = new Walkontable.Core({
  178. table: $table[0],
  179. data: getData,
  180. totalRows: getTotalRows,
  181. totalColumns: getTotalColumns,
  182. columnHeaders: [function (col, TH) {
  183. TH.innerHTML = '#' + col + '<select>' + opt + '</select>';
  184. }],
  185. onCellMouseDown: function onCellMouseDown(event, coords, TD) {
  186. called = true;
  187. }
  188. });
  189. wt.draw();
  190. var select = $table.find('th:first select');
  191. select.focus();
  192. select.simulate('mousedown');
  193. expect(called).toBe(false);
  194. });
  195. it('should not call `onCellMouseDown` callback when clicked on the focusable element (cell renderer)', function () {
  196. var opt = ['Maserati', 'Mazda', 'Mercedes', 'Mini', 'Mitsubishi'].map(function (opt) {
  197. return '<option value="' + opt + '">' + opt + '</option>';
  198. }).join('');
  199. var called = false;
  200. var wt = new Walkontable.Core({
  201. table: $table[0],
  202. data: getData,
  203. totalRows: getTotalRows,
  204. totalColumns: getTotalColumns,
  205. cellRenderer: function cellRenderer(row, column, TD) {
  206. TD.innerHTML = '<select>' + opt + '</select>';
  207. },
  208. onCellMouseDown: function onCellMouseDown(event, coords, TD) {
  209. called = true;
  210. }
  211. });
  212. wt.draw();
  213. var select = $table.find('td:first select');
  214. select.focus();
  215. select.simulate('mousedown');
  216. expect(called).toBe(false);
  217. });
  218. it('should call `onCellMouseOver` callback when clicked on TH', function () {
  219. var called = false,
  220. wt = new Walkontable.Core({
  221. table: $table[0],
  222. data: getData,
  223. totalRows: getTotalRows,
  224. totalColumns: getTotalColumns,
  225. columnHeaders: [function (col, TH) {
  226. TH.innerHTML = col + 1;
  227. }],
  228. onCellMouseOver: function onCellMouseOver(event, coords, TD) {
  229. called = coords;
  230. }
  231. });
  232. wt.draw();
  233. var $th = $table.find('th:first');
  234. $th.simulate('mouseover');
  235. expect(called.row).toEqual(-1);
  236. expect(called.col).toEqual(0);
  237. });
  238. it('should call `onCellDblClick` callback when clicked on TH', function () {
  239. var called = false,
  240. wt = new Walkontable.Core({
  241. table: $table[0],
  242. data: getData,
  243. totalRows: getTotalRows,
  244. totalColumns: getTotalColumns,
  245. columnHeaders: [function (col, TH) {
  246. TH.innerHTML = col + 1;
  247. }],
  248. onCellDblClick: function onCellDblClick(event, coords, TD) {
  249. called = true;
  250. }
  251. });
  252. wt.draw();
  253. var $th = $table.find('th:first');
  254. $th.simulate('mousedown');
  255. $th.simulate('mouseup');
  256. $th.simulate('mousedown');
  257. $th.simulate('mouseup');
  258. expect(called).toEqual(true);
  259. });
  260. it('should not call `onCellDblClick` callback when right-clicked', function () {
  261. var called = false,
  262. wt = new Walkontable.Core({
  263. table: $table[0],
  264. data: getData,
  265. totalRows: getTotalRows,
  266. totalColumns: getTotalColumns,
  267. onCellDblClick: function onCellDblClick(event, coords, TD) {
  268. called = true;
  269. }
  270. });
  271. wt.draw();
  272. var $td = $table.find('tbody tr:first td:first');
  273. var options = {
  274. button: 2
  275. };
  276. $td.simulate('mousedown', options);
  277. $td.simulate('mouseup', options);
  278. $td.simulate('mousedown', options);
  279. $td.simulate('mouseup', options);
  280. expect(called).toEqual(false);
  281. });
  282. it('should not call `onCellDblClick` when first mouse up came from mouse drag', function () {
  283. var called = false,
  284. wt = new Walkontable.Core({
  285. table: $table[0],
  286. data: getData,
  287. totalRows: getTotalRows,
  288. totalColumns: getTotalColumns,
  289. onCellDblClick: function onCellDblClick(event, coords, TD) {
  290. called = true;
  291. }
  292. });
  293. wt.draw();
  294. var $td = $table.find('tbody tr:first td:first');
  295. var $td2 = $table.find('tbody tr:first td:eq(1)');
  296. $td2.simulate('mousedown');
  297. $td.simulate('mouseup');
  298. $td.simulate('mousedown');
  299. $td.simulate('mouseup');
  300. expect(called).toEqual(false);
  301. });
  302. it('border click should call `onCellMouseDown` callback', function () {
  303. var myCoords = null,
  304. myTD = null,
  305. wt = new Walkontable.Core({
  306. table: $table[0],
  307. data: getData,
  308. totalRows: getTotalRows,
  309. totalColumns: getTotalColumns,
  310. selections: [new Walkontable.Selection({
  311. className: 'current',
  312. border: {
  313. width: 1,
  314. color: 'red',
  315. style: 'solid'
  316. }
  317. })],
  318. onCellMouseDown: function onCellMouseDown(event, coords, TD) {
  319. myCoords = coords;
  320. myTD = TD;
  321. }
  322. });
  323. shimSelectionProperties(wt);
  324. wt.selections.current.add(new Walkontable.CellCoords(1, 1));
  325. wt.draw();
  326. var $td = $table.find('tbody tr:eq(1) td:eq(1)');
  327. var $border = $table.parents('.wtHolder').find('.wtBorder:first');
  328. $border.simulate('mousedown');
  329. expect(myCoords).toEqual(new Walkontable.CellCoords(1, 1));
  330. expect(myTD).toEqual($td[0]);
  331. });
  332. it('border click should call `onCellDblClick` callback', function () {
  333. var myCoords = null,
  334. myTD = null,
  335. wt = new Walkontable.Core({
  336. table: $table[0],
  337. data: getData,
  338. totalRows: getTotalRows,
  339. totalColumns: getTotalColumns,
  340. selections: [new Walkontable.Selection({
  341. className: 'current',
  342. border: {
  343. width: 1,
  344. color: 'red',
  345. style: 'solid'
  346. }
  347. })],
  348. onCellDblClick: function onCellDblClick(event, coords, TD) {
  349. myCoords = coords;
  350. myTD = TD;
  351. }
  352. });
  353. shimSelectionProperties(wt);
  354. wt.selections.current.add(new Walkontable.CellCoords(1, 1));
  355. wt.draw();
  356. var $td = $table.find('tbody tr:eq(1) td:eq(1)');
  357. var $border = $table.parents('.wtHolder').find('.wtBorder:first');
  358. $border.simulate('mousedown');
  359. $border.simulate('mouseup');
  360. $border.simulate('mousedown');
  361. $border.simulate('mouseup');
  362. expect(myCoords).toEqual(new Walkontable.CellCoords(1, 1));
  363. expect(myTD).toEqual($td[0]);
  364. });
  365. // corner
  366. it('should call `onCellCornerMouseDown` callback', function () {
  367. var clicked = false,
  368. wt = new Walkontable.Core({
  369. table: $table[0],
  370. data: getData,
  371. totalRows: getTotalRows,
  372. totalColumns: getTotalColumns,
  373. selections: [new Walkontable.Selection({
  374. className: 'current',
  375. border: {
  376. width: 1,
  377. color: 'red',
  378. style: 'solid'
  379. }
  380. })],
  381. onCellCornerMouseDown: function onCellCornerMouseDown(event) {
  382. clicked = true;
  383. }
  384. });
  385. shimSelectionProperties(wt);
  386. wt.selections.current.add(new Walkontable.CellCoords(10, 2));
  387. wt.draw();
  388. var $td = $table.parents('.wtHolder').find('.current.corner');
  389. $td.simulate('mousedown');
  390. expect(clicked).toEqual(true);
  391. });
  392. it('should call `onCellCornerDblClick` callback, even when it is set only after first click', function () {
  393. var clicked = false,
  394. wt = new Walkontable.Core({
  395. table: $table[0],
  396. data: getData,
  397. totalRows: getTotalRows,
  398. totalColumns: getTotalColumns,
  399. selections: [new Walkontable.Selection({
  400. className: 'current',
  401. border: {
  402. width: 1,
  403. color: 'red',
  404. style: 'solid'
  405. }
  406. })]
  407. });
  408. shimSelectionProperties(wt);
  409. wt.selections.current.add(new Walkontable.CellCoords(10, 2));
  410. wt.draw();
  411. var $td = $table.parents('.wtHolder').find('.current.corner');
  412. $td.simulate('mousedown');
  413. $td.simulate('mouseup');
  414. $td.simulate('mousedown');
  415. wt.update('onCellCornerDblClick', function (event) {
  416. clicked = true;
  417. });
  418. $td.simulate('mouseup');
  419. expect(clicked).toEqual(true);
  420. });
  421. it('should call `onDraw` callback after render', function () {
  422. var count = 0,
  423. wt = new Walkontable.Core({
  424. table: $table[0],
  425. data: getData,
  426. totalRows: getTotalRows,
  427. totalColumns: getTotalColumns,
  428. onDraw: function onDraw() {
  429. count++;
  430. }
  431. });
  432. wt.draw();
  433. expect(count).toEqual(1);
  434. });
  435. });