aboutsummaryrefslogtreecommitdiffstats
path: root/tests/autodrag.html
blob: 841bb026e8fb2d19d45d999693bf7eb43240cabe (plain)
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
<!DOCTYPE html>
<html lang="en">
<head>
	<title>jQuery UI - Automated Tests</title>

	<script type="text/javascript" src="../jquery-1.2.6.js"></script>
	<script type="text/javascript" src="../ui/ui.core.js"></script>
	<script type="text/javascript" src="../ui/ui.draggable.js"></script>
	<script type="text/javascript" src="../ui/ui.selectable.js"></script>

	<script type="text/javascript" src="simulate/jquery.simulate.js"></script>
	<script type="text/javascript" src="ui.testmouse.js"></script>

<style type="text/css">

html, body { height: 100%; }
#main { height: 100%; }

#foo { position: relative; margin: 10px; padding: 10px; border: 3px solid gray; width: 200px; height: 200px; background: #eef; text-align: center; }
#foo * { margin: 4px; }
.ui-draggable .msg-missing-class { display: none !important; background: red; color: white; font-weight: bold; }
.ui-draggable .msg-enabled { display: block; }
.ui-draggable .msg-disabled { display: none; }
.ui-draggable-disabled .msg-enabled { display: none !important; }
.ui-draggable-disabled .msg-disabled { display: block !important; }
.ui-selectable .msg-missing-class { display: none !important; background: red; color: white; font-weight: bold; }
.ui-selectable .msg-enabled { display: block; }
.ui-selectable .msg-disabled { display: none; }
.ui-selectable-disabled .msg-enabled { display: none !important; }
.ui-selectable-disabled .msg-disabled { display: block !important; }
//.ui-selectee { border: 1px solid white; }
.ui-selecting { background: Highlight; color: HighlightText; outline: 1px dotted white; }
.ui-selected { background: Highlight; color: HighlightText; outline: 1px dotted black; }

</style>

<script type="text/javascript">
$(function() {

	var speed = "fast";

	var queue;
	var start = function() {
		queue = tests.slice().reverse(); // clone
		$("#status").text("Running...");
		nextTest();
	}
	var stop = function() {
		$("#status").text("Ready");
		teardown();
	}
	
	var tests = [];
	var nextTest = function() {
		if (queue.length) {
			var nTest = queue.pop();
			teardown(function() {
				setupAndRun(nTest);
			});
		} else {
			stop();
		}
	}
	
	var num = 0;
	
	var addTest = function(fn) {
		num += 1;
		tests.push({
			num: num,
			fn: fn
		});
	}
	
	var setupAndRun = function(nTest) {
		$('#testnum').text(nTest.num);
		$('#sandbox').hide()
			.append('<ul id="foo">' + 
				'<li class="msg-missing-class">THIS TEXT SHOULD NOT BE VISIBLE</li>' +
				'<li class="msg-enabled">enabled</li>' +
				'<li class="msg-disabled">disabled</li>' +
				'<li>Item 2</li>' +
				'<li>Item 3</li>' +
				'<li>Item 4</li>' +
				'<li>Item 5</li>' +
				'<li>Item 6</li>' +
				'<li>Item 7</li>' +
				'<li>Item 8</li>' +
			'</ul>')
		$('#foo').testMouse({
			speed: speed,
			complete: nextTest
		});
		$('#sandbox').show();
		nTest.fn.apply(nTest.fn);
	}
	
	var teardown = function(fn) {
		$('#sandbox').hide();
		$('#foo').remove();
		if ($.isFunction(fn)) fn.apply();
	}
	var plugin = "draggable";
	//plugin = "selectable"
	var testFn = "testMouse";
	var testArgs = ["drag", 40, 50];
	//1
	addTest(function() { $("#foo")[plugin]()[testFn].apply($("#foo"), testArgs); });
	//2
	addTest(function() { $("#foo")[plugin]({ disabled: true })[testFn].apply($("#foo"), testArgs); });
	addTest(function() { $("#foo")[plugin]({ disabled: false })[testFn].apply($("#foo"), testArgs); });
	//4
	addTest(function() { $("#foo")[plugin]()[plugin]('disable')[testFn].apply($("#foo"), testArgs); });
	addTest(function() { $("#foo")[plugin]()[plugin]('enable')[testFn].apply($("#foo"), testArgs); });
	//6
	addTest(function() { $("#foo")[plugin]()[plugin]('enable')[plugin]('disable')[testFn].apply($("#foo"), testArgs); });
	addTest(function() { $("#foo")[plugin]()[plugin]('disable')[plugin]('enable')[testFn].apply($("#foo"), testArgs); });
	//8
	addTest(function() { $("#foo")[plugin]({ disabled: false })[plugin]('disable')[testFn].apply($("#foo"), testArgs); });
	addTest(function() { $("#foo")[plugin]({ disabled: true })[plugin]('enable')[testFn].apply($("#foo"), testArgs); });
	//10
	addTest(function() { $("#foo")[plugin]({ disabled: false }).data('disabled.' + plugin, true)[testFn].apply($("#foo"), testArgs); });
	addTest(function() { $("#foo")[plugin]({ disabled: true }).data('disabled.' + plugin, false)[testFn].apply($("#foo"), testArgs); });

	$('#begin').click(function() {
		start();
	});

});
</script>

</head>
<body>

<div id="main">

	<h1>jQuery UI - Automated Tests</h1>

	<div>
		Status: <span id="status">Ready</span>
	</div>

	<div>
		Test: <span id="testnum"></span>
	</div>

	<div style="height: 3em;"><button id="begin">Run Test</button></div>

	<div id="sandbox">
		
	</div>

</div>
	
</body>
</html>