defaultConfig.tests.js 6.4KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219220221222223224225226227228229230231232233234235236237238239240241242243244245246247248249250251252253254255256257258259260261262263264265266267268269270271272273274275276277278279280281282283284285286287288289290291292293
  1. // Test the bubble chart default config
  2. describe("Test the bubble chart default config", function() {
  3. it('should reutrn correct tooltip strings', function() {
  4. var config = Chart.defaults.bubble;
  5. // Title is always blank
  6. expect(config.tooltips.callbacks.title()).toBe('');
  7. // Item label
  8. var data = {
  9. datasets: [{
  10. label: 'My dataset',
  11. data: [{
  12. x: 10,
  13. y: 12,
  14. r: 5
  15. }]
  16. }]
  17. };
  18. var tooltipItem = {
  19. datasetIndex: 0,
  20. index: 0
  21. };
  22. expect(config.tooltips.callbacks.label(tooltipItem, data)).toBe('My dataset: (10, 12, 5)');
  23. });
  24. });
  25. describe('Test the doughnut chart default config', function() {
  26. it('should return correct tooltip strings', function() {
  27. var config = Chart.defaults.doughnut;
  28. // Title is always blank
  29. expect(config.tooltips.callbacks.title()).toBe('');
  30. // Item label
  31. var data = {
  32. labels: ['label1', 'label2', 'label3'],
  33. datasets: [{
  34. data: [10, 20, 30],
  35. }]
  36. };
  37. var tooltipItem = {
  38. datasetIndex: 0,
  39. index: 1
  40. };
  41. expect(config.tooltips.callbacks.label(tooltipItem, data)).toBe('label2: 20');
  42. });
  43. it('should return the correct html legend', function() {
  44. var config = Chart.defaults.doughnut;
  45. var chart = {
  46. id: 'mychart',
  47. data: {
  48. labels: ['label1', 'label2'],
  49. datasets: [{
  50. data: [10, 20],
  51. backgroundColor: ['red', 'green']
  52. }]
  53. }
  54. };
  55. var expectedLegend = '<ul class="mychart-legend"><li><span style="background-color:red"></span>label1</li><li><span style="background-color:green"></span>label2</li></ul>';
  56. expect(config.legendCallback(chart)).toBe(expectedLegend);
  57. });
  58. it('should return correct legend label objects', function() {
  59. var config = Chart.defaults.doughnut;
  60. var data = {
  61. labels: ['label1', 'label2', 'label3'],
  62. datasets: [{
  63. data: [10, 20, NaN],
  64. backgroundColor: ['red', 'green', 'blue'],
  65. metaData: [{}, {}, {}]
  66. }]
  67. };
  68. var expected = [{
  69. text: 'label1',
  70. fillStyle: 'red',
  71. hidden: false,
  72. index: 0,
  73. strokeStyle: '#000',
  74. lineWidth: 2
  75. }, {
  76. text: 'label2',
  77. fillStyle: 'green',
  78. hidden: false,
  79. index: 1,
  80. strokeStyle: '#000',
  81. lineWidth: 2
  82. }, {
  83. text: 'label3',
  84. fillStyle: 'blue',
  85. hidden: true,
  86. index: 2,
  87. strokeStyle: '#000',
  88. lineWidth: 2
  89. }];
  90. var chart = {
  91. data: data,
  92. options: {
  93. elements: {
  94. arc: {
  95. borderWidth: 2,
  96. borderColor: '#000'
  97. }
  98. }
  99. }
  100. };
  101. expect(config.legend.labels.generateLabels.call({ chart: chart }, data)).toEqual(expected);
  102. });
  103. it('should hide the correct arc when a legend item is clicked', function() {
  104. var config = Chart.defaults.doughnut;
  105. var legendItem = {
  106. text: 'label1',
  107. fillStyle: 'red',
  108. hidden: false,
  109. index: 0
  110. };
  111. var chart = {
  112. data: {
  113. labels: ['label1', 'label2', 'label3'],
  114. datasets: [{
  115. data: [10, 20, NaN],
  116. backgroundColor: ['red', 'green', 'blue']
  117. }]
  118. },
  119. update: function() {}
  120. };
  121. spyOn(chart, 'update');
  122. var scope = {
  123. chart: chart
  124. };
  125. config.legend.onClick.call(scope, null, legendItem);
  126. expect(chart.data.datasets[0].metaHiddenData).toEqual([10]);
  127. expect(chart.data.datasets[0].data).toEqual([NaN, 20, NaN]);
  128. expect(chart.update).toHaveBeenCalled();
  129. config.legend.onClick.call(scope, null, legendItem);
  130. expect(chart.data.datasets[0].data).toEqual([10, 20, NaN]);
  131. // Should not toggle index 2 since there was never data for it
  132. legendItem.index = 2;
  133. config.legend.onClick.call(scope, null, legendItem);
  134. expect(chart.data.datasets[0].data).toEqual([10, 20, NaN]);
  135. });
  136. });
  137. describe('Test the polar area chart default config', function() {
  138. it('should return correct tooltip strings', function() {
  139. var config = Chart.defaults.polarArea;
  140. // Title is always blank
  141. expect(config.tooltips.callbacks.title()).toBe('');
  142. // Item label
  143. var data = {
  144. labels: ['label1', 'label2', 'label3'],
  145. datasets: [{
  146. data: [10, 20, 30],
  147. }]
  148. };
  149. var tooltipItem = {
  150. datasetIndex: 0,
  151. index: 1,
  152. yLabel: 20
  153. };
  154. expect(config.tooltips.callbacks.label(tooltipItem, data)).toBe('label2: 20');
  155. });
  156. it('should return the correct html legend', function() {
  157. var config = Chart.defaults.polarArea;
  158. var chart = {
  159. id: 'mychart',
  160. data: {
  161. labels: ['label1', 'label2'],
  162. datasets: [{
  163. data: [10, 20],
  164. backgroundColor: ['red', 'green']
  165. }]
  166. }
  167. };
  168. var expectedLegend = '<ul class="mychart-legend"><li><span style="background-color:red">label1</span></li><li><span style="background-color:green">label2</span></li></ul>';
  169. expect(config.legendCallback(chart)).toBe(expectedLegend);
  170. });
  171. it('should return correct legend label objects', function() {
  172. var config = Chart.defaults.polarArea;
  173. var data = {
  174. labels: ['label1', 'label2', 'label3'],
  175. datasets: [{
  176. data: [10, 20, NaN],
  177. backgroundColor: ['red', 'green', 'blue'],
  178. metaData: [{}, {}, {}]
  179. }]
  180. };
  181. var expected = [{
  182. text: 'label1',
  183. fillStyle: 'red',
  184. hidden: false,
  185. index: 0,
  186. strokeStyle: '#000',
  187. lineWidth: 2
  188. }, {
  189. text: 'label2',
  190. fillStyle: 'green',
  191. hidden: false,
  192. index: 1,
  193. strokeStyle: '#000',
  194. lineWidth: 2
  195. }, {
  196. text: 'label3',
  197. fillStyle: 'blue',
  198. hidden: true,
  199. index: 2,
  200. strokeStyle: '#000',
  201. lineWidth: 2
  202. }];
  203. var chart = {
  204. data: data,
  205. options: {
  206. elements: {
  207. arc: {
  208. borderWidth: 2,
  209. borderColor: '#000'
  210. }
  211. }
  212. }
  213. };
  214. expect(config.legend.labels.generateLabels.call({ chart: chart }, data)).toEqual(expected);
  215. });
  216. it('should hide the correct arc when a legend item is clicked', function() {
  217. var config = Chart.defaults.polarArea;
  218. var legendItem = {
  219. text: 'label1',
  220. fillStyle: 'red',
  221. hidden: false,
  222. index: 0
  223. };
  224. var chart = {
  225. data: {
  226. labels: ['label1', 'label2', 'label3'],
  227. datasets: [{
  228. data: [10, 20, NaN],
  229. backgroundColor: ['red', 'green', 'blue']
  230. }]
  231. },
  232. update: function() {}
  233. };
  234. spyOn(chart, 'update');
  235. var scope = {
  236. chart: chart
  237. };
  238. config.legend.onClick.call(scope, null, legendItem);
  239. expect(chart.data.datasets[0].metaHiddenData).toEqual([10]);
  240. expect(chart.data.datasets[0].data).toEqual([NaN, 20, NaN]);
  241. expect(chart.update).toHaveBeenCalled();
  242. config.legend.onClick.call(scope, null, legendItem);
  243. expect(chart.data.datasets[0].data).toEqual([10, 20, NaN]);
  244. // Should not toggle index 2 since there was never data for it
  245. legendItem.index = 2;
  246. config.legend.onClick.call(scope, null, legendItem);
  247. expect(chart.data.datasets[0].data).toEqual([10, 20, NaN]);
  248. });
  249. });