Context Navigation

source: Dev/branches/rest-dojo-ui/client/dijit/tests/robot/InlineEditBox.html @ 256

Last change on this file since 256 was 256, checked in by hendrikvanantwerpen, 13 years ago
Reworked project structure based on REST interaction and Dojo library. As soon as this is stable, the old jQueryUI branch can be removed (it's kept for reference).
File size: 14.0 KB

Line
1	<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
2	"http://www.w3.org/TR/html4/strict.dtd">
3	<html>
4	<head>
5	<title>doh.robot InlineEditBox Test</title>
6
7	<style>
8	@import "../../../util/doh/robot/robot.css";
9	</style>
10
11	<!-- required: dojo.js -->
12	<script type="text/javascript" src="../../../dojo/dojo.js"
13	djConfig="isDebug: true"></script>
14
15	<!-- functions to help test -->
16	<script type="text/javascript" src="../helpers.js"></script>
17
18	<script type="text/javascript">
19	dojo.require("dojo.date.locale");
20	dojo.require("dijit.robotx");
21
22	dojo.ready(function(){
23	doh.robot.initRobot('../test_InlineEditBox.html');
24
25	function moveAndClick(node){
26	doh.robot.mouseMoveAt(node, 500, 1);
27	doh.robot.mouseClick({left: true}, 500);
28	}
29
30	doh.register("dijit.InlineEditBox autosave tests", [
31	{
32	name: "CurrencyTextBox invalid value: blur",
33	timeout: 10000,
34	runTest: function(){
35	var d = new doh.Deferred();
36	var inlineBox = dijit.byId("dollar_as");
37	moveAndClick(inlineBox.domNode);
38	doh.robot.typeKeys("dollar", 1000, 1200); // invalid
39	moveAndClick("predefined");
40	doh.robot.sequence(d.getTestCallback(function(){
41	var currencyTextBox = inlineBox.wrapperWidget.editWidget;
42	doh.is('dollar', currencyTextBox.get("displayedValue"), "displayedValue");
43	doh.f(currencyTextBox.isValid(), "!isValid");
44	inlineBox.cancel(false);
45	doh.is('', inlineBox.get("value"), "value");
46	}), 1000);
47	return d;
48	}
49	},
50	{
51	name: "CurrencyTextBox invalid value: ENTER",
52	timeout: 10000,
53	runTest: function(){
54	var d = new doh.Deferred();
55	var inlineBox = dijit.byId("dollar_as");
56	var displayedValue, isValid;
57	moveAndClick(inlineBox.domNode);
58	doh.robot.typeKeys("dollar", 1000, 1200); // invalid
59	doh.robot.keyPress(dojo.keys.ENTER, 500, {});
60	doh.robot.sequence(function(){
61	var currencyTextBox = inlineBox.wrapperWidget.editWidget;
62	displayedValue = currencyTextBox.get("displayedValue");
63	isValid = currencyTextBox.isValid();
64	}, 1000);
65	doh.robot.keyPress(dojo.keys.ESCAPE, 500, {});
66	doh.robot.sequence(d.getTestCallback(function(){
67	doh.is('dollar', displayedValue, "displayedValue");
68	doh.f(isValid, "!isValid");
69	doh.is('', inlineBox.get("value"), "value");
70	}), 1000);
71	return d;
72	}
73	},
74	{
75	name: "CurrencyTextBox valid value: blur",
76	timeout: 10000,
77	runTest: function(){
78	var d = new doh.Deferred();
79	var inlineBox = dijit.byId("dollar_as");
80	moveAndClick(inlineBox.domNode);
81	doh.robot.typeKeys("123", 1000, 600);
82	moveAndClick("predefined");
83	doh.robot.sequence(d.getTestCallback(function(){
84	doh.is("$123.00", inlineBox.get("value"), "value");
85	}), 1000);
86	return d;
87	}
88	},
89	{
90	name: "CurrencyTextBox valid value: ENTER",
91	timeout: 10000,
92	runTest: function(){
93	var d = new doh.Deferred();
94	var inlineBox = dijit.byId("dollar_as");
95	moveAndClick(inlineBox.domNode);
96	doh.robot.typeKeys("234", 1000, 600);
97	doh.robot.keyPress(dojo.keys.ENTER, 500, {});
98	doh.robot.sequence(d.getTestCallback(function(){
99	doh.is('$234.00', inlineBox.get("value"), "value");
100	}), 1000);
101	return d;
102	}
103	},
104	{
105	name: "CurrencyTextBox valid value: ESCAPE",
106	timeout: 10000,
107	runTest: function(){
108	var d = new doh.Deferred();
109	var inlineBox = dijit.byId("dollar_as");
110	moveAndClick(inlineBox.domNode);
111	doh.robot.typeKeys("345", 1000, 600);
112	doh.robot.keyPress(dojo.keys.ESCAPE, 500, {});
113	doh.robot.sequence(d.getTestCallback(function(){
114	doh.is("$234.00", inlineBox.get("value"), "value");
115	}), 1000);
116	return d;
117	}
118	},
119	{
120	name: "CurrencyTextBox valid value: TAB",
121	timeout: 10000,
122	runTest: function(){
123	var d = new doh.Deferred();
124	var inlineBox = dijit.byId("dollar_as");
125	moveAndClick(inlineBox.domNode);
126	doh.robot.typeKeys("456", 1000, 600);
127	doh.robot.keyPress(dojo.keys.TAB, 500, {});
128	doh.robot.sequence(d.getTestCallback(function(){
129	doh.is('$456.00', inlineBox.get("value"), "value");
130	}), 1000);
131	return d;
132	}
133	},
134	{
135	name: "Focus test",
136	timeout: 15000,
137	runTest: function(){
138	var d = new doh.Deferred();
139	var inlineBox = dijit.byId("editable");
140	var initialOnChange = inlineBox._onChangeValue;
141	inlineBox.set("value", "");
142	moveAndClick(inlineBox.domNode);
143	doh.robot.typeKeys("editable", 1000, 1600);
144	doh.robot.keyPress(dojo.keys.TAB, 500, {});
145	doh.robot.keyPress(dojo.keys.TAB, 1500, {}); // wait more than 1 second to TAB
146	doh.robot.keyPress(dojo.keys.ENTER, 500, {});
147	doh.robot.typeKeys("567", 500, 600);
148	doh.robot.keyPress(dojo.keys.ENTER, 500, {});
149	doh.robot.keyPress(dojo.keys.TAB, 500, {shift:true}); // do this fast
150	doh.robot.keyPress(dojo.keys.TAB, 500, {shift:true}); // do this fast
151	doh.robot.keyPress(dojo.keys.ENTER, 500, {}); // quickly back to editable
152	doh.robot.keyPress(dojo.keys.RIGHT_ARROW, 500, {});
153	doh.robot.typeKeys(" again", 1000, 1200);
154	doh.robot.keyPress(dojo.keys.TAB, 500, {});
155	doh.robot.sequence(d.getTestCallback(function(){
156	doh.is(undefined, initialOnChange, "no onChange value");
157	doh.is('$567.00', dijit.byId("dollar_as").get("value"), "value");
158	doh.is('editable again', inlineBox.get("value"), "value");
159	doh.is('editable again', inlineBox._onChangeValue, "onChange value");
160	}), 1000);
161	return d;
162	}
163	},
164	{
165	name: "onChange set value",
166	timeout: 2000,
167	runTest: function(){
168	var d = new doh.Deferred();
169	var inlineBox = dijit.byId("editable");
170	inlineBox.set("value", "programmatic value");
171	doh.robot.sequence(d.getTestCallback(function(){
172	doh.is("programmatic value", inlineBox._onChangeValue, "programmatic set causes onChange");
173	}), 500);
174	return d;
175	}
176	},
177	{
178	name: "onChange programmatic creation",
179	timeout: 2000,
180	runTest: function(){
181	var d = new doh.Deferred();
182	var inlineBox = dijit.byId("programmatic");
183	inlineBox.edit();
184	inlineBox.wrapperWidget.editWidget.set('value', 'changed');
185	inlineBox.save();
186	doh.robot.sequence(d.getTestCallback(function(){
187	doh.is("changed", inlineBox._onChangeValue, "editing causes onChange");
188	}), 500);
189	return d;
190	}
191	},
192	{
193	name: "Textarea test",
194	timeout: 15000,
195	runTest: function(){
196	var d = new doh.Deferred();
197	var inlineBox = dijit.byId("textarea");
198	moveAndClick(inlineBox.domNode);
199	doh.robot.typeKeys("line 1", 1000, 1200);
200	doh.robot.keyPress(dojo.keys.ENTER, 500, {});
201	doh.robot.typeKeys("line 2", 500, 1200);
202	moveAndClick("predefined");
203	doh.robot.sequence(d.getTestCallback(function(){
204	doh.is('line 1\\nline 2', inlineBox.get("value").replace(/\n/g, "\\n"), "textarea programmatic value was " + inlineBox.get("value").replace(/\n/g, "\\n"));
205	doh.is('line 1<br>line 2', inlineBox.domNode.innerHTML.toLowerCase(), "textarea rendered value was " + inlineBox.domNode.innerHTML);
206	}), 1000);
207	return d;
208	}
209	}
210	]);
211
212	// Testing that the initial display value of the InlineEditBox gets sent to the editor.
213	// For example, in this markup:
214	// <span dojoType="dijit.InlineEditBox" ...>01/05/2007</span>
215	// When the editor is clicked the calendar should open to that date.
216	dojo.forEach([
217	{ widget: "CurrencyTextBox", id: "dollar", textValue: "$2,000", widgetValue: 2000 },
218	{ widget: "NumberTextBox", id: "quantity", textValue: "3", widgetValue: 3 },
219	{ widget: "ComboBox", id: "item", textValue: "refrigerators", widgetValue: "refrigerators" },
220	{ widget: "DateTextBox", id: "purchase", textValue: "01/05/2007", widgetValue: dojo.date.locale.parse("01/05/2007", {datePattern: 'MM/dd/yyyy', selector:'date'}) },
221	{ widget: "FilteringSelect", id: "state", textValue: "Pennsylvania", widgetValue: "PA" }
222	], function(test){
223	doh.register("preDefinedValue " + test.widget, {
224	timeout: 5000,
225	name: dojo.toJson(test.id),
226	runTest: function(){
227	var d = new doh.Deferred();
228	var inlineBox = dijit.byId(test.id);
229	var handler = inlineBox.connect(inlineBox, 'edit', function(){
230	inlineBox.disconnect(handler);
231	var editWidget = inlineBox.wrapperWidget.editWidget;
232	handler = editWidget.connect(editWidget, '_onFocus', function(){
233	editWidget.disconnect(handler);
234	setTimeout(d.getTestErrback(function(){
235	doh.is(test.textValue, inlineBox.get("value"), "inline text value");
236	doh.t(isVisible(editWidget), "editor widget should visible");
237	var expected = test.widgetValue,
238	actual = editWidget.get("value");
239	doh.is(typeof expected, typeof actual, "editor value typeof");
240	doh.is(expected.toString(), actual.toString(), "editor widget value");
241	handler = inlineBox.connect(inlineBox, 'onCancel',
242	function(){
243	inlineBox.disconnect(handler);
244	setTimeout(d.getTestCallback(function(){
245	doh.t(isHidden(inlineBox.wrapperWidget), "editor widget should hidden");
246	}), 500);
247	});
248	var buttons = dojo.query(".cancelButton", inlineBox.domNode.parentNode);
249	moveAndClick(buttons[buttons.length-1]);
250	}), 1500);
251	});
252	});
253	moveAndClick(inlineBox.domNode);
254	return d;
255	}
256	})
257	});
258
259	doh.register("renderAsHtml", [
260
261	// "plain text" mode, < > & have no special meaning
262	{
263	name: "false",
264	timeout: 10000,
265	runTest: function(){
266	var d = new doh.Deferred();
267
268	// confirm initial displayed value
269	var inlineBox = dijit.byId("renderAsHtml_false");
270	doh.is("<B>not bold</B>&lt;input&gt;", dojo.trim(inlineBox.domNode.innerHTML),
271	"confirm initial value (with special chars) wasn't modified");
272	doh.is("<B>not bold</B><input>", inlineBox.get("value"),
273	"confirm initial get('value')");
274
275	// launch editor, and make sure that special characters aren't mangled
276	moveAndClick(inlineBox.domNode);
277	doh.robot.sequence(d.getTestErrback(function(){
278	var editor = inlineBox.wrapperWidget.editWidget;
279	doh.is("<B>not bold</B><input>", editor.get("value"), "initial editor value");
280	}), 1000);
281
282	// edit value and save
283	doh.robot.keyPress(dojo.keys.RIGHT_ARROW, 1000, {});
284	doh.robot.typeKeys("end", 2000, 1000);
285	doh.robot.keyPress(dojo.keys.ENTER, 500, {});
286
287	// check that display value didn't mangle special characters
288	doh.robot.sequence(d.getTestCallback(function(){
289	doh.is("<B>not bold</B>&lt;input&gt;end", dojo.trim(inlineBox.domNode.innerHTML),
290	"displayed value after edit");
291	doh.is("<B>not bold</B><input>end", inlineBox.get("value"),
292	"get('value') after edit");
293	}), 1000);
294
295	return d;
296	}
297	},
298
299	// HTML mode, display mode has rich text, which is passed to editor
300	{
301	name: "true",
302	timeout: 10000,
303	runTest: function(){
304	var d = new doh.Deferred();
305
306	// confirm initial displayed value
307	var inlineBox = dijit.byId("renderAsHtml_true");
308	doh.is("<b>not bold</b><b>bold</b>&lt;input&gt;",
309	dojo.trim(inlineBox.domNode.innerHTML).toLowerCase(),
310	"confirm initial value (with special chars) wasn't modified");
311	doh.is("<b>not bold</b><b>bold</b>&lt;input&gt;",
312	inlineBox.get("value").toLowerCase(),
313	"confirm initial get('value')");
314
315	// launch editor, and make sure that value was passed to editor as HTML
316	moveAndClick(inlineBox.domNode);
317	doh.robot.sequence(d.getTestErrback(function(){
318	var editor = inlineBox.wrapperWidget.editWidget;
319	doh.is("<b>not bold</b><b>bold</b>&lt;input&gt;",
320	editor.get("value").toLowerCase(),
321	"initial editor value");
322	}), 1000);
323
324	// edit value and save
325	doh.robot.keyPress(dojo.keys.RIGHT_ARROW, 1000, {});
326	doh.robot.typeKeys("end", 2000, 1000);
327	doh.robot.keyPress(dojo.keys.ENTER, 500, {});
328
329	// check that display value didn't mangle special characters
330	doh.robot.sequence(d.getTestCallback(function(){
331	doh.is("<b>not bold</b><b>bold</b>&lt;input&gt;end",
332	dojo.trim(inlineBox.domNode.innerHTML).toLowerCase(),
333	"displayed value after edit");
334	doh.is("<b>not bold</b><b>bold</b>&lt;input&gt;end",
335	inlineBox.get("value").toLowerCase(),
336	"get('value') after edit");
337	}), 1000);
338
339	return d;
340	}
341	}
342	]);
343
344	doh.register("focus tests", [
345	{
346	name: "RTE",
347	timeout: 7000,
348	runTest: function(){
349	var d = new doh.Deferred();
350	var inlineBox = dijit.byId("inlineRTE");
351	var handler = inlineBox.connect(inlineBox, 'edit',
352	function(){
353	inlineBox.disconnect(handler);
354	setTimeout(function(){
355	handler = inlineBox.connect(inlineBox, 'save',
356	function(){
357	inlineBox.disconnect(handler);
358	setTimeout(d.getTestCallback(function(){
359	doh.t(isHidden(inlineBox.wrapperWidget), "editor widget should visible");
360	doh.t(inlineBox.get("value").indexOf('!start!') >= 0, "value changed");
361	}), 1000);
362	});
363	doh.robot.typeKeys("!start!", 1, 1400);
364	var buttons = dojo.query(".saveButton", inlineBox.domNode.parentNode);
365	moveAndClick(buttons[buttons.length-1]);
366	}, 1000);
367	});
368	moveAndClick(inlineBox.domNode);
369	return d;
370	}
371	}
372	]);
373
374	doh.run();
375	});
376	</script>
377	</head>
378	</html>

Note: See TracBrowser for help on using the repository browser.

Download in other formats: