945ae803b9d311dbb6ea2ad1b376fb69bfba5a5f28f6d88d97c4ba8f61a2f37060f6458d863a61b8b177e83839c9656ae7d56a5bb3e32abfbfb7dfa650c07e 15 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293294295296297298299300301302303304305306307308309310311312313314315316317318319320321322323324325326327328329330331332333334335336337338339340341342343344345346347348349350351352353354355356357358359360361362363364365366367368369370371372373374375376377378379380381382383384385386387388389390391392393394395396397398399400401402403404405406407408409410411412413414415416417418419420421422423424425426427428429430431432433434435436437438439440441442443444445446447448449450451452453454455456457458459460461462463464465466467468469470471472473474475476477478479480481482483484485486487488489490491492493494495496497498499500501502503504505506507508509510511512513514515516517518519520521522523524525526527528529530531532533534535536537538539540541542543544545546547548549550551552553554555556557558559560561562563564565566567568569570571572573574575576577578579580581582583584585586587588589590591592593594595596597598599600601602603604605606607608609610611612613614615616617618619620
  1. describe('Core_updateSettings', () => {
  2. var id = 'testContainer';
  3. beforeEach(function() {
  4. this.$container = $(`<div id="${id}"></div>`).appendTo('body');
  5. });
  6. afterEach(function() {
  7. if (this.$container) {
  8. destroy();
  9. this.$container.remove();
  10. }
  11. });
  12. it('should inherit cell type', () => {
  13. handsontable({
  14. data: [[1, 2]],
  15. columns: [
  16. {},
  17. {type: 'checkbox'},
  18. ],
  19. cells(row, col, prop) {
  20. if (row === 0 && col === 0) {
  21. return {
  22. type: 'numeric'
  23. };
  24. }
  25. }
  26. });
  27. expect(getCellMeta(0, 0).type).toEqual('numeric');
  28. expect(getCellMeta(0, 1).type).toEqual('checkbox');
  29. });
  30. it('should inherit cell type when columns is a function', () => {
  31. handsontable({
  32. data: [[1, 2]],
  33. columns(column) {
  34. var colMeta = null;
  35. if (column === 0) {
  36. colMeta = {};
  37. } else if (column === 1) {
  38. colMeta = {type: 'checkbox'};
  39. }
  40. return colMeta;
  41. },
  42. cells(row, col, prop) {
  43. if (row === 0 && col === 0) {
  44. return {
  45. type: 'numeric'
  46. };
  47. }
  48. }
  49. });
  50. expect(getCellMeta(0, 0).type).toEqual('numeric');
  51. expect(getCellMeta(0, 1).type).toEqual('checkbox');
  52. });
  53. it('should ignore mixed in properties to the cell array option', () => {
  54. /* eslint-disable no-array-constructor */
  55. /* eslint-disable no-extend-native */
  56. Array.prototype.willFail = 'BOOM';
  57. handsontable({
  58. data: [[1, true]],
  59. columns: [
  60. {type: 'numeric'},
  61. {type: 'checkbox'}
  62. ]
  63. });
  64. expect(() => {
  65. updateSettings({cell: new Array()});
  66. }).not.toThrow();
  67. });
  68. it('should ignore mixed in properties to the cell array option when columns is a function', () => {
  69. /* eslint-disable no-array-constructor */
  70. /* eslint-disable no-extend-native */
  71. Array.prototype.willFail = 'BOOM';
  72. handsontable({
  73. data: [[1, true]],
  74. columns: function(column) {
  75. var colMeta = null;
  76. if (column === 0) {
  77. colMeta = {type: 'numeric'};
  78. } else if (column === 1) {
  79. colMeta = {type: 'checkbox'};
  80. }
  81. return colMeta;
  82. },
  83. });
  84. expect(() => {
  85. updateSettings({cell: new Array()});
  86. }).not.toThrow();
  87. });
  88. it('should not reset columns types to text', function() {
  89. handsontable({
  90. data: [[1, true]],
  91. columns: [
  92. {type: 'numeric'},
  93. {type: 'checkbox'}
  94. ]
  95. });
  96. var td = this.$container.find('td');
  97. expect(td.eq(0).text()).toEqual('1');
  98. expect(td.eq(1).text()).toEqual('');
  99. updateSettings({});
  100. expect(td.eq(0).text()).toEqual('1');
  101. expect(td.eq(1).text()).toEqual('');
  102. });
  103. it('should not reset columns types to text when columns is a function', function() {
  104. handsontable({
  105. data: [[1, true]],
  106. columns: function(column) {
  107. var colMeta = null;
  108. if (column === 0) {
  109. colMeta = {type: 'numeric'};
  110. } else if (column === 1) {
  111. colMeta = {type: 'checkbox'};
  112. }
  113. return colMeta;
  114. }
  115. });
  116. var td = this.$container.find('td');
  117. expect(td.eq(0).text()).toEqual('1');
  118. expect(td.eq(1).text()).toEqual('');
  119. updateSettings({});
  120. expect(td.eq(0).text()).toEqual('1');
  121. expect(td.eq(1).text()).toEqual('');
  122. });
  123. it('should update readOnly global setting', () => {
  124. handsontable({
  125. readOnly: true,
  126. data: [['foo', 'bar']],
  127. columns: [
  128. {},
  129. {},
  130. ]
  131. });
  132. expect(getCellMeta(0, 0).readOnly).toBe(true);
  133. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(true);
  134. expect(getCellMeta(0, 1).readOnly).toBe(true);
  135. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(true);
  136. updateSettings({
  137. readOnly: false
  138. });
  139. expect(getCellMeta(0, 0).readOnly).toBe(false);
  140. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(false);
  141. expect(getCellMeta(0, 1).readOnly).toBe(false);
  142. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(false);
  143. });
  144. it('should update readOnly global setting when columns is a function', () => {
  145. handsontable({
  146. readOnly: true,
  147. data: [['foo', 'bar']],
  148. columns(column) {
  149. var colMeta = {};
  150. if ([0, 1].indexOf(column) < 0) {
  151. colMeta = null;
  152. }
  153. return colMeta;
  154. }
  155. });
  156. expect(getCellMeta(0, 0).readOnly).toBe(true);
  157. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(true);
  158. expect(getCellMeta(0, 1).readOnly).toBe(true);
  159. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(true);
  160. updateSettings({
  161. readOnly: false
  162. });
  163. expect(getCellMeta(0, 0).readOnly).toBe(false);
  164. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(false);
  165. expect(getCellMeta(0, 1).readOnly).toBe(false);
  166. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(false);
  167. });
  168. it('should update readOnly columns setting', () => {
  169. handsontable({
  170. data: [['foo', true]],
  171. columns: [
  172. {type: 'text', readOnly: true},
  173. {type: 'checkbox'}
  174. ]
  175. });
  176. expect(getCellMeta(0, 0).readOnly).toBe(true);
  177. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(true);
  178. expect(getCellMeta(0, 1).readOnly).toBe(false);
  179. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(false);
  180. updateSettings({
  181. columns: [
  182. {type: 'text', readOnly: false},
  183. {type: 'checkbox'}
  184. ]
  185. });
  186. expect(getCellMeta(0, 0).readOnly).toBe(false);
  187. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(false);
  188. expect(getCellMeta(0, 1).readOnly).toBe(false);
  189. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(false);
  190. });
  191. it('should update readOnly columns setting when columns is a function', () => {
  192. handsontable({
  193. data: [['foo', true]],
  194. columns(column) {
  195. var colMeta = null;
  196. if (column === 0) {
  197. colMeta = {type: 'text', readOnly: true};
  198. } else if (column === 1) {
  199. colMeta = {type: 'checkbox'};
  200. }
  201. return colMeta;
  202. }
  203. });
  204. expect(getCellMeta(0, 0).readOnly).toBe(true);
  205. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(true);
  206. expect(getCellMeta(0, 1).readOnly).toBe(false);
  207. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(false);
  208. updateSettings({
  209. columns(column) {
  210. var colMeta = null;
  211. if (column === 0) {
  212. colMeta = {type: 'text', readOnly: false};
  213. } else if (column === 1) {
  214. colMeta = {type: 'checkbox'};
  215. }
  216. return colMeta;
  217. }
  218. });
  219. expect(getCellMeta(0, 0).readOnly).toBe(false);
  220. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(false);
  221. expect(getCellMeta(0, 1).readOnly).toBe(false);
  222. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(false);
  223. });
  224. it('should update readOnly columns setting and override global setting', () => {
  225. handsontable({
  226. readOnly: true,
  227. data: [['foo', true]],
  228. columns: [
  229. {type: 'text'},
  230. {type: 'checkbox'}
  231. ]
  232. });
  233. expect(getCellMeta(0, 0).readOnly).toBe(true);
  234. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(true);
  235. expect(getCellMeta(0, 1).readOnly).toBe(true);
  236. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(true);
  237. updateSettings({
  238. columns: [
  239. {type: 'text', readOnly: false},
  240. {type: 'checkbox'}
  241. ]
  242. });
  243. expect(getCellMeta(0, 0).readOnly).toBe(false);
  244. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(false);
  245. expect(getCellMeta(0, 1).readOnly).toBe(true);
  246. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(true);
  247. });
  248. it('should update readOnly columns setting and override global setting when columns is a function', () => {
  249. handsontable({
  250. readOnly: true,
  251. data: [['foo', true]],
  252. columns(column) {
  253. var colMeta = null;
  254. if (column === 0) {
  255. colMeta = {type: 'text'};
  256. } else if (column === 1) {
  257. colMeta = {type: 'checkbox'};
  258. }
  259. return colMeta;
  260. }
  261. });
  262. expect(getCellMeta(0, 0).readOnly).toBe(true);
  263. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(true);
  264. expect(getCellMeta(0, 1).readOnly).toBe(true);
  265. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(true);
  266. updateSettings({
  267. columns(column) {
  268. var colMeta = null;
  269. if (column === 0) {
  270. colMeta = {type: 'text', readOnly: false};
  271. } else if (column === 1) {
  272. colMeta = {type: 'checkbox'};
  273. }
  274. return colMeta;
  275. }
  276. });
  277. expect(getCellMeta(0, 0).readOnly).toBe(false);
  278. expect($(getCell(0, 0)).hasClass('htDimmed')).toBe(false);
  279. expect(getCellMeta(0, 1).readOnly).toBe(true);
  280. expect($(getCell(0, 1)).hasClass('htDimmed')).toBe(true);
  281. });
  282. it('should not alter the columns object during init', () => {
  283. var columns = [
  284. {
  285. type: 'text'
  286. }
  287. ];
  288. var columnsCopy = JSON.parse(JSON.stringify(columns));
  289. handsontable({
  290. columns
  291. });
  292. expect(columns).toEqual(columnsCopy);
  293. });
  294. it('should update column type', () => {
  295. var columns = [
  296. {
  297. type: 'text'
  298. }
  299. ];
  300. handsontable({
  301. columns
  302. });
  303. expect(getCellMeta(0, 0).type).toEqual('text');
  304. expect(getCellRenderer(0, 0)).toBe(Handsontable.renderers.TextRenderer);
  305. expect(getCellEditor(0, 0)).toBe(Handsontable.editors.TextEditor);
  306. columns[0].type = 'date';
  307. updateSettings({
  308. columns
  309. });
  310. expect(getCellMeta(0, 0).type).toEqual('date');
  311. expect(getCellRenderer(0, 0)).toBe(Handsontable.renderers.AutocompleteRenderer);
  312. expect(getCellEditor(0, 0)).toEqual(Handsontable.editors.DateEditor);
  313. });
  314. it('should update cell type functions, even if new type does not implement all of those functions', () => {
  315. var columns = [
  316. {
  317. type: 'numeric'
  318. }
  319. ];
  320. handsontable({
  321. columns
  322. });
  323. expect(getCellMeta(0, 0).type).toEqual('numeric');
  324. expect(getCellRenderer(0, 0)).toBe(Handsontable.renderers.NumericRenderer);
  325. expect(getCellEditor(0, 0)).toBe(Handsontable.editors.NumericEditor);
  326. expect(getCellValidator(0, 0)).toBe(Handsontable.cellTypes.numeric.validator);
  327. columns[0].type = 'text';
  328. updateSettings({
  329. columns
  330. });
  331. expect(getCellMeta(0, 0).type).toEqual('text');
  332. expect(getCellRenderer(0, 0)).toBe(Handsontable.renderers.TextRenderer);
  333. expect(getCellEditor(0, 0)).toEqual(Handsontable.editors.TextEditor);
  334. expect(Handsontable.cellTypes.text.validator).toBeUndefined();
  335. expect(getCellValidator(0, 0)).toBeUndefined();
  336. });
  337. it('should allow updating the table height', function() {
  338. var hot = handsontable({
  339. startRows: 22,
  340. startCols: 5
  341. });
  342. var initialHeight = parseInt(this.$container[0].style.height, 10);
  343. updateSettings({
  344. height: 300
  345. });
  346. expect(parseInt(this.$container[0].style.height, 10)).toEqual(300);
  347. expect(parseInt(this.$container[0].style.height, 10)).not.toEqual(initialHeight);
  348. });
  349. it('should not reset the table height, when the updateSettings config object doesn\'t have any height specified', function() {
  350. var hot = handsontable({
  351. startRows: 22,
  352. startCols: 5,
  353. height: 300
  354. });
  355. var initialHeight = this.$container[0].style.height;
  356. updateSettings({
  357. rowHeaders: true
  358. });
  359. expect(parseInt(this.$container[0].style.height, 10)).toEqual(parseInt(initialHeight, 10));
  360. });
  361. it('should allow resetting the table height', function() {
  362. var hot = handsontable({
  363. startRows: 22,
  364. startCols: 5,
  365. height: 300
  366. });
  367. var initialHeight = this.$container[0].style.height;
  368. updateSettings({
  369. height: null
  370. });
  371. expect(parseInt(this.$container[0].style.height, 10)).not.toEqual(parseInt(initialHeight, 10));
  372. });
  373. it('should allow updating the stretching type', () => {
  374. var hot = handsontable({
  375. stretchH: 'last'
  376. });
  377. expect(hot.view.wt.getSetting('stretchH')).toEqual('last');
  378. updateSettings({
  379. stretchH: 'all'
  380. });
  381. expect(hot.view.wt.getSetting('stretchH')).toEqual('all');
  382. updateSettings({
  383. stretchH: 'none'
  384. });
  385. expect(hot.view.wt.getSetting('stretchH')).toEqual('none');
  386. updateSettings({
  387. stretchH: 'last'
  388. });
  389. expect(hot.view.wt.getSetting('stretchH')).toEqual('last');
  390. });
  391. it('should change colHeader\'s row height if is needed', function() {
  392. var hot = handsontable({
  393. colHeaders: true,
  394. rowHeaders: true
  395. });
  396. var rowHeights = [];
  397. rowHeights.push(this.$container.find('.ht_clone_top_left_corner thead th')[0].clientHeight);
  398. updateSettings({
  399. colHeaders: ['A<br/>A']
  400. });
  401. rowHeights.push(this.$container.find('.ht_clone_top_left_corner thead th')[0].clientHeight);
  402. expect(rowHeights[0]).toBeLessThan(rowHeights[1]);
  403. });
  404. it('should not overwrite properties (created by columns defined as function) of cells below the viewport by updateSettings #4029', function() {
  405. var rows = 50;
  406. var columns = 2;
  407. handsontable({
  408. data: Handsontable.helper.createSpreadsheetObjectData(columns, rows),
  409. columns: function (col) {
  410. var colProp = {
  411. data: 'prop' + col,
  412. readOnly: true
  413. };
  414. if (col === 1) {
  415. colProp.type = 'checkbox';
  416. }
  417. return colProp;
  418. }
  419. });
  420. updateSettings({});
  421. expect(getCellMeta(rows, 0).readOnly).toEqual(true);
  422. expect(getCellMeta(rows, 1).type).toEqual('checkbox');
  423. rows = 100;
  424. updateSettings({data: Handsontable.helper.createSpreadsheetObjectData(columns, rows)});
  425. expect(getCellMeta(rows, 0).readOnly).toEqual(true);
  426. expect(getCellMeta(rows, 1).type).toEqual('checkbox');
  427. updateSettings({
  428. columns: function (col) {
  429. var colProp = {
  430. data: 'prop' + col,
  431. type: 'numeric'
  432. };
  433. return colProp;
  434. }
  435. });
  436. expect(getCellMeta(0, 1).type).toEqual('numeric');
  437. expect(getCellMeta(0, 1).readOnly).toEqual(false);
  438. expect(getCellMeta(rows, 1).type).toEqual('numeric');
  439. expect(getCellMeta(rows, 1).readOnly).toEqual(false);
  440. });
  441. it('should not overwrite properties (created by columns defined as array) of cells below the viewport by updateSettings #4029', function() {
  442. var rows = 50;
  443. var columns = 2;
  444. handsontable({
  445. data: Handsontable.helper.createSpreadsheetObjectData(columns, rows),
  446. columns: [
  447. {
  448. type: 'numeric',
  449. format: '0,0.00 $'
  450. },
  451. {
  452. type: 'text',
  453. readOnly: true
  454. }
  455. ]
  456. });
  457. updateSettings({});
  458. expect(getCellMeta(rows, 0).type).toEqual('numeric');
  459. expect(getCellMeta(rows, 1).readOnly).toEqual(true);
  460. rows = 100;
  461. updateSettings({data: Handsontable.helper.createSpreadsheetObjectData(columns, rows)});
  462. expect(getCellMeta(rows, 0).type).toEqual('numeric');
  463. expect(getCellMeta(rows, 1).readOnly).toEqual(true);
  464. updateSettings({
  465. columns: [
  466. {
  467. type: 'text',
  468. readOnly: true
  469. },
  470. {
  471. type: 'numeric',
  472. format: '0,0.00 $'
  473. }
  474. ]
  475. });
  476. expect(getCellMeta(0, 0).type).toEqual('text');
  477. expect(getCellMeta(0, 0).readOnly).toEqual(true);
  478. expect(getCellMeta(0, 1).type).toEqual('numeric');
  479. expect(getCellMeta(0, 1).readOnly).toEqual(false);
  480. expect(getCellMeta(rows, 0).type).toEqual('text');
  481. expect(getCellMeta(rows, 1).type).toEqual('numeric');
  482. });
  483. });