Calendar tests: Use setup and teardown methods

4 files changed, 281 insertions, 270 deletions

diff --git a/tests/unit/calendar/core.js b/tests/unit/calendar/core.js
index 7945d0891..5cc78c423 100644
--- a/tests/unit/calendar/core.js
+++ b/tests/unit/calendar/core.js
@@ -4,27 +4,34 @@ define( [
 	"ui/widgets/calendar"
 ], function( $, testHelper ) {
 
-module( "calendar: core" );
+module( "calendar: core", {
+	setup: function() {
+		this.element = $( "#calendar" ).calendar();
+		this.widget = this.element.calendar( "widget" );
+	},
+	teardown: function() {
+		this.element.calendar( "destroy" );
+	}
+} );
 
 test( "base structure", function() {
 	expect( 28 );
 
-	var buttons, header, title, table, thead, week, child, buttonpane,
-		element = $( "#calendar" ).calendar(),
-		dp = element.calendar( "widget" );
+	var that = this,
+		buttons, header, title, table, thead, week, child, buttonpane;
 
 	function step1() {
-		ok( !dp.is( ".ui-calendar-rtl" ), "Structure - not right-to-left" );
-		ok( !dp.is( ".ui-calendar-multi" ), "Structure - not multi-month" );
-		equal( dp.children().length, 3, "Structure - child count (header, calendar)" );
+		ok( !that.widget.is( ".ui-calendar-rtl" ), "Structure - not right-to-left" );
+		ok( !that.widget.is( ".ui-calendar-multi" ), "Structure - not multi-month" );
+		equal( that.widget.children().length, 3, "Structure - child count (header, calendar)" );
 
-		buttons = dp.children( ":first" );
+		buttons = that.widget.children( ":first" );
 		ok( buttons.is( "div.ui-calendar-header-buttons" ), "Structure - header button division" );
 		equal( buttons.children().length, 2, "Structure - header buttons child count" );
 		ok( buttons.children( ":first" ).is( ".ui-calendar-prev" ) && buttons.children( ":first" ).html() !== "", "Structure - prev link" );
 		ok( buttons.children( ":last" ).is( ".ui-calendar-next" ) && buttons.children( ":last" ).html() !== "", "Structure - next link" );
 
-		header = dp.children( ":eq(1)" );
+		header = that.widget.children( ":eq(1)" );
 		ok( header.is( "div.ui-calendar-header" ), "Structure - header division" );
 		equal( header.children().length, 1, "Structure - header child count" );
 
@@ -34,7 +41,7 @@ test( "base structure", function() {
 		ok( title.children( ":first" ).is( "span.ui-calendar-month" ) && title.children( ":first" ).text() !== "", "Structure - month text" );
 		ok( title.children( ":last" ).is( "span.ui-calendar-year" ) && title.children( ":last" ).text() !== "", "Structure - year text" );
 
-		table = dp.children( ":eq(2)" );
+		table = that.widget.children( ":eq(2)" );
 		ok( table.is( "table.ui-calendar-calendar" ), "Structure - month table" );
 		ok( table.children( ":first" ).is( "thead" ), "Structure - month table thead" );
 
@@ -52,35 +59,32 @@ test( "base structure", function() {
 	}
 
 	function step2() {
-		element.calendar( "option", "buttons", {
+		that.element.calendar( "option", "buttons", {
 			"test": function() {},
 			"test button": function() {}
 		} );
 
-		equal( dp.children().length, 4, "Structure buttons - child count (header buttons, header, calendar, buttonpane)" );
+		equal( that.widget.children().length, 4, "Structure buttons - child count (header buttons, header, calendar, buttonpane)" );
 
-		buttonpane = dp.children( ".ui-calendar-buttonpane" );
+		buttonpane = that.widget.children( ".ui-calendar-buttonpane" );
 		equal( buttonpane.children( "div.ui-calendar-buttonset" ).length, 1, "Structure buttons - buttonset" );
 		equal( buttonpane.find( "button.ui-button:first" ).text(), "test", "Structure buttons - buttonset" );
 		equal( buttonpane.find( "button.ui-button:eq(1)" ).text(), "test button", "Structure buttons - buttonset" );
 
-		element.calendar( "destroy" );
+		that.element.calendar( "destroy" );
 		step3();
 	}
 
 	function step3() {
 
 		// Multi-month 2
-		element = $( "#calendar" ).calendar( { numberOfMonths: 2 } );
-		dp = element.calendar( "widget" );
+		that.element.calendar( { numberOfMonths: 2 } );
 
-		ok( dp.is( ".ui-calendar-multi" ), "Structure multi [2] - multi-month" );
-		equal( dp.children().length, 4, "Structure multi [2] - child count" );
+		ok( that.widget.is( ".ui-calendar-multi" ), "Structure multi [2] - multi-month" );
+		equal( that.widget.children().length, 4, "Structure multi [2] - child count" );
 
-		child = dp.children( ":eq(3)" );
+		child = that.widget.children( ":eq(3)" );
 		ok( child.is( "div.ui-calendar-row-break" ), "Structure multi [2] - row break" );
-
-		element.calendar( "destroy" );
 	}
 
 	step1();
@@ -89,7 +93,7 @@ test( "base structure", function() {
 test( "Localization", function() {
 	expect( 10 );
 
-	var element = $( "#calendar" ),
+	var that = this,
 		date = new Date( 2014, 0, 1 ),
 		optionsDe = {
 			locale: "de",
@@ -99,39 +103,39 @@ test( "Localization", function() {
 			}
 		},
 		initCalendar = function( options ) {
-			element
+			that.element
 				.calendar( options )
 				.calendar( "valueAsDate", date );
 		},
 		testLocalization = function( message ) {
 			equal(
-				element.find( ".ui-calendar-month" ).text(),
+				that.element.find( ".ui-calendar-month" ).text(),
 				"Januar", message + "titlebar year"
 			);
 			equal(
-				element.find( "thead th:first" ).text(),
+				that.element.find( "thead th:first" ).text(),
 				"Mo.", message + "teader first day"
 			);
 			equal(
-				element.find( "thead th:last" ).text(),
+				that.element.find( "thead th:last" ).text(),
 				"So.", message + "header last day"
 			);
 			equal(
-				element.find( ".ui-calendar-prev" ).text(),
+				that.element.find( ".ui-calendar-prev" ).text(),
 				"Zurück", message + "header prev"
 			);
 			equal(
-				element.find( ".ui-calendar-next" ).text(),
+				that.element.find( ".ui-calendar-next" ).text(),
 				"Vor", message + "header next"
 			);
 		};
 
 	initCalendar( optionsDe );
 	testLocalization( "Init: " );
-	element.calendar( "destroy" );
+	that.element.calendar( "destroy" );
 
 	initCalendar( {} );
-	element
+	that.element
 		.calendar( "option", optionsDe )
 		.calendar( "refresh" );
 	testLocalization( "After init: " );
@@ -140,35 +144,35 @@ test( "Localization", function() {
 asyncTest( "keyboard handling", function( assert ) {
 	expect( 10 );
 
-	var element = $( "#calendar" );
+	var that = this;
 
 	function step1() {
-		element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
+		that.element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
 
 		testHelper
-			.focusGrid( element )
+			.focusGrid( that.element )
 			.simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } );
 		setTimeout( function() {
 			$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
 			assert.dateEqual(
-				element.calendar( "valueAsDate" ),
+				that.element.calendar( "valueAsDate" ),
 				new Date( 2013, 12 - 1, 31 ),
 				"Keystroke left to switch to previous day"
 			);
-			element.calendar( "destroy" );
+			that.element.calendar( "destroy" );
 			step2();
 		}, 50 );
 	}
 
 	function step2() {
-		element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
+		that.element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
 
-		testHelper.focusGrid( element )
+		testHelper.focusGrid( that.element )
 			.simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } )
 			.simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
 
 		assert.dateEqual(
-			element.calendar( "valueAsDate" ),
+			that.element.calendar( "valueAsDate" ),
 			new Date( 2014, 1 - 1, 2 ),
 			"Keystroke right to switch to next day"
 		);
@@ -176,132 +180,131 @@ asyncTest( "keyboard handling", function( assert ) {
 	}
 
 	function step3() {
-		element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
+		that.element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
 
-		testHelper.focusGrid( element ).simulate( "keydown", { keyCode: $.ui.keyCode.UP } );
+		testHelper.focusGrid( that.element ).simulate( "keydown", { keyCode: $.ui.keyCode.UP } );
 		setTimeout( function() {
 			$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
 			assert.dateEqual(
-				element.calendar( "valueAsDate" ),
+				that.element.calendar( "valueAsDate" ),
 				new Date( 2013, 12 - 1, 25 ),
 				"Keystroke up to move to the previous week"
 			);
-			element.calendar( "destroy" );
+			that.element.calendar( "destroy" );
 			step4();
 		}, 50 );
 	}
 
 	function step4() {
-		element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
+		that.element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
 
-		testHelper.focusGrid( element ).simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
+		testHelper.focusGrid( that.element ).simulate( "keydown", { keyCode: $.ui.keyCode.DOWN } );
 		setTimeout( function() {
 			$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
 			assert.dateEqual(
-				element.calendar( "valueAsDate" ),
+				that.element.calendar( "valueAsDate" ),
 				new Date( 2014, 1 - 1, 8 ),
 				"Keystroke down to move to the next week"
 			);
-			element.calendar( "destroy" );
+			that.element.calendar( "destroy" );
 			step5();
 		}, 50 );
 	}
 
 	function step5() {
-		element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
+		that.element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
 
-		testHelper.focusGrid( element ).simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
+		testHelper.focusGrid( that.element ).simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
 		setTimeout( function() {
 			$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
 			assert.dateEqual(
-				element.calendar( "valueAsDate" ),
+				that.element.calendar( "valueAsDate" ),
 				new Date( 2013, 12 - 1, 1 ),
 				"Keystroke Page Up moves date to previous month"
 			);
-			element.calendar( "destroy" );
+			that.element.calendar( "destroy" );
 			step6();
 		}, 50 );
 	}
 
 	function step6() {
-		element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
+		that.element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
 
-		testHelper.focusGrid( element )
+		testHelper.focusGrid( that.element )
 			.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP, altKey: true } );
 		setTimeout( function() {
 			$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
 			assert.dateEqual(
-				element.calendar( "valueAsDate" ),
+				that.element.calendar( "valueAsDate" ),
 				new Date( 2013, 1 - 1, 1 ),
 				"Keystroke Page Up + ALT moves date to previous year"
 			);
-			element.calendar( "destroy" );
+			that.element.calendar( "destroy" );
 			step7();
 		}, 50 );
 	}
 
 	function step7() {
-		element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
+		that.element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
 
-		testHelper.focusGrid( element ).simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
+		testHelper.focusGrid( that.element ).simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
 		setTimeout( function() {
 			$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
 			assert.dateEqual(
-				element.calendar( "valueAsDate" ),
+				that.element.calendar( "valueAsDate" ),
 				new Date( 2014, 2 - 1, 1 ),
 				"Keystroke Page Down moves date to next month"
 			);
-			element.calendar( "destroy" );
+			that.element.calendar( "destroy" );
 			step8();
 		}, 50 );
 	}
 
 	function step8() {
-		element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
+		that.element.calendar( { value: new Date( 2014, 1 - 1, 1 ) } );
 
-		testHelper.focusGrid( element )
+		testHelper.focusGrid( that.element )
 			.simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN, altKey: true } );
 		setTimeout( function() {
 			$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
 			assert.dateEqual(
-				element.calendar( "valueAsDate" ),
+				that.element.calendar( "valueAsDate" ),
 				new Date( 2015, 1 - 1, 1 ),
 				"Keystroke Page Down + ALT moves date to next year"
 			);
-			element.calendar( "destroy" );
+			that.element.calendar( "destroy" );
 			step9();
 		}, 50 );
 	}
 
 	// Check for moving to short months
 	function step9() {
-		element.calendar( { value: new Date( 2014, 3 - 1, 31 ) } );
+		that.element.calendar( { value: new Date( 2014, 3 - 1, 31 ) } );
 
-		testHelper.focusGrid( element ).simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
+		testHelper.focusGrid( that.element ).simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_UP } );
 		setTimeout( function() {
 			$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
 			assert.dateEqual(
-				element.calendar( "valueAsDate" ),
+				that.element.calendar( "valueAsDate" ),
 				new Date( 2014, 2 - 1, 28 ),
 				"Keystroke Page Up and short months"
 			);
-			element.calendar( "destroy" );
+			that.element.calendar( "destroy" );
 			step10();
 		}, 50 );
 	}
 
 	function step10() {
-		element.calendar( { value: new Date( 2016, 1 - 1, 30 ) } );
+		that.element.calendar( { value: new Date( 2016, 1 - 1, 30 ) } );
 
-		testHelper.focusGrid( element ).simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
+		testHelper.focusGrid( that.element ).simulate( "keydown", { keyCode: $.ui.keyCode.PAGE_DOWN } );
 		setTimeout( function() {
 			$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.ENTER } );
 			assert.dateEqual(
-				element.calendar( "valueAsDate" ),
+				that.element.calendar( "valueAsDate" ),
 				new Date( 2016, 2 - 1, 29 ),
 				"Keystroke Page Down and leap years"
 			);
-			element.calendar( "destroy" );
 			start();
 		}, 50 );
 	}
@@ -312,41 +315,41 @@ asyncTest( "keyboard handling", function( assert ) {
 asyncTest( "mouse", function( assert ) {
 	expect( 6 );
 
-	var element = $( "#calendar" ).calendar(),
+	var that = this,
 		date = new Date();
 
 	function step1() {
-		$( "tbody button:contains(10)", element ).simulate( "mousedown" );
+		$( "tbody button:contains(10)", that.element ).simulate( "mousedown" );
 		date.setDate( 10 );
 		assert.dateEqual(
-			element.calendar( "valueAsDate" ),
+			that.element.calendar( "valueAsDate" ),
 			date,
 			"Mouse click"
 		);
 
-		element.calendar( "option", "value", new Date( 2008, 2 - 1, 4 ) );
-		$( ".ui-calendar-calendar tbody button:contains(12)", element ).simulate( "mousedown" );
+		that.element.calendar( "option", "value", new Date( 2008, 2 - 1, 4 ) );
+		$( ".ui-calendar-calendar tbody button:contains(12)", that.element ).simulate( "mousedown" );
 		assert.dateEqual(
-			element.calendar( "valueAsDate" ),
+			that.element.calendar( "valueAsDate" ),
 			new Date( 2008, 2 - 1, 12 ),
 			"Mouse click - preset"
 		);
 
 		// Previous/next
-		element.calendar( "option", "value", new Date( 2008, 2 - 1, 4 ) );
-		$( ".ui-calendar-prev", element ).simulate( "click" );
-		$( ".ui-calendar-calendar tbody button:contains(16)", element ).simulate( "mousedown" );
+		that.element.calendar( "option", "value", new Date( 2008, 2 - 1, 4 ) );
+		$( ".ui-calendar-prev", that.element ).simulate( "click" );
+		$( ".ui-calendar-calendar tbody button:contains(16)", that.element ).simulate( "mousedown" );
 		assert.dateEqual(
-			element.calendar( "valueAsDate" ),
+			that.element.calendar( "valueAsDate" ),
 			new Date( 2008, 1 - 1, 16 ),
 			"Mouse click - previous"
 		);
 
-		element.calendar( "option", "value", new Date( 2008, 2 - 1, 4 ) );
-		$( ".ui-calendar-next", element ).simulate( "click" );
-		$( ".ui-calendar-calendar tbody button:contains(18)", element ).simulate( "mousedown" );
+		that.element.calendar( "option", "value", new Date( 2008, 2 - 1, 4 ) );
+		$( ".ui-calendar-next", that.element ).simulate( "click" );
+		$( ".ui-calendar-calendar tbody button:contains(18)", that.element ).simulate( "mousedown" );
 		assert.dateEqual(
-			element.calendar( "valueAsDate" ),
+			that.element.calendar( "valueAsDate" ),
 			new Date( 2008, 3 - 1, 18 ),
 			"Mouse click - next"
 		);
@@ -356,17 +359,17 @@ asyncTest( "mouse", function( assert ) {
 
 	// Previous/next with minimum/maximum
 	function step2() {
-		element.calendar( "destroy" );
-		element.calendar( {
+		that.element.calendar( "destroy" );
+		that.element.calendar( {
 			value: new Date( 2008, 3 - 1, 4 ),
 			min: new Date( 2008, 2 - 1, 2 ),
 			max: new Date( 2008, 2 - 1, 26 )
 		} );
 
-		$( ".ui-calendar-prev", element ).simulate( "click" );
-		$( "tbody button:contains(16)", element ).simulate( "mousedown" );
+		$( ".ui-calendar-prev", that.element ).simulate( "click" );
+		$( "tbody button:contains(16)", that.element ).simulate( "mousedown" );
 		assert.dateEqual(
-			element.calendar( "valueAsDate" ),
+			that.element.calendar( "valueAsDate" ),
 			new Date( 2008, 2 - 1, 16 ),
 			"Mouse click - previous + min/max"
 		);
@@ -374,17 +377,17 @@ asyncTest( "mouse", function( assert ) {
 	}
 
 	function step3() {
-		element.calendar( "destroy" );
-		element.calendar( {
+		that.element.calendar( "destroy" );
+		that.element.calendar( {
 			value: new Date( 2008, 1 - 1, 4 ),
 			min: new Date( 2008, 2 - 1, 2 ),
 			max: new Date( 2008, 2 - 1, 26 )
 		} );
 
-		$( ".ui-calendar-next", element ).simulate( "click" );
-		$( "tbody button:contains(18)", element ).simulate( "mousedown" );
+		$( ".ui-calendar-next", that.element ).simulate( "click" );
+		$( "tbody button:contains(18)", that.element ).simulate( "mousedown" );
 		assert.dateEqual(
-			element.calendar( "valueAsDate" ),
+			that.element.calendar( "valueAsDate" ),
 			new Date( 2008, 2 - 1, 18 ),
 			"Mouse click - next + min/max"
 		);
diff --git a/tests/unit/calendar/events.js b/tests/unit/calendar/events.js
index a8a0b38e0..37ad57a85 100644
--- a/tests/unit/calendar/events.js
+++ b/tests/unit/calendar/events.js
@@ -4,33 +4,39 @@ define( [
 	"ui/widgets/calendar"
 ], function( $, testHelper ) {
 
-module( "calendar: events" );
+module( "calendar: events", {
+	setup: function() {
+		this.element = $( "#calendar" ).calendar();
+	}
+} );
 
 asyncTest( "select", function() {
 	expect( 6 );
 
-	var message, eventType,
-		element = $( "#calendar" ).calendar( {
-			select: function( event ) {
-				ok( true, "select event fired " + message );
-				equal(
-					event.type,
-					"calendarselect",
-					"select event " + message
-				);
-				equal(
-					event.originalEvent.type,
-					eventType,
-					"select originalEvent " + message
-				);
-			}
-		} );
+	var that = this,
+		message, eventType;
+
+	this.element.calendar( {
+		select: function( event ) {
+			ok( true, "select event fired " + message );
+			equal(
+				event.type,
+				"calendarselect",
+				"select event " + message
+			);
+			equal(
+				event.originalEvent.type,
+				eventType,
+				"select originalEvent " + message
+			);
+		}
+	} );
 
 	function step1() {
 		setTimeout( function() {
 			eventType = "mousedown";
 			message = "on calendar button " + eventType;
-			element.find( "table button:eq(1)" ).simulate( eventType );
+			that.element.find( "table button:eq(1)" ).simulate( eventType );
 			step2();
 		}, 50 );
 	}
@@ -39,7 +45,7 @@ asyncTest( "select", function() {
 		setTimeout( function() {
 			eventType = "keydown";
 			message = "on calendar button " + eventType;
-			testHelper.focusGrid( element )
+			testHelper.focusGrid( that.element )
 				.simulate( eventType, { keyCode: $.ui.keyCode.END } )
 				.simulate( eventType, { keyCode: $.ui.keyCode.ENTER } );
 			step3();
@@ -49,8 +55,8 @@ asyncTest( "select", function() {
 	// This should not trigger another event
 	function step3() {
 		setTimeout( function() {
-			element.calendar( "disable" );
-			element.find( "table button:eq(10)" ).simulate( "mousedown" );
+			that.element.calendar( "disable" );
+			that.element.find( "table button:eq(10)" ).simulate( "mousedown" );
 			start();
 		}, 50 );
 	}
diff --git a/tests/unit/calendar/methods.js b/tests/unit/calendar/methods.js
index d5a4ba4a2..77c2c8ce5 100644
--- a/tests/unit/calendar/methods.js
+++ b/tests/unit/calendar/methods.js
@@ -3,137 +3,138 @@ define( [
 	"ui/widgets/calendar"
 ], function( $ ) {
 
-module( "calendar: methods" );
+module( "calendar: methods", {
+	setup: function() {
+		this.element = $( "#calendar" ).calendar();
+		this.widget = this.element.calendar( "widget" );
+	},
+	teardown: function() {
+		this.element.calendar( "destroy" );
+	}
+} );
 
 test( "destroy", function( assert ) {
 	expect( 1 );
 
-	assert.domEqual( "#calendar", function() {
-		$( "#calendar" ).calendar().calendar( "destroy" );
+	var div = $( "<div>" ).appendTo( "#qunit-fixture" );
+
+	assert.domEqual( div, function() {
+		div.calendar().calendar( "destroy" );
 	} );
 } );
 
 test( "enable / disable", function() {
 	expect( 8 );
 
-	var element = $( "#calendar" ).calendar();
-
-	element.calendar( "disable" );
-	ok( element.calendar( "option", "disabled" ), "disabled option is set" );
-	ok( element.hasClass( "ui-calendar-disabled" ), "has disabled widget class name" );
-	ok( element.hasClass( "ui-state-disabled" ), "has disabled state class name" );
-	equal( element.attr( "aria-disabled" ), "true", "has ARIA disabled" );
-
-	element.calendar( "enable" );
-	ok( !element.calendar( "option", "disabled" ), "enabled after enable() call" );
-	ok( !element.hasClass( "ui-calendar-disabled" ), "no longer has disabled widget class name" );
-	ok( !element.hasClass( "ui-state-disabled" ), "no longer has disabled state class name" );
-	equal( element.attr( "aria-disabled" ), "false", "no longer has ARIA disabled" );
+	this.element.calendar( "disable" );
+	ok( this.element.calendar( "option", "disabled" ), "disabled option is set" );
+	ok( this.element.hasClass( "ui-calendar-disabled" ), "has disabled widget class name" );
+	ok( this.element.hasClass( "ui-state-disabled" ), "has disabled state class name" );
+	equal( this.element.attr( "aria-disabled" ), "true", "has ARIA disabled" );
+
+	this.element.calendar( "enable" );
+	ok( !this.element.calendar( "option", "disabled" ), "enabled after enable() call" );
+	ok( !this.element.hasClass( "ui-calendar-disabled" ), "no longer has disabled widget class name" );
+	ok( !this.element.hasClass( "ui-state-disabled" ), "no longer has disabled state class name" );
+	equal( this.element.attr( "aria-disabled" ), "false", "no longer has ARIA disabled" );
 } );
 
 test( "widget", function() {
 	expect( 1 );
 
-	var element = $( "#calendar" ).calendar(),
-		widget = element.calendar( "widget" );
-
-	strictEqual( widget[ 0 ],  element[ 0 ] );
+	strictEqual( this.widget[ 0 ],  this.element[ 0 ] );
 } );
 
 test( "value", function() {
 	expect( 3 );
-	var element = $( "#calendar" ).calendar();
 
-	element.calendar( "value", "1/1/14" );
-	ok( element.find( "button[data-timestamp]:first" )
+	this.element.calendar( "value", "1/1/14" );
+	ok( this.element.find( "button[data-timestamp]:first" )
 			.hasClass( "ui-state-active" ),
 		"first day marked as selected"
 	);
-	equal( element.calendar( "value" ), "1/1/14", "getter" );
+	equal( this.element.calendar( "value" ), "1/1/14", "getter" );
 
-	element.calendar( "value", "abc" );
-	equal( element.calendar( "value" ), "1/1/14", "Setting invalid values should be ignored." );
+	this.element.calendar( "value", "abc" );
+	equal( this.element.calendar( "value" ), "1/1/14", "Setting invalid values should be ignored." );
 } );
 
 test( "valueAsDate", function( assert ) {
 	expect( 11 );
 
 	var minDate, maxDate, dateAndTimeToSet, dateAndTimeClone,
-		element = $( "#calendar" ).calendar(),
 		date1 = new Date( 2008, 6 - 1, 4 ),
 		date2;
 
-	element.calendar( "valueAsDate", new Date( 2014, 0, 1 ) );
-	ok( element.find( "button[data-timestamp]:first" )
+	this.element.calendar( "valueAsDate", new Date( 2014, 0, 1 ) );
+	ok( this.element.find( "button[data-timestamp]:first" )
 			.hasClass( "ui-state-active" ),
 		"First day marked as selected"
 	);
-	assert.dateEqual( element.calendar( "valueAsDate" ), new Date( 2014, 0, 1 ), "Getter" );
-
-	element.calendar( "destroy" );
+	assert.dateEqual( this.element.calendar( "valueAsDate" ), new Date( 2014, 0, 1 ), "Getter" );
 
-	element.calendar();
-	equal( element.calendar( "valueAsDate" ), null, "Set date - default" );
+	this.element.calendar( "destroy" );
+	this.element.calendar();
+	equal( this.element.calendar( "valueAsDate" ), null, "Set date - default" );
 
-	element.calendar( "valueAsDate", date1 );
-	assert.dateEqual( element.calendar( "valueAsDate" ), date1, "Set date - 2008-06-04" );
+	this.element.calendar( "valueAsDate", date1 );
+	assert.dateEqual( this.element.calendar( "valueAsDate" ), date1, "Set date - 2008-06-04" );
 
-	// With minimum/maximum
-	element = $( "#calendar" ).calendar();
+	// With minimum / maximum
 	date1 = new Date( 2008, 1 - 1, 4 );
 	date2 = new Date( 2008, 6 - 1, 4 );
 	minDate = new Date( 2008, 2 - 1, 29 );
 	maxDate = new Date( 2008, 3 - 1, 28 );
 
-	element
+	this.element
 		.calendar( "option", { min: minDate } )
 		.calendar( "valueAsDate", date2 );
 	assert.dateEqual(
-		element.calendar( "valueAsDate" ),
+		this.element.calendar( "valueAsDate" ),
 		date2, "Set date min/max - value > min"
 	);
 
-	element.calendar( "valueAsDate", date1 );
+	this.element.calendar( "valueAsDate", date1 );
 	assert.dateEqual(
-		element.calendar( "valueAsDate" ),
+		this.element.calendar( "valueAsDate" ),
 		date2,
 		"Set date min/max - value < min"
 	);
 
-	element
+	this.element
 		.calendar( "option", { max: maxDate, min: null } )
 		.calendar( "valueAsDate", date1 );
 	assert.dateEqual(
-		element.calendar( "valueAsDate" ),
+		this.element.calendar( "valueAsDate" ),
 		date1,
 		"Set date min/max - value < max"
 	);
 
-	element.calendar( "valueAsDate", date2 );
+	this.element.calendar( "valueAsDate", date2 );
 	assert.dateEqual(
-		element.calendar( "valueAsDate" ),
+		this.element.calendar( "valueAsDate" ),
 		date1,
 		"Set date min/max - value > max"
 	);
 
-	element
+	this.element
 		.calendar( "option", { min: minDate } )
 		.calendar( "valueAsDate", date1 );
 	assert.dateEqual(
-		element.calendar( "valueAsDate" ),
+		this.element.calendar( "valueAsDate" ),
 		date1,
 		"Set date min/max - value < min"
 	);
 
-	element.calendar( "valueAsDate", date2 );
+	this.element.calendar( "valueAsDate", date2 );
 	assert.dateEqual(
-		element.calendar( "valueAsDate" ),
+		this.element.calendar( "valueAsDate" ),
 		date1, "Set date min/max - value > max"
 	);
 
 	dateAndTimeToSet = new Date( 2008, 3 - 1, 28, 1, 11, 0 );
 	dateAndTimeClone = new Date( 2008, 3 - 1, 28, 1, 11, 0 );
-	element.calendar( "valueAsDate", dateAndTimeToSet );
+	this.element.calendar( "valueAsDate", dateAndTimeToSet );
 	equal(
 		dateAndTimeToSet.getTime(),
 		dateAndTimeClone.getTime(),
diff --git a/tests/unit/calendar/options.js b/tests/unit/calendar/options.js
index 2e383855b..281598794 100644
--- a/tests/unit/calendar/options.js
+++ b/tests/unit/calendar/options.js
@@ -3,27 +3,36 @@ define( [
 	"ui/widgets/calendar"
 ], function( $ ) {
 
-module( "calendar: options" );
+module( "calendar: options", {
+	setup: function() {
+		this.element = $( "#calendar" ).calendar();
+		this.widget = this.element.calendar( "widget" );
+	},
+	teardown: function() {
+		this.element.calendar( "destroy" );
+	}
+} );
 
 test( "buttons", function() {
 	expect( 21 );
 
 	var button, i, newButtons,
+		that = this,
 		buttons = {
 			"Ok": function( event ) {
 				ok( true, "button click fires callback" );
-				equal( this, element[ 0 ], "context of callback" );
+				equal( this, that.element[ 0 ], "context of callback" );
 				equal( event.target, button[ 0 ], "event target" );
 			},
 			"Cancel": function( event ) {
 				ok( true, "button click fires callback" );
-				equal( this, element[ 0 ], "context of callback" );
+				equal( this, that.element[ 0 ], "context of callback" );
 				equal( event.target, button[ 1 ], "event target" );
 			}
-		},
-		element = $( "#calendar" ).calendar( { buttons: buttons } );
+		};
 
-	button = element.calendar( "widget" ).find( ".ui-calendar-buttonpane button" );
+	this.element.calendar( { buttons: buttons } );
+	button = this.widget.find( ".ui-calendar-buttonpane button" );
 	equal( button.length, 2, "number of buttons" );
 
 	i = 0;
@@ -34,7 +43,7 @@ test( "buttons", function() {
 
 	ok( button.parent().hasClass( "ui-calendar-buttonset" ), "buttons in container" );
 	ok(
-		element.calendar( "widget" ).hasClass( "ui-calendar-buttons" ),
+		this.element.calendar( "widget" ).hasClass( "ui-calendar-buttons" ),
 		"calendar wrapper adds class about having buttons"
 	);
 
@@ -43,24 +52,24 @@ test( "buttons", function() {
 	newButtons = {
 		"Close": function( event ) {
 			ok( true, "button click fires callback" );
-			equal( this, element[ 0 ], "context of callback" );
+			equal( this, that.element[ 0 ], "context of callback" );
 			equal( event.target, button[ 0 ], "event target" );
 		}
 	};
 
 	deepEqual(
-		element.calendar( "option", "buttons" ),
+		this.element.calendar( "option", "buttons" ),
 		buttons,
 		".calendar('option', 'buttons') getter"
 	);
-	element.calendar( "option", "buttons", newButtons );
+	this.element.calendar( "option", "buttons", newButtons );
 	deepEqual(
-		element.calendar( "option", "buttons" ),
+		this.element.calendar( "option", "buttons" ),
 		newButtons,
 		".calendar('option', 'buttons', ...) setter"
 	);
 
-	button = element.calendar( "widget" ).find( ".ui-calendar-buttonpane button" );
+	button = this.element.calendar( "widget" ).find( ".ui-calendar-buttonpane button" );
 	equal( button.length, 1, "number of buttons after setter" );
 	button.trigger( "click" );
 
@@ -70,33 +79,33 @@ test( "buttons", function() {
 		i += 1;
 	} );
 
-	element.calendar( "option", "buttons", null );
-	button = element.calendar( "widget" ).find( ".ui-calendar-buttonpane button" );
+	this.element.calendar( "option", "buttons", null );
+	button = this.widget.find( ".ui-calendar-buttonpane button" );
 	equal( button.length, 0, "all buttons have been removed" );
-	equal( element.find( ".ui-calendar-buttonset" ).length, 0, "buttonset has been removed" );
-	equal( element.hasClass( "ui-calendar-buttons" ), false, "calendar element removes class about having buttons" );
-
-	element.remove();
+	equal( this.element.find( ".ui-calendar-buttonset" ).length, 0, "buttonset has been removed" );
+	equal( this.element.hasClass( "ui-calendar-buttons" ), false, "calendar element removes class about having buttons" );
 } );
 
 test( "buttons - advanced", function() {
 	expect( 7 );
 
-	var buttons,
-		element = $( "#calendar" ).calendar( {
-			buttons: [ {
-				text: "a button",
-				"class": "additional-class",
-				id: "my-button-id",
-				click: function() {
-					equal( this, element[ 0 ], "correct context" );
-				},
-				icon: "ui-icon-cancel",
-				showLabel: false
-			} ]
-		} );
+	var that = this,
+		buttons;
+
+	this.element.calendar( {
+		buttons: [ {
+			text: "a button",
+			"class": "additional-class",
+			id: "my-button-id",
+			click: function() {
+				equal( this, that.element[ 0 ], "correct context" );
+			},
+			icon: "ui-icon-cancel",
+			showLabel: false
+		} ]
+	} );
 
-	buttons = element.calendar( "widget" ).find( ".ui-calendar-buttonpane button" );
+	buttons = this.widget.find( ".ui-calendar-buttonpane button" );
 	equal( buttons.length, 1, "correct number of buttons" );
 	equal( buttons.attr( "id" ), "my-button-id", "correct id" );
 	equal ( $.trim( buttons.text() ), "a button", "correct label" );
@@ -104,149 +113,137 @@ test( "buttons - advanced", function() {
 	equal( buttons.button( "option", "icon" ), "ui-icon-cancel" );
 	equal( buttons.button( "option", "showLabel" ), false );
 	buttons.click();
-
-	element.remove();
 } );
 
 test( "dateFormat", function() {
 	expect( 2 );
-	var element = $( "#calendar" ).calendar();
 
-	element.calendar( "value", "1/1/14" );
+	this.element.calendar( "value", "1/1/14" );
 
-	element.calendar( "widget" ).find( "td[id]:first button" ).trigger( "mousedown" );
-	equal( element.calendar( "value" ), "1/1/14", "default formatting" );
+	this.widget.find( "td[id]:first button" ).trigger( "mousedown" );
+	equal( this.element.calendar( "value" ), "1/1/14", "default formatting" );
 
-	element.calendar( "option", "dateFormat", { date: "full" } );
-	equal( element.calendar( "value" ), "Wednesday, January 1, 2014", "updated formatting" );
+	this.element.calendar( "option", "dateFormat", { date: "full" } );
+	equal( this.element.calendar( "value" ), "Wednesday, January 1, 2014", "updated formatting" );
 } );
 
 test( "eachDay", function() {
 	expect( 5 );
+
 	var timestamp,
-		input = $( "#calendar" ).calendar(),
-		picker = input.calendar( "widget" ),
-		firstCell = picker.find( "td[id]:first" );
+		firstCell = this.widget.find( "td[id]:first" );
 
 	equal( firstCell.find( "button" ).length, 1, "days are selectable by default" );
 	timestamp = parseInt( firstCell.find( "button" ).attr( "data-timestamp" ), 10 );
 	equal( new Date( timestamp ).getDate(), 1, "first available day is the 1st by default" );
 
 	// Do not render the 1st of the month
-	input.calendar( "option", "eachDay", function( day ) {
+	this.element.calendar( "option", "eachDay", function( day ) {
 		if ( day.date === 1 ) {
 			day.render = false;
 		}
 	} );
-	firstCell = picker.find( "td[id]:first" );
+	firstCell = this.widget.find( "td[id]:first" );
 	timestamp = parseInt( firstCell.find( "button" ).attr( "data-timestamp" ), 10 );
 	equal( new Date( timestamp ).getDate(), 2, "first available day is the 2nd" );
 
 	// Display the 1st of the month but make it not selectable.
-	input.calendar( "option", "eachDay", function( day ) {
+	this.element.calendar( "option", "eachDay", function( day ) {
 		if ( day.date === 1 ) {
 			day.selectable = false;
 		}
 	} );
-	firstCell = picker.find( "td[id]:first" );
+	firstCell = this.widget.find( "td[id]:first" );
 	ok( firstCell.find( "button" ).prop( "disabled" ), "the 1st is not selectable" );
 
-	input.calendar( "option", "eachDay", function( day ) {
+	this.element.calendar( "option", "eachDay", function( day ) {
 		if ( day.date === 1 ) {
 			day.extraClasses = "ui-custom";
 		}
 	} );
-	ok( picker.find( "td[id]:first button" ).hasClass( "ui-custom" ), "extraClasses applied" );
-
-	input.calendar( "destroy" );
+	ok( this.widget.find( "td[id]:first button" ).hasClass( "ui-custom" ), "extraClasses applied" );
 } );
 
 test( "showWeek", function() {
 	expect( 7 );
-	var input = $( "#calendar" ).calendar(),
-		container = input.calendar( "widget" );
 
-	equal( container.find( "thead th" ).length, 7, "just 7 days, no column cell" );
-	equal( container.find( ".ui-calendar-week-col" ).length, 0,
+	equal( this.widget.find( "thead th" ).length, 7, "just 7 days, no column cell" );
+	equal( this.widget.find( ".ui-calendar-week-col" ).length, 0,
 		"no week column cells present" );
-	input.calendar( "destroy" );
+	this.element.calendar( "destroy" );
 
-	input = $( "#calendar" ).calendar( { showWeek: true } );
-	container = input.calendar( "widget" );
-	equal( container.find( "thead th" ).length, 8, "7 days + a column cell" );
-	ok( container.find( "thead th:first" ).is( ".ui-calendar-week-col" ),
+	this.element.calendar( { showWeek: true } );
+	equal( this.widget.find( "thead th" ).length, 8, "7 days + a column cell" );
+	ok( this.widget.find( "thead th:first" ).is( ".ui-calendar-week-col" ),
 		"first cell should have ui-datepicker-week-col class name" );
-	equal( container.find( ".ui-calendar-week-col" ).length,
-		container.find( "tr" ).length, "one week cell for each week" );
-	input.calendar( "destroy" );
-
-	input = $( "#calendar" ).calendar();
-	container = input.calendar( "widget" );
-	equal( container.find( "thead th" ).length, 7, "no week column" );
-	input.calendar( "option", "showWeek", true );
-	equal( container.find( "thead th" ).length, 8, "supports changing option after init" );
+	equal( this.widget.find( ".ui-calendar-week-col" ).length,
+		this.widget.find( "tr" ).length, "one week cell for each week" );
+	this.element.calendar( "destroy" );
+
+	this.element.calendar();
+	equal( this.widget.find( "thead th" ).length, 7, "no week column" );
+	this.element.calendar( "option", "showWeek", true );
+	equal( this.widget.find( "thead th" ).length, 8, "supports changing option after init" );
 } );
 
 test( "min / max", function( assert ) {
 	expect( 17 );
 
 	// With existing date
-	var element = $( "#calendar" ).calendar(),
-		container = element.calendar( "widget" ),
-		prevButton = container.find( ".ui-calendar-prev" ),
-		nextButton = container.find( ".ui-calendar-next" ),
+	var prevButton = this.widget.find( ".ui-calendar-prev" ),
+		nextButton = this.widget.find( ".ui-calendar-next" ),
 		minDate = new Date( 2008, 2 - 1, 29 ),
 		maxDate = new Date( 2008, 12 - 1, 7 );
 
-	element
+	this.element
 		.calendar( "option", { min: minDate } )
 		.calendar( "value", "6/4/08" );
-	assert.dateEqual( element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value > min" );
+	assert.dateEqual( this.element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value > min" );
 
-	element
+	this.element
 		.calendar( "option", { min: minDate } )
 		.calendar( "value", "1/4/08" );
-	assert.dateEqual( element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value < min" );
+	assert.dateEqual( this.element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value < min" );
 
-	element
+	this.element
 		.calendar( "option", { min: null } )
 		.calendar( "value", "6/4/08" )
 		.calendar( "option", { max: maxDate } );
-	assert.dateEqual( element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value < max" );
+	assert.dateEqual( this.element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value < max" );
 
-	element
+	this.element
 		.calendar( "option", { max: maxDate } )
 		.calendar( "value", "1/4/09" );
-	assert.dateEqual( element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - setDate > max" );
+	assert.dateEqual( this.element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - setDate > max" );
 
-	element
+	this.element
 		.calendar( "option", { min: minDate, max: maxDate } )
 		.calendar( "value", "1/4/08" );
-	assert.dateEqual( element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value < min" );
+	assert.dateEqual( this.element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value < min" );
 
-	element
+	this.element
 		.calendar( "option", { min: minDate, max: maxDate } )
 		.calendar( "value", "6/4/08" );
-	assert.dateEqual( element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value > min, < max" );
+	assert.dateEqual( this.element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value > min, < max" );
 
-	element
+	this.element
 		.calendar( "option", { min: minDate, max: maxDate } )
 		.calendar( "value", "1/4/09" );
-	assert.dateEqual( element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value > max" );
+	assert.dateEqual( this.element.calendar( "valueAsDate" ), new Date( 2008, 6 - 1, 4 ), "Min/max - value > max" );
 
-	element
+	this.element
 		.calendar( "option", { min: minDate, max: maxDate } )
 		.calendar( "value", "3/4/08" );
 	ok( !prevButton.hasClass( "ui-state-disabled" ), "Prev button enabled" );
 	prevButton.simulate( "click" );
 	ok( prevButton.hasClass( "ui-state-disabled" ), "Prev button disabled" );
 
-	element.calendar( "value", "11/4/08" );
+	this.element.calendar( "value", "11/4/08" );
 	ok( !nextButton.hasClass( "ui-state-disabled" ), "Next button enabled" );
 	nextButton.simulate( "click" );
 	ok( nextButton.hasClass( "ui-state-disabled" ), "Next button disabled" );
 
-	element
+	this.element
 		.calendar( "option", { max: null } )
 		.calendar( "value", "1/4/09" )
 		.calendar( "option", { min: minDate, max: maxDate } );
@@ -256,7 +253,7 @@ test( "min / max", function( assert ) {
 	prevButton.simulate( "click" );
 	ok( !nextButton.hasClass( "ui-state-disabled" ), "Other year above max: Next button enabled after click" );
 
-	element
+	this.element
 		.calendar( "option", { min: null } )
 		.calendar( "value", "1/4/08" )
 		.calendar( "option", { min: minDate, max: maxDate } );
@@ -269,42 +266,46 @@ test( "min / max", function( assert ) {
 
 test( "numberOfMonths", function() {
 	expect( 6 );
-	var date = new Date( 2015, 8 - 1, 1 ),
-		input = $( "#calendar" ).calendar( {
+
+	var date = new Date( 2015, 8 - 1, 1 );
+
+	// Number of month option does not work after init
+	this.element
+		.calendar( "destroy" )
+		.calendar( {
 			numberOfMonths: 3,
 			value: date
-		} ),
-		container = input.calendar( "widget" );
+		} );
 
-	equal( container.find( ".ui-calendar-group" ).length, 3, "3 calendar grids" );
+	equal( this.widget.find( ".ui-calendar-group" ).length, 3, "3 calendar grids" );
 	equal(
-		container.find( "tbody:first td[id]:first" ).attr( "id" ),
+		this.widget.find( "tbody:first td[id]:first" ).attr( "id" ),
 		"calendar-2015-7-1",
 		"Correct id set for first day of first grid"
 	);
 	equal(
-		container.find( "tbody:last td[id]:last" ).attr( "id" ),
+		this.widget.find( "tbody:last td[id]:last" ).attr( "id" ),
 		"calendar-2015-9-31",
 		"Correct id set for last day of third grid"
 	);
 
 	// Test for jumping in weekday rendering after click on last day of last grid
-	container.find( "tbody:last td[id]:last button" ).trigger( "mousedown" );
-	equal( container.find( "thead:last th:last" ).text(), "Sa",
+	this.widget.find( "tbody:last td[id]:last button" ).trigger( "mousedown" );
+	equal( this.widget.find( "thead:last th:last" ).text(), "Sa",
 		"After mousedown last month: Last day is Saturday"
 	);
 
 	// Test if using cursor to go to the next / prev month advances three month
 	// Focus doesn't work here so we use an additional mouse down event
-	container.find( "tbody:first td[id]:first button" ).trigger( "mousedown" );
+	this.widget.find( "tbody:first td[id]:first button" ).trigger( "mousedown" );
 	$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.LEFT } );
-	equal( container.find( ".ui-calendar-month:first" ).text(), "May",
+	equal( this.widget.find( ".ui-calendar-month:first" ).text(), "May",
 		"After move to previous month: First month is May"
 	);
 
-	container.find( "tbody:last td[id]:last button" ).trigger( "mousedown" );
+	this.widget.find( "tbody:last td[id]:last button" ).trigger( "mousedown" );
 	$( document.activeElement ).simulate( "keydown", { keyCode: $.ui.keyCode.RIGHT } );
-	equal( container.find( ".ui-calendar-month:last" ).text(), "October",
+	equal( this.widget.find( ".ui-calendar-month:last" ).text(), "October",
 		"After move to next month: Last month is October"
 	);
 } );