better tests for height/contentHeight. considers "auto"

tests/automated/contentHeight.js

@@ -1,49 +0,0 @@
-
-describe('contentHeight', function() {
-
-	beforeEach(function() {
-		affix('#cal');
-		$('#cal').width(900);
-	});
-
-	describe('when the default options are used', function() {
-		it('should set the height', function() {
-			$('#cal').width(1350);
-			$('#cal').fullCalendar();
-			var height = $('.fc-view-container').height();
-			expect(height).toEqual(1000);
-		});
-	});
-
-	describe('when the content height is set', function() {
-		it('should set the content height', function() {
-			$('#cal').fullCalendar({
-				contentHeight: 1000
-			});
-			var height = $('.fc-view-container').height();
-			expect(height).toEqual(1000);
-		});
-		it('should not change the container width', function() {
-			$('#cal').fullCalendar({
-				contentHeight: 1000
-			});
-			var width = $('#cal').width();
-			expect(width).toEqual(900);
-		});
-	});
-
-	describe('when the content height setter is used', function() {
-		it('should set the content height', function() {
-			$('#cal').fullCalendar();
-			$('#cal').fullCalendar('option', 'contentHeight', 1137);
-			var height = $('.fc-view-container').height();
-			expect(height).toEqual(1137);
-		});
-		it('should not change the container width', function() {
-			$('#cal').fullCalendar();
-			$('#cal').fullCalendar('option', 'contentHeight', 1137);
-			var width = $('#cal').width();
-			expect(width).toEqual(900);
-		});
-	});
-});

tests/automated/height-and-contentHeight.js

