gentelella/vendors/Chart.js/test/defaultConfig.tests.js

// Test the bubble chart default config
describe("Test the bubble chart default config", function() {
	it('should reutrn correct tooltip strings', function() {
		var config = Chart.defaults.bubble;

		// Title is always blank
		expect(config.tooltips.callbacks.title()).toBe('');

		// Item label
		var data = {
			datasets: [{
				label: 'My dataset',
				data: [{
					x: 10,
					y: 12,
					r: 5
				}]
			}]
		};

		var tooltipItem = {
			datasetIndex: 0,
			index: 0
		};

		expect(config.tooltips.callbacks.label(tooltipItem, data)).toBe('My dataset: (10, 12, 5)');
	});
});

describe('Test the doughnut chart default config', function() {
	it('should return correct tooltip strings', function() {
		var config = Chart.defaults.doughnut;

		// Title is always blank
		expect(config.tooltips.callbacks.title()).toBe('');

		// Item label
		var data = {
			labels: ['label1', 'label2', 'label3'],
			datasets: [{
				data: [10, 20, 30],
			}]
		};

		var tooltipItem = {
			datasetIndex: 0,
			index: 1
		};

		expect(config.tooltips.callbacks.label(tooltipItem, data)).toBe('label2: 20');
	});

	it('should return the correct html legend', function() {
		var config = Chart.defaults.doughnut;

		var chart = {
			id: 'mychart',
			data: {
				labels: ['label1', 'label2'],
				datasets: [{
					data: [10, 20],
					backgroundColor: ['red', 'green']
				}]
			}
		};
		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>';

		expect(config.legendCallback(chart)).toBe(expectedLegend);
	});

	it('should return correct legend label objects', function() {
		var config = Chart.defaults.doughnut;
		var data = {
			labels: ['label1', 'label2', 'label3'],
			datasets: [{
				data: [10, 20, NaN],
				backgroundColor: ['red', 'green', 'blue'],
				metaData: [{}, {}, {}]
			}]
		};

		var expected = [{
			text: 'label1',
			fillStyle: 'red',
			hidden: false,
			index: 0,
			strokeStyle: '#000',
			lineWidth: 2
		}, {
			text: 'label2',
			fillStyle: 'green',
			hidden: false,
			index: 1,
			strokeStyle: '#000',
			lineWidth: 2
		}, {
			text: 'label3',
			fillStyle: 'blue',
			hidden: true,
			index: 2,
			strokeStyle: '#000',
			lineWidth: 2
		}];

		var chart = {
			data: data,
			options: {
				elements: {
					arc: {
						borderWidth: 2,
						borderColor: '#000'
					}
				}
			}
		};
		expect(config.legend.labels.generateLabels.call({ chart: chart }, data)).toEqual(expected);
	});

	it('should hide the correct arc when a legend item is clicked', function() {
		var config = Chart.defaults.doughnut;

		var legendItem = {
			text: 'label1',
			fillStyle: 'red',
			hidden: false,
			index: 0
		};

		var chart = {
			data: {
				labels: ['label1', 'label2', 'label3'],
				datasets: [{
					data: [10, 20, NaN],
					backgroundColor: ['red', 'green', 'blue']
				}]
			},
			update: function() {}
		};

		spyOn(chart, 'update');
		var scope = {
			chart: chart
		};

		config.legend.onClick.call(scope, null, legendItem);

		expect(chart.data.datasets[0].metaHiddenData).toEqual([10]);
		expect(chart.data.datasets[0].data).toEqual([NaN, 20, NaN]);

		expect(chart.update).toHaveBeenCalled();

		config.legend.onClick.call(scope, null, legendItem);
		expect(chart.data.datasets[0].data).toEqual([10, 20, NaN]);

		// Should not toggle index 2 since there was never data for it
		legendItem.index = 2;
		config.legend.onClick.call(scope, null, legendItem);
		expect(chart.data.datasets[0].data).toEqual([10, 20, NaN]);
	});
});

describe('Test the polar area chart default config', function() {
	it('should return correct tooltip strings', function() {
		var config = Chart.defaults.polarArea;

		// Title is always blank
		expect(config.tooltips.callbacks.title()).toBe('');

		// Item label
		var data = {
			labels: ['label1', 'label2', 'label3'],
			datasets: [{
				data: [10, 20, 30],
			}]
		};

		var tooltipItem = {
			datasetIndex: 0,
			index: 1,
			yLabel: 20
		};

		expect(config.tooltips.callbacks.label(tooltipItem, data)).toBe('label2: 20');
	});

	it('should return the correct html legend', function() {
		var config = Chart.defaults.polarArea;

		var chart = {
			id: 'mychart',
			data: {
				labels: ['label1', 'label2'],
				datasets: [{
					data: [10, 20],
					backgroundColor: ['red', 'green']
				}]
			}
		};
		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>';

		expect(config.legendCallback(chart)).toBe(expectedLegend);
	});

	it('should return correct legend label objects', function() {
		var config = Chart.defaults.polarArea;
		var data = {
			labels: ['label1', 'label2', 'label3'],
			datasets: [{
				data: [10, 20, NaN],
				backgroundColor: ['red', 'green', 'blue'],
				metaData: [{}, {}, {}]
			}]
		};

		var expected = [{
			text: 'label1',
			fillStyle: 'red',
			hidden: false,
			index: 0,
			strokeStyle: '#000',
			lineWidth: 2
		}, {
			text: 'label2',
			fillStyle: 'green',
			hidden: false,
			index: 1,
			strokeStyle: '#000',
			lineWidth: 2
		}, {
			text: 'label3',
			fillStyle: 'blue',
			hidden: true,
			index: 2,
			strokeStyle: '#000',
			lineWidth: 2
		}];

		var chart = {
			data: data,
			options: {
				elements: {
					arc: {
						borderWidth: 2,
						borderColor: '#000'
					}
				}
			}
		};
		expect(config.legend.labels.generateLabels.call({ chart: chart }, data)).toEqual(expected);
	});

	it('should hide the correct arc when a legend item is clicked', function() {
		var config = Chart.defaults.polarArea;

		var legendItem = {
			text: 'label1',
			fillStyle: 'red',
			hidden: false,
			index: 0
		};

		var chart = {
			data: {
				labels: ['label1', 'label2', 'label3'],
				datasets: [{
					data: [10, 20, NaN],
					backgroundColor: ['red', 'green', 'blue']
				}]
			},
			update: function() {}
		};

		spyOn(chart, 'update');
		var scope = {
			chart: chart
		};

		config.legend.onClick.call(scope, null, legendItem);

		expect(chart.data.datasets[0].metaHiddenData).toEqual([10]);
		expect(chart.data.datasets[0].data).toEqual([NaN, 20, NaN]);

		expect(chart.update).toHaveBeenCalled();

		config.legend.onClick.call(scope, null, legendItem);
		expect(chart.data.datasets[0].data).toEqual([10, 20, NaN]);

		// Should not toggle index 2 since there was never data for it
		legendItem.index = 2;
		config.legend.onClick.call(scope, null, legendItem);
		expect(chart.data.datasets[0].data).toEqual([10, 20, NaN]);
	});
});