Start again

vendors/Chart.js/test/core.title.tests.js

@@ -0,0 +1,210 @@
+// Test the rectangle element
+
+describe('Title block tests', function() {
+	it('Should be constructed', function() {
+		var title = new Chart.Title({});
+		expect(title).not.toBe(undefined);
+	});
+
+	it('Should have the correct default config', function() {
+		expect(Chart.defaults.global.title).toEqual({
+			display: false,
+			position: 'top',
+			fullWidth: true,
+			fontStyle: 'bold',
+			padding: 10,
+			text: ''
+		})
+	});
+
+	it('should update correctly', function() {
+		var chart = {};
+
+		var options = Chart.helpers.clone(Chart.defaults.global.title);
+		options.text = "My title";
+
+		var title = new Chart.Title({
+			chart: chart,
+			options: options
+		});
+
+		var minSize = title.update(400, 200);
+
+		expect(minSize).toEqual({
+			width: 400,
+			height: 0
+		});
+
+		// Now we have a height since we display
+		title.options.display = true;
+
+		minSize = title.update(400, 200);
+
+		expect(minSize).toEqual({
+			width: 400,
+			height: 32
+		});
+	});
+
+	it('should update correctly when vertical', function() {
+		var chart = {};
+
+		var options = Chart.helpers.clone(Chart.defaults.global.title);
+		options.text = "My title";
+		options.position = 'left';
+
+		var title = new Chart.Title({
+			chart: chart,
+			options: options
+		});
+
+		var minSize = title.update(200, 400);
+
+		expect(minSize).toEqual({
+			width: 0,
+			height: 400
+		});
+
+		// Now we have a height since we display
+		title.options.display = true;
+
+		minSize = title.update(200, 400);
+
+		expect(minSize).toEqual({
+			width: 32,
+			height: 400
+		});
+	});
+
+	it('should draw correctly horizontally', function() {
+		var chart = {};
+		var context = window.createMockContext();
+
+		var options = Chart.helpers.clone(Chart.defaults.global.title);
+		options.text = "My title";
+
+		var title = new Chart.Title({
+			chart: chart,
+			options: options,
+			ctx: context
+		});
+
+		title.update(400, 200);
+		title.draw();
+
+		expect(context.getCalls()).toEqual([]);
+
+		// Now we have a height since we display
+		title.options.display = true;
+
+		var minSize = title.update(400, 200);
+		title.top = 50;
+		title.left = 100;
+		title.bottom = title.top + minSize.height;
+		title.right = title.left + minSize.width;
+		title.draw();
+
+		expect(context.getCalls()).toEqual([{
+			name: 'setFillStyle',
+			args: ['#666']
+		}, {
+			name: 'save',
+			args: []
+		}, {
+			name: 'translate',
+			args: [300, 66]
+		}, {
+			name: 'rotate',
+			args: [0]
+		}, {
+			name: 'fillText',
+			args: ['My title', 0, 0]
+		}, {
+			name: 'restore',
+			args: []
+		}]);
+	});
+
+	it ('should draw correctly vertically', function() {
+		var chart = {};
+		var context = window.createMockContext();
+
+		var options = Chart.helpers.clone(Chart.defaults.global.title);
+		options.text = "My title";
+		options.position = 'left';
+
+		var title = new Chart.Title({
+			chart: chart,
+			options: options,
+			ctx: context
+		});
+
+		title.update(200, 400);
+		title.draw();
+
+		expect(context.getCalls()).toEqual([]);
+
+		// Now we have a height since we display
+		title.options.display = true;
+
+		var minSize = title.update(200, 400);
+		title.top = 50;
+		title.left = 100;
+		title.bottom = title.top + minSize.height;
+		title.right = title.left + minSize.width;
+		title.draw();
+
+		expect(context.getCalls()).toEqual([{
+			name: 'setFillStyle',
+			args: ['#666']
+		}, {
+			name: 'save',
+			args: []
+		}, {
+			name: 'translate',
+			args: [106, 250]
+		}, {
+			name: 'rotate',
+			args: [-0.5 * Math.PI]
+		}, {
+			name: 'fillText',
+			args: ['My title', 0, 0]
+		}, {
+			name: 'restore',
+			args: []
+		}]);
+
+		// Rotation is other way on right side
+		title.options.position = 'right';
+
+		// Reset call tracker
+		context.resetCalls();
+
+		minSize = title.update(200, 400);
+		title.top = 50;
+		title.left = 100;
+		title.bottom = title.top + minSize.height;
+		title.right = title.left + minSize.width;
+		title.draw();
+
+		expect(context.getCalls()).toEqual([{
+			name: 'setFillStyle',
+			args: ['#666']
+		}, {
+			name: 'save',
+			args: []
+		}, {
+			name: 'translate',
+			args: [126, 250]
+		}, {
+			name: 'rotate',
+			args: [0.5 * Math.PI]
+		}, {
+			name: 'fillText',
+			args: ['My title', 0, 0]
+		}, {
+			name: 'restore',
+			args: []
+		}]);
+	});
+});