@@ -0,0 +1,241 @@
+(function() {
+
+[ 'height', 'contentHeight' ].forEach(function(heightProp) { describe(heightProp, function() {
+
+	var options;
+	var heightElm;
+	var asAMethod;
+
+	beforeEach(function() {
+		affix('#cal');
+		$('#cal').width(900);
+		options = {
+			defaultDate: '2014-08-01'
+		};
+	});
+
+	function init(heightVal) {
+		if (asAMethod) {
+			$('#cal').fullCalendar(options);
+			$('#cal').fullCalendar('option', heightProp, heightVal);
+		}
+		else {
+			options[heightProp] = heightVal;
+			$('#cal').fullCalendar(options);
+		}
+
+		if (heightProp === 'height') {
+			heightElm = $('.fc');
+		}
+		else {
+			heightElm = $('.fc-view');
+		}
+	}
+
+	$.each({
+		'as an init option': false,
+		'as a method': true
+	}, function(desc, bool) { describe(desc, function() {
+
+		beforeEach(function() {
+			asAMethod = bool;
+		});
+
+		describe('when in month view', function() {
+			beforeEach(function() {
+				options.defaultView = 'month';
+			});
+
+			describe('as a number, when there are no events', function() {
+				it('should be the specified height, with no scrollbars', function() {
+					init(600);
+					expect(heightElm.outerHeight()).toBe(600);
+					expect('.fc-day-grid-container').not.toHaveScrollbars();
+				});
+			});
+
+			describe('as a number, when there is one tall row of events', function() {
+				beforeEach(function() {
+					options.events = repeatClone({ title: 'event', start: '2014-08-04' }, 9);
+				});
+				it('should take away height from other rows, but not do scrollbars', function() {
+					init(600);
+					var rows = $('.fc-day-grid .fc-row');
+					var tallRow = rows.eq(1);
+					var shortRows = rows.not(tallRow); // 0, 2, 3, 4, 5
+					var shortHeight = shortRows.eq(0).outerHeight();
+
+					expect(heightElm.outerHeight()).toBe(600);
+
+					shortRows.each(function(i, node) {
+						var rowHeight = $(node).outerHeight();
+						var diff = Math.abs(rowHeight - shortHeight);
+						expect(diff).toBeLessThan(10); // all roughly the same
+					});
+
+					expect(tallRow.outerHeight()).toBeGreaterThan(shortHeight * 2); // much taller
+					expect('.fc-day-grid-container').not.toHaveScrollbars();
+				});
+			});
+
+			describe('as a number, when there are many tall rows of events', function() {
+				beforeEach(function() {
+					options.events = [].concat(
+						repeatClone({ title: 'event0', start: '2014-07-28' }, 9),
+						repeatClone({ title: 'event1', start: '2014-08-04' }, 9),
+						repeatClone({ title: 'event2', start: '2014-08-11' }, 9),
+						repeatClone({ title: 'event3', start: '2014-08-18' }, 9),
+						repeatClone({ title: 'event4', start: '2014-08-25' }, 9),
+						repeatClone({ title: 'event5', start: '2014-09-01' }, 9)
+					);
+				});
+				it('height is correct and scrollbars show up', function() {
+					init(600);
+					expect(heightElm.outerHeight()).toBe(600);
+					expect($('.fc-day-grid-container')).toHaveScrollbars();
+				});
+			});
+
+			describe('as "auto", when there are many tall rows of events', function() {
+				beforeEach(function() {
+					options.events = [].concat(
+						repeatClone({ title: 'event0', start: '2014-07-28' }, 9),
+						repeatClone({ title: 'event1', start: '2014-08-04' }, 9),
+						repeatClone({ title: 'event2', start: '2014-08-11' }, 9),
+						repeatClone({ title: 'event3', start: '2014-08-18' }, 9),
+						repeatClone({ title: 'event4', start: '2014-08-25' }, 9),
+						repeatClone({ title: 'event5', start: '2014-09-01' }, 9)
+					);
+				});
+				it('height is really tall and there are no scrollbars', function() {
+					init('auto');
+					expect(heightElm.outerHeight()).toBeGreaterThan(1000); // pretty tall
+					expect($('.fc-day-grid-container')).not.toHaveScrollbars();
+				});
+			});
+		});
+
+		[ 'basicWeek', 'basicDay' ].forEach(function(viewName) {
+			describe('in ' + viewName + ' view', function() {
+				beforeEach(function() {
+					options.defaultView = viewName;
+				});
+
+				describe('as a number, when there are no events', function() {
+					it('should be the specified height, with no scrollbars', function() {
+						init(600);
+						expect(heightElm.outerHeight()).toBe(600);
+						expect('.fc-day-grid-container').not.toHaveScrollbars();
+					});
+				});
+
+				describe('as a number, when there are many events', function() {
+					beforeEach(function() {
+						options.events = repeatClone({ title: 'event', start: '2014-08-01' }, 100);
+					});
+					it('should have the correct height, with scrollbars', function() {
+						init(600);
+						expect(heightElm.outerHeight()).toBe(600);
+						expect('.fc-day-grid-container').toHaveScrollbars();
+					});
+				});
+
+				describe('as "auto", when there are many events', function() {
+					beforeEach(function() {
+						options.events = repeatClone({ title: 'event', start: '2014-08-01' }, 100);
+					});
+					it('should be really tall with no scrollbars', function() {
+						init('auto');
+						expect(heightElm.outerHeight()).toBeGreaterThan(1000); // pretty tall
+						expect('.fc-day-grid-container').not.toHaveScrollbars();
+					});
+				});
+			});
+		});
+
+		[ 'agendaWeek', 'agendaDay' ].forEach(function(viewName) {
+			describe('in ' + viewName + ' view', function() {
+				beforeEach(function() {
+					options.defaultView = viewName;
+				});
+
+				$.each({
+					'with no all-day section': { allDaySlot: false },
+					'with no all-day events': { },
+					'with some all-day events': { events: repeatClone({ title: 'event', start: '2014-08-01' }, 6) }
+				}, function(desc, moreOptions) {
+					describe(desc, function() {
+						beforeEach(function() {
+							$.extend(options, moreOptions);
+						});
+
+						describe('as a number, with only a few slots', function() {
+							beforeEach(function() {
+								options.minTime = '06:00:00';
+								options.maxTime = '10:00:00';
+							});
+							it('should be the correct height, with a horizontal rule to occupy space', function() {
+								init(600);
+								expect(heightElm.outerHeight()).toBe(600);
+								expect($('.fc-time-grid > hr')).toBeVisible();
+							});
+						});
+
+						describe('as a number, with many slots', function() {
+							beforeEach(function() {
+								options.minTime = '00:00:00';
+								options.maxTime = '24:00:00';
+							});
+							it('should be the correct height, with scrollbars and no filler hr', function() {
+								init(600);
+								expect(heightElm.outerHeight()).toBe(600);
+								expect($('.fc-time-grid-container')).toHaveScrollbars();
+								expect($('.fc-time-grid > hr')).not.toBeVisible();
+							});
+						});
+
+						describe('as "auto", with only a few slots', function() {
+							beforeEach(function() {
+								options.minTime = '06:00:00';
+								options.maxTime = '10:00:00';
+							});
+							it('should be really short with no scrollbars nor horizontal rule', function() {
+								init('auto');
+								expect(heightElm.outerHeight()).toBeLessThan(500); // pretty short
+								expect($('.fc-time-grid-container')).not.toHaveScrollbars();
+								expect($('.fc-time-grid > hr')).not.toBeVisible();
+							});
+						});
+
+						describe('as a "auto", with many slots', function() {
+							beforeEach(function() {
+								options.minTime = '00:00:00';
+								options.maxTime = '24:00:00';
+							});
+							it('should be really tall with no scrollbars nor horizontal rule', function() {
+								init('auto');
+								expect(heightElm.outerHeight()).toBeGreaterThan(900); // pretty tall
+								expect($('.fc-time-grid-container')).not.toHaveScrollbars();
+								expect($('.fc-time-grid > hr')).not.toBeVisible();
+							});
+						});
+					});
+				});
+			});
+		});
+	}); });
+}); });
+
+
+function repeatClone(srcObj, times) {
+	var a = [];
+	var i;
+
+	for (i = 0; i < times; i++) {
+		a.push($.extend({}, srcObj));
+	}
+
+	return a;
+}
+
+})();

