dc1baebd3ac4da1f8fa1b66c366b74ec72cd15e8068924461073537c05fb419f12182461008f8e60c50d3d70c9f5e770dbbfd9d13c19910896359d003859de 4.0 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127
  1. describe('columnHeaders option', function () {
  2. var $table,
  3. $container,
  4. $wrapper,
  5. debug = false;
  6. beforeEach(function () {
  7. $wrapper = $('<div></div>').css({ overflow: 'hidden', position: 'relative' });
  8. $wrapper.width(500).height(201);
  9. $container = $('<div></div>');
  10. $table = $('<table></table>'); // create a table that is not attached to document
  11. $wrapper.append($container);
  12. $container.append($table);
  13. $wrapper.appendTo('body');
  14. createDataArray();
  15. });
  16. afterEach(function () {
  17. if (!debug) {
  18. $('.wtHolder').remove();
  19. }
  20. $wrapper.remove();
  21. });
  22. it('should not add class `htColumnHeaders` when column headers are disabled', function () {
  23. var wt = new Walkontable.Core({
  24. table: $table[0],
  25. data: getData,
  26. totalRows: getTotalRows,
  27. totalColumns: getTotalColumns
  28. });
  29. wt.draw();
  30. expect($wrapper.hasClass('htColumnHeaders')).toBe(false);
  31. });
  32. it('should add class `htColumnHeaders` when column headers are enabled', function () {
  33. var wt = new Walkontable.Core({
  34. table: $table[0],
  35. data: getData,
  36. totalRows: getTotalRows,
  37. totalColumns: getTotalColumns,
  38. columnHeaders: [function (col, TH) {
  39. TH.innerHTML = col + 1;
  40. }]
  41. });
  42. wt.draw();
  43. expect($wrapper.hasClass('htColumnHeaders')).toBe(true);
  44. });
  45. it('should create table with column headers', function () {
  46. var wt = new Walkontable.Core({
  47. table: $table[0],
  48. data: getData,
  49. totalRows: getTotalRows,
  50. totalColumns: getTotalColumns,
  51. columnHeaders: [function (col, TH) {
  52. TH.innerHTML = col + 1;
  53. }]
  54. });
  55. wt.draw();
  56. expect($wrapper.find('.ht_clone_left colgroup col').length).toBe(0);
  57. expect($wrapper.find('.ht_clone_left thead tr').length).toBe(1);
  58. expect($wrapper.find('.ht_clone_left tbody tr').length).toBe(0);
  59. expect($wrapper.find('.ht_clone_top colgroup col').length).toBe(4);
  60. expect($wrapper.find('.ht_clone_top thead tr').length).toBe(1);
  61. expect($wrapper.find('.ht_clone_top tbody tr').length).toBe(0);
  62. expect($wrapper.find('.ht_master colgroup col').length).toBe(4);
  63. expect($wrapper.find('.ht_master thead tr').length).toBe(1);
  64. expect($wrapper.find('.ht_master tbody tr').length).toBe(9);
  65. });
  66. it('should create column headers with correct height when th has css `white-space: normal`', function () {
  67. var style = $('<style>.handsontable thead th {white-space: normal;}</style>').appendTo('head');
  68. var wt = new Walkontable.Core({
  69. table: $table[0],
  70. data: getData,
  71. totalRows: getTotalRows,
  72. totalColumns: getTotalColumns,
  73. columnHeaders: [function (col, TH) {
  74. TH.innerHTML = 'Client State State';
  75. }],
  76. columnWidth: 80
  77. });
  78. wt.draw();
  79. expect($wrapper.find('.ht_clone_top thead tr').height()).toBe(43);
  80. style.remove();
  81. });
  82. it('should create column headers with correct height when th has css `white-space: pre-line` (default)', function () {
  83. var wt = new Walkontable.Core({
  84. table: $table[0],
  85. data: getData,
  86. totalRows: getTotalRows,
  87. totalColumns: getTotalColumns,
  88. columnHeaders: [function (col, TH) {
  89. TH.innerHTML = 'Client State State';
  90. }],
  91. columnWidth: 80
  92. });
  93. wt.draw();
  94. expect($wrapper.find('.ht_clone_top thead tr').height()).toBe(23);
  95. });
  96. it('should generate column headers from function', function () {
  97. var headers = ['Description', 2012, 2013, 2014];
  98. var wt = new Walkontable.Core({
  99. table: $table[0],
  100. data: getData,
  101. totalRows: getTotalRows,
  102. totalColumns: getTotalColumns,
  103. columnHeaders: [function (column, TH) {
  104. TH.innerHTML = headers[column];
  105. }]
  106. });
  107. wt.draw();
  108. var visibleHeaders = headers.slice(0, wt.wtTable.getLastRenderedColumn() + 1); // headers for rendered columns only
  109. expect($table.find('thead tr:first th').length).toBe(visibleHeaders.length);
  110. expect($table.find('thead tr:first th').text()).toEqual(visibleHeaders.join(''));
  111. });
  112. });