You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

core.title.tests.js 4.0KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210
  1. // Test the rectangle element
  2. describe('Title block tests', function() {
  3. it('Should be constructed', function() {
  4. var title = new Chart.Title({});
  5. expect(title).not.toBe(undefined);
  6. });
  7. it('Should have the correct default config', function() {
  8. expect(Chart.defaults.global.title).toEqual({
  9. display: false,
  10. position: 'top',
  11. fullWidth: true,
  12. fontStyle: 'bold',
  13. padding: 10,
  14. text: ''
  15. })
  16. });
  17. it('should update correctly', function() {
  18. var chart = {};
  19. var options = Chart.helpers.clone(Chart.defaults.global.title);
  20. options.text = "My title";
  21. var title = new Chart.Title({
  22. chart: chart,
  23. options: options
  24. });
  25. var minSize = title.update(400, 200);
  26. expect(minSize).toEqual({
  27. width: 400,
  28. height: 0
  29. });
  30. // Now we have a height since we display
  31. title.options.display = true;
  32. minSize = title.update(400, 200);
  33. expect(minSize).toEqual({
  34. width: 400,
  35. height: 32
  36. });
  37. });
  38. it('should update correctly when vertical', function() {
  39. var chart = {};
  40. var options = Chart.helpers.clone(Chart.defaults.global.title);
  41. options.text = "My title";
  42. options.position = 'left';
  43. var title = new Chart.Title({
  44. chart: chart,
  45. options: options
  46. });
  47. var minSize = title.update(200, 400);
  48. expect(minSize).toEqual({
  49. width: 0,
  50. height: 400
  51. });
  52. // Now we have a height since we display
  53. title.options.display = true;
  54. minSize = title.update(200, 400);
  55. expect(minSize).toEqual({
  56. width: 32,
  57. height: 400
  58. });
  59. });
  60. it('should draw correctly horizontally', function() {
  61. var chart = {};
  62. var context = window.createMockContext();
  63. var options = Chart.helpers.clone(Chart.defaults.global.title);
  64. options.text = "My title";
  65. var title = new Chart.Title({
  66. chart: chart,
  67. options: options,
  68. ctx: context
  69. });
  70. title.update(400, 200);
  71. title.draw();
  72. expect(context.getCalls()).toEqual([]);
  73. // Now we have a height since we display
  74. title.options.display = true;
  75. var minSize = title.update(400, 200);
  76. title.top = 50;
  77. title.left = 100;
  78. title.bottom = title.top + minSize.height;
  79. title.right = title.left + minSize.width;
  80. title.draw();
  81. expect(context.getCalls()).toEqual([{
  82. name: 'setFillStyle',
  83. args: ['#666']
  84. }, {
  85. name: 'save',
  86. args: []
  87. }, {
  88. name: 'translate',
  89. args: [300, 66]
  90. }, {
  91. name: 'rotate',
  92. args: [0]
  93. }, {
  94. name: 'fillText',
  95. args: ['My title', 0, 0]
  96. }, {
  97. name: 'restore',
  98. args: []
  99. }]);
  100. });
  101. it ('should draw correctly vertically', function() {
  102. var chart = {};
  103. var context = window.createMockContext();
  104. var options = Chart.helpers.clone(Chart.defaults.global.title);
  105. options.text = "My title";
  106. options.position = 'left';
  107. var title = new Chart.Title({
  108. chart: chart,
  109. options: options,
  110. ctx: context
  111. });
  112. title.update(200, 400);
  113. title.draw();
  114. expect(context.getCalls()).toEqual([]);
  115. // Now we have a height since we display
  116. title.options.display = true;
  117. var minSize = title.update(200, 400);
  118. title.top = 50;
  119. title.left = 100;
  120. title.bottom = title.top + minSize.height;
  121. title.right = title.left + minSize.width;
  122. title.draw();
  123. expect(context.getCalls()).toEqual([{
  124. name: 'setFillStyle',
  125. args: ['#666']
  126. }, {
  127. name: 'save',
  128. args: []
  129. }, {
  130. name: 'translate',
  131. args: [106, 250]
  132. }, {
  133. name: 'rotate',
  134. args: [-0.5 * Math.PI]
  135. }, {
  136. name: 'fillText',
  137. args: ['My title', 0, 0]
  138. }, {
  139. name: 'restore',
  140. args: []
  141. }]);
  142. // Rotation is other way on right side
  143. title.options.position = 'right';
  144. // Reset call tracker
  145. context.resetCalls();
  146. minSize = title.update(200, 400);
  147. title.top = 50;
  148. title.left = 100;
  149. title.bottom = title.top + minSize.height;
  150. title.right = title.left + minSize.width;
  151. title.draw();
  152. expect(context.getCalls()).toEqual([{
  153. name: 'setFillStyle',
  154. args: ['#666']
  155. }, {
  156. name: 'save',
  157. args: []
  158. }, {
  159. name: 'translate',
  160. args: [126, 250]
  161. }, {
  162. name: 'rotate',
  163. args: [0.5 * Math.PI]
  164. }, {
  165. name: 'fillText',
  166. args: ['My title', 0, 0]
  167. }, {
  168. name: 'restore',
  169. args: []
  170. }]);
  171. });
  172. });