tests/automated/height.js

@@ -1,49 +0,0 @@
-
-describe('height', function() {
-
-	beforeEach(function() {
-		affix('#cal');
-	});
-
-	describe('when using default height', function() {
-		it('should use default height based on default aspect ratio of 1:35', function() {
-			$('#cal').width(1350);
-			$('#cal').fullCalendar();
-			var height = $('.fc-view-container').height();
-			expect(height).toEqual(1000);
-		});
-	});
-
-	describe('when setting height with the setter', function() {
-		beforeEach(function() {
-			$('#cal').width(673);
-			$('#cal').fullCalendar();
-			$('#cal').fullCalendar('option', 'height', 751);
-		});
-		it('should not change the width of the block level container', function() {
-			var width = $('#cal').width();
-			expect(width).toEqual(673);
-		});
-		it('should set the size of the block level container to the height', function() {
-			var height = $('#cal').height();
-			expect(height).toEqual(751);
-		});
-	});
-
-	describe('when setting height at instantiation', function() {
-		beforeEach(function() {
-			$('#cal').width(673);
-			$('#cal').fullCalendar({
-				height: 751
-			});
-		});
-		it('should not change the width of the block level container', function() {
-			var width = $('#cal').width();
-			expect(width).toEqual(673);
-		});
-		it('should set the size of the block level container to the height', function() {
-			var height = $('#cal').height();
-			expect(height).toEqual(751);
-		});
-	});
-});

tests/lib/jasmine-ext.js

@@ -57,6 +57,22 @@ beforeEach(function() {
 		},
 
 
+		// DOM
+
+		toHaveScrollbars: function() {
+			return {
+				compare: function(actual) {
+					var elm = $(actual);
+					var result = {
+						pass: elm.width() !== elm[0].clientWidth ||
+							elm.height() !== elm[0].clientHeight
+					};
+					return result;
+				}
+			};
+		},
+
+
 		// Geometry
 
 		toBeBoundedBy: function() {