root/public/javascripts/scriptaculous/test/unit/ajax_inplaceeditor_test.html

Revision 1, 40.4 kB (checked in by falcon, 17 years ago)

Version one -> initial work from the laptop.
Line 
1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
2        "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
3<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
4<head>
5  <title>script.aculo.us Unit test file</title>
6  <meta http-equiv="content-type" content="text/html; charset=utf-8" />
7  <script src="../../lib/prototype.js" type="text/javascript"></script>
8  <script src="../../src/scriptaculous.js" type="text/javascript"></script>
9  <script src="../../src/unittest.js" type="text/javascript"></script>
10  <link rel="stylesheet" href="../test.css" type="text/css" />
11</head>
12<body>
13<h1>script.aculo.us Unit test file</h1>
14<p>
15  Tests for <code>Ajax.InPlaceEditor</code> and <code>Ajax.InPlaceCollectionEditor</code> in controls.js
16</p>
17
18<!-- Log output -->
19<div id="testlog"> </div>
20
21<h1 id="tobeedited">To be edited</h1>
22<a id="tobeeditedEditControl" href="#">edit</a>
23
24<p id="newtbe">New to be edited</p>
25<p id="newtbe_external">External control for it</p>
26
27<div id="tobeeditedMultiLine">First line<br/>
28Second line<br/>
29Third line</div>
30
31<!-- Tests follow -->
32<script type="text/javascript" language="javascript" charset="utf-8">
33// <![CDATA[
34
35  var IPCE_COLLECTION = [
36    ['tbe',   'To be edited'],
37    ['ntbe',  'New to be edited'],
38    ['ntbe2', 'New to be edited 2'],
39    ['ntbe3', 'New to be edited 3']
40  ];
41
42  new Test.Unit.Runner({
43
44    setup: function() { with(this) {
45      inPlaceEditor = new Ajax.InPlaceEditor($('tobeedited'), '_ajax_inplaceeditor_result.html', {
46        externalControl: $('tobeeditedEditControl'),
47        ajaxOptions: {method: 'get'} //override so we can use a static for the result
48      });
49      inPlaceEditorMultiLine = new Ajax.InPlaceEditor($('tobeeditedMultiLine'), '_ajax_inplaceeditor_result.html', {
50        ajaxOptions: {method: 'get'} //override so we can use a static for the result
51      });
52    }},
53
54    teardown: function() { with(this) {
55      inPlaceEditor.dispose();
56      inPlaceEditorMultiLine.dispose();
57    }},
58
59    // Original-version tests, still pass thx to backward compatibility
60
61    // Integration test, tests the entire cycle
62    testInPlaceEditor: function() { with(this) {
63      Event.simulateMouse('tobeedited','click');
64      assertHidden($('tobeedited'));
65      assertNotNull(document.forms[0]);
66      assertEqual("cancel", document.forms[0].lastChild.innerHTML);
67      assertVisible(document.forms[0]);
68
69      Event.simulateMouse(document.forms[0].lastChild,'click');
70      assertNull(document.forms[0]);
71      assertVisible($('tobeedited'));
72      assertEqual("transparent", Element.getStyle('tobeedited','background-color'));
73      Event.simulateMouse('tobeedited','mouseover');
74      Event.simulateMouse('tobeedited','click');
75
76      assertEqual("INPUT", document.forms[0].firstChild.tagName);
77      assertEqual("To be edited", document.forms[0].firstChild.value);
78      assertEqual("INPUT", document.forms[0].childNodes[1].tagName);
79      assertEqual("submit", document.forms[0].childNodes[1].type);
80      assertEqual("To be edited", document.forms[0].firstChild.value);
81      assert(Element.hasClassName(document.forms[0], 'inplaceeditor-form'),
82        "form doesn't have proper class: " + document.forms[0].className);
83
84      Event.simulateMouse(document.forms[0].childNodes[1],'click');
85
86      assertVisible($('tobeedited'));
87      assertEqual("Saving...", $('tobeedited').innerHTML);
88      assertEqual("transparent", Element.getStyle('tobeedited','background-color'));
89      assert(Element.hasClassName($('tobeedited'), 'inplaceeditor-saving'),
90        "doesn't have saving class");
91
92      wait(1000, function() {
93        assertEqual("Server received: To be edited", $('tobeedited').innerHTML);
94        assertNull(document.forms[0]);
95        assertVisible($('tobeedited'));
96        assert(!Element.hasClassName($('tobeedited'), 'inplaceeditor-saving'));
97      });
98    }},
99
100    testHovering: function() { with(this) {
101      Event.simulateMouse('tobeedited','mouseover');
102      assertEqual("rgb(255, 255, 153)", Element.getStyle('tobeedited','background-color'));
103
104      Event.simulateMouse('tobeedited','mouseout');
105      wait(1100, function() {
106        assertEqual("transparent", Element.getStyle('tobeedited','background-color'),
107          "should be transparent after mouse leaves element");
108
109        Event.simulateMouse('tobeedited','click');
110      })
111    }},
112
113    testLoadsTextFromServer: function() { with(this) {
114      inPlaceEditor.options.loadTextURL = '_ajax_inplaceeditor_text.html';
115      inPlaceEditor.enterEditMode();
116      assertEqual('Loading...', inPlaceEditor._form.value.value);
117      assert(inPlaceEditor._form.value.disabled);
118      assert(Element.hasClassName(inPlaceEditor._form, 'inplaceeditor-loading'));
119      wait(1000, function() {
120        assertEqual('Text from server', inPlaceEditor._form.value.value);
121        assert(!inPlaceEditor._form.value.disabled);
122      });
123    }},
124
125    testDisposesProperly: function() { with(this) {
126      assertEqual("transparent", Element.getStyle('tobeedited','background-color'));
127      inPlaceEditor.dispose();
128      assertEqual("transparent", Element.getStyle('tobeedited','background-color'));
129      assertVisible($('tobeedited'));
130      Event.simulateMouse('tobeedited','click');
131      assertVisible($('tobeedited'));
132    }},
133
134    testUsesTextAreaWhenMoreThanOneRows: function() { with(this) {
135      inPlaceEditor.options.rows = 5;
136      inPlaceEditor.enterEditMode();
137      assertEqual("TEXTAREA", document.forms[0].firstChild.tagName);
138      assertEqual("BR", document.forms[0].childNodes[1].tagName);
139    }},
140
141    testCanSpecifyAllTextsThroughOptions: function() { with(this) {
142       // swedish translation ;-)
143      inPlaceEditor.options.okText = "spara";
144      inPlaceEditor.options.cancelText = "avbryt";
145      inPlaceEditor.options.savingText = "Sparar...";
146      inPlaceEditor.enterEditMode();
147      assertEqual("spara", document.forms[0].lastChild.previousSibling.value);
148      assertEqual("avbryt", document.forms[0].lastChild.innerHTML);
149      inPlaceEditor.showSaving();
150      assertEqual("Sparar...", $('tobeedited').innerHTML);
151    }},
152
153    testCanSpecifyFormIdThroughOptions: function() { with(this) {
154      inPlaceEditor.enterEditMode();
155      // default form id
156      assertEqual("tobeedited-inplaceeditor", document.forms[0].id);
157      inPlaceEditor.leaveEditMode();
158      inPlaceEditor.options.formId = "myFormId";
159      inPlaceEditor.enterEditMode();
160      assertEqual("myFormId", document.forms[0].id);
161    }},
162
163    testCantEditWhileSaving: function() { with(this) {
164      inPlaceEditor.prepareSubmission();
165      Event.simulateMouse('tobeedited','mouseover');
166      assertEqual("transparent", Element.getStyle('tobeedited','background-color'));
167      Event.simulateMouse('tobeedited','click');
168      assertVisible($('tobeedited'));
169    }},
170
171    testCallbackFunctionGetsCalled: function() { with(this) {
172      var called = false;
173      inPlaceEditor.options.callback = function(form) {
174        called = true;
175      }
176      Event.simulateMouse('tobeedited','click');
177      Event.simulateMouse(document.forms[0].childNodes[1],'click');
178      assert(called, "callback was not called");
179    }},
180
181    testCanUseExternalElementToGoIntoEditMode: function() { with(this) {
182      Event.simulateMouse('tobeeditedEditControl','click');
183      assertNotNull(document.forms[0], "external control didn't work");
184      // doesn't work if you click it again while in edit mode
185      Event.simulateMouse('tobeeditedEditControl','click');
186      assertNull(document.forms[1], "external control created two forms");
187      assertNotVisible($('tobeeditedEditControl'));
188      Event.simulateMouse(document.forms[0].childNodes[2],'click');
189      assertVisible($('tobeeditedEditControl'));
190    }},
191
192    // Rewritten-version tests
193    testControlOptions: function() {with(this) {
194      // Default, then explicit default-equivalent, settings
195      [{}, { okControl: 'button', cancelControl: 'link' }].each(function(opts) {
196        var ipe = new Ajax.InPlaceEditor('newtbe', '', opts);
197        Event.simulateMouse('newtbe', 'click');
198        var submits = $('newtbe-inplaceeditor').getInputs('submit');
199        assertEqual(1, submits.length, 'Not just one submit');
200        assertEqual(Ajax.InPlaceEditor.DefaultOptions.okText, submits[0].value, 'Incorrect button label');
201        assert(submits[0].hasClassName('editor_ok_button'), 'Missing class name on ok button');
202        var links = $$('#newtbe-inplaceeditor a');
203        assertEqual(1, links.length, 'Not just one link');
204        assertEqual(Ajax.InPlaceEditor.DefaultOptions.cancelText, links[0].firstChild.nodeValue, 'Incorrect cancel link text');
205        assert(links[0].href.endsWith('#'), 'Incorrect cancel link href');
206        assert(links[0].hasClassName('editor_cancel_link'), 'Missing class name on cancel link');
207        ipe.dispose();
208      });
209      // Reverse: ok link, cancel button
210      var ipe = new Ajax.InPlaceEditor('newtbe', '', { okControl: 'link', cancelControl: 'button' });
211      Event.simulateMouse('newtbe', 'click');
212      var links = $$('#newtbe-inplaceeditor a');
213      assertEqual(1, links.length, 'Not just one link');
214      assertEqual(Ajax.InPlaceEditor.DefaultOptions.okText, links[0].firstChild.nodeValue, 'Incorrect ok link text');
215      assert(links[0].href.endsWith('#'), 'Incorrect ok link href');
216      assert(links[0].hasClassName('editor_ok_link'), 'Missing class name on ok link');
217      var submits = $('newtbe-inplaceeditor').getInputs('submit');
218      assertEqual(1, submits.length, 'Not just one submit');
219      assertEqual(Ajax.InPlaceEditor.DefaultOptions.cancelText, submits[0].value, 'Incorrect button label');
220      assert(submits[0].hasClassName('editor_cancel_button'), 'Missing class name on cancel button');
221      ipe.dispose();
222      // Full links
223      ipe = new Ajax.InPlaceEditor('newtbe', '', { okControl: 'link' });
224      Event.simulateMouse('newtbe', 'click');
225      var links = $$('#newtbe-inplaceeditor a');
226      assertEqual(2, links.length, 'There should be two links');
227      assertEqual(Ajax.InPlaceEditor.DefaultOptions.okText, links[0].firstChild.nodeValue, 'Incorrect ok link text');
228      assertEqual(Ajax.InPlaceEditor.DefaultOptions.cancelText, links[1].firstChild.nodeValue, 'Incorrect cancel link text');
229      assert(links[0].href.endsWith('#'), 'Incorrect ok link href');
230      assert(links[1].href.endsWith('#'), 'Incorrect cancel link href');
231      assert(links[0].hasClassName('editor_ok_link'), 'Missing class name on ok link');
232      assert(links[1].hasClassName('editor_cancel_link'), 'Missing class name on cancel link');
233      var submits = $('newtbe-inplaceeditor').getInputs('submit');
234      assertEqual(0, submits.length, 'There should be no submit');
235      ipe.dispose();
236      // Full buttons
237      ipe = new Ajax.InPlaceEditor('newtbe', '', { cancelControl: 'button' });
238      Event.simulateMouse('newtbe', 'click');
239      var submits = $('newtbe-inplaceeditor').getInputs('submit');
240      assertEqual(2, submits.length, 'There should be two submits');
241      assertEqual(Ajax.InPlaceEditor.DefaultOptions.okText, submits[0].value, 'Incorrect ok button text');
242      assertEqual(Ajax.InPlaceEditor.DefaultOptions.cancelText, submits[1].value, 'Incorrect cancel button text');
243      assert(submits[0].hasClassName('editor_ok_button'), 'Missing class name on ok button');
244      assert(submits[1].hasClassName('editor_cancel_button'), 'Missing class name on cancel button');
245      var links = $$('#newtbe-inplaceeditor a');
246      assertEqual(0, links.length, 'There should be no link');
247      ipe.dispose();
248      // No cancel
249      ipe = new Ajax.InPlaceEditor('newtbe', '', { cancelControl: false });
250      Event.simulateMouse('newtbe', 'click');
251      var submits = $('newtbe-inplaceeditor').getInputs('submit');
252      assertEqual(1, submits.length, 'Not just one submit');
253      var links = $$('#newtbe-inplaceeditor a');
254      assertEqual(0, links.length, 'There should be no link');
255      ipe.dispose();
256      // No OK
257      ipe = new Ajax.InPlaceEditor('newtbe', '', { okControl: false });
258      Event.simulateMouse('newtbe', 'click');
259      var submits = $('newtbe-inplaceeditor').getInputs('submit');
260      assertEqual(0, submits.length, 'There should be no submit');
261      var links = $$('#newtbe-inplaceeditor a');
262      assertEqual(1, links.length, 'Not just one link');
263      ipe.dispose();
264      // Nothing
265      ipe = new Ajax.InPlaceEditor('newtbe', '', { okControl: false, cancelControl: false });
266      Event.simulateMouse('newtbe', 'click');
267      var submits = $('newtbe-inplaceeditor').getInputs('submit');
268      assertEqual(0, submits.length, 'There should be no submit');
269      var links = $$('#newtbe-inplaceeditor a');
270      assertEqual(0, links.length, 'There should be no link');
271      ipe.dispose();
272      // Texts: default mode
273      ipe = new Ajax.InPlaceEditor('newtbe', '', { okControl: false, cancelControl: false });
274      Event.simulateMouse('newtbe', 'click');
275      var submits = $('newtbe-inplaceeditor').getInputs('submit');
276      assertEqual(0, submits.length, 'There should be no submit');
277      var links = $$('#newtbe-inplaceeditor a');
278      assertEqual(0, links.length, 'There should be no link');
279      ipe.dispose();
280      // Texts: before w/ controls
281      ipe = new Ajax.InPlaceEditor('newtbe', '', { textBeforeControls: '[' });
282      Event.simulateMouse('newtbe', 'click');
283      var text = $('newtbe-inplaceeditor').childNodes[1];
284      assertEqual(3, text.nodeType, 'Missing/misplaced initial text');
285      assertEqual('[', text.nodeValue, 'Incorrect text');
286      ipe.dispose();
287      // Texts: after w/ controls
288      ipe = new Ajax.InPlaceEditor('newtbe', '', { textAfterControls: ']' });
289      Event.simulateMouse('newtbe', 'click');
290      var text = $('newtbe-inplaceeditor').childNodes[3];
291      assertEqual(3, text.nodeType, 'Missing/misplaced final text');
292      assertEqual(']', text.nodeValue, 'Incorrect text');
293      ipe.dispose();
294      // Texts: between w/ controls
295      ipe = new Ajax.InPlaceEditor('newtbe', '', { textBetweenControls: ' ' });
296      Event.simulateMouse('newtbe', 'click');
297      var text = $('newtbe-inplaceeditor').childNodes[2];
298      assertEqual(3, text.nodeType, 'Missing/misplaced middle text');
299      assertEqual(' ', text.nodeValue, 'Incorrect text');
300      ipe.dispose();
301      // Texts: before w/ no control
302      ipe = new Ajax.InPlaceEditor('newtbe', '', { textBeforeControls: '[', okControl: false, cancelControl: false });
303      Event.simulateMouse('newtbe', 'click');
304      var nodes = $('newtbe-inplaceeditor').childNodes;
305      assertEqual(1, nodes.length, 'Too many nodes in the form.');
306      ipe.dispose();
307      // Texts: after w/ no control
308      ipe = new Ajax.InPlaceEditor('newtbe', '', { textAfterControls: ']', okControl: false, cancelControl: false });
309      Event.simulateMouse('newtbe', 'click');
310      var nodes = $('newtbe-inplaceeditor').childNodes;
311      assertEqual(1, nodes.length, 'Too many nodes in the form.');
312      ipe.dispose();
313      // Texts: between w/ less than two controls
314      ipe = new Ajax.InPlaceEditor('newtbe', '', { textBetweenControls: ' ', okControl: false });
315      Event.simulateMouse('newtbe', 'click');
316      var nodes = $('newtbe-inplaceeditor').childNodes;
317      assertEqual(2, nodes.length, 'The form should have only two nodes (edit+cancel)');
318      assertEnumEqual(['input', 'a'], $A(nodes).pluck('tagName').invoke('toLowerCase'), 'Incorrect nodes');
319      ipe.dispose();
320    }},
321
322    testExternalControlOnly: function() {with(this) {
323      var ipe = new Ajax.InPlaceEditor('newtbe', '_ajax_inplaceeditor_result2.html', {
324        externalControl: 'newtbe_external'
325      });
326      Event.simulateMouse('newtbe', 'click');
327      assert(ipe._editing, 'Clicking on the element should turn editable.');
328      ipe.leaveEditMode();
329      Event.simulateMouse('newtbe_external', 'click');
330      assert(ipe._editing, 'Clicking on the external control should turn editable.');
331      ipe.dispose();
332      ipe = new Ajax.InPlaceEditor('newtbe', '_ajax_inplaceeditor_result2.html', {
333        externalControl: 'newtbe_external', externalControlOnly: true
334      });
335      Event.simulateMouse('newtbe', 'click');
336      assert(!ipe._editing, 'Clicking on the element should not turn editable.');
337      Event.simulateMouse('newtbe_external', 'click');
338      assert(ipe._editing, 'Clicking on the external control should turn editable.');
339      ipe.dispose();
340    }},
341
342    testNewCallbacks: function() {with(this) {
343      var called = [];
344      var opts = {
345        onEnterHover: function() { called.push('onEnterHover') },
346        onEnterEditMode: function() { called.push('onEnterEditMode') },
347        onLeaveEditMode: function() { called.push('onLeaveEditMode') },
348        callback: function(form) {
349          called.push('callback');
350          return form.serialize();
351        },
352        onFailure: function() { called.push('onFailure') },
353        onComplete: function() { called.push('onComplete') },
354        onLeaveEditMode: function() { called.push('onLeaveEditMode') }
355      }
356      // Proper success
357      $('newtbe').update('New to be edited');
358      var ipe = new Ajax.InPlaceEditor('newtbe', '_ajax_inplaceeditor_result2.html', opts);
359      Event.simulateMouse('newtbe', 'mouseover');
360      Event.simulateMouse('newtbe', 'click');
361      Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_RETURN });
362      var postUpdateHTML;
363      wait(1000, function() {
364        assertEnumEqual(['onEnterHover', 'onEnterEditMode', 'callback', 'onLeaveEditMode', 'onComplete'],
365          called.uniq(), 'Incorrect callback sequence');
366        postUpdateHTML = $('newtbe').innerHTML.strip();
367        assertEqual('New to be edited - edited', postUpdateHTML, 'Update trouble');
368        ipe.dispose();
369        // Failure
370        called.clear();
371        // Any ideas?  Requesting file:// URLs on non-existent stuff doesn't trigger A.U's onFailure...
372      });
373    }},
374
375    testCallbackFunctionReturnTypes: function() { with(this) {
376      var params = [];
377      var responder = {
378        onCreate: function(req) {
379          params.push(req.options.parameters);
380        }
381      };
382      Ajax.Responders.register(responder);
383      var ipe = new Ajax.InPlaceEditor('newtbe', '_ajax_inplaceeditor_result2.html', {
384        callback: function(form) {
385          return 'foo=bar';
386        }
387      });
388      Event.simulateMouse('newtbe', 'click');
389      Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_RETURN });
390      wait(200, function() {
391        assert(params[0] && params[0].foo == 'bar');
392        ipe.dispose();
393        ipe = new Ajax.InPlaceEditor('newtbe', '_ajax_inplaceeditor_result2.html', {
394          callback: function(form) {
395            return { bar: '?', 'r&d': 42 };
396          }
397        });
398        Event.simulateMouse('newtbe', 'click');
399        Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_RETURN });
400        wait(200, function() {
401          assert(params[1] && params[1].bar == '?' && params[1]['r&d'] == 42);
402          ipe.dispose();
403          Ajax.Responders.unregister(responder);
404        })
405      });
406    }},
407
408    testHtmlResponse: function() {with(this) {
409      // Default (true) -> A.U w/ evalScripts: true
410      $('newtbe').update('New to be edited');
411      var ipe = new Ajax.InPlaceEditor('newtbe', '_ajax_inplaceeditor_result2.html');
412      Event.simulateMouse('newtbe', 'mouseover');
413      Event.simulateMouse('newtbe', 'click');
414      Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_RETURN });
415      var postUpdateHTML;
416      wait(1000, function() {
417        postUpdateHTML = $('newtbe').innerHTML.strip();
418        assertEqual('New to be edited - edited', postUpdateHTML, 'Should have updated contents');
419        ipe.dispose();
420        // Explicit htmlResponse: true -> A.U w/ evalScripts: true
421        $('newtbe').update('New to be edited');
422        ipe = new Ajax.InPlaceEditor('newtbe', '_ajax_inplaceeditor_result2.html', { htmlResponse: true });
423        Event.simulateMouse('newtbe', 'mouseover');
424        Event.simulateMouse('newtbe', 'click');
425        Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_RETURN });
426        wait(1000, function() {
427          postUpdateHTML = $('newtbe').innerHTML.strip();
428          assertEqual('New to be edited - edited', postUpdateHTML, 'Should have updated contents');
429          ipe.dispose();
430          // Explicit htmlResponse: false -> A.R
431          $('newtbe').update('New to be edited');
432          ipe = new Ajax.InPlaceEditor('newtbe', '_ajax_inplaceeditor_result2.html', { htmlResponse: false });
433          Event.simulateMouse('newtbe', 'mouseover');
434          Event.simulateMouse('newtbe', 'click');
435          Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_RETURN });
436          wait(1000, function() {
437            postUpdateHTML = $('newtbe').innerHTML.strip();
438            assertEqual(ipe.options.savingText, postUpdateHTML, 'Should not have updated contents');
439            ipe.dispose();
440          });
441        });
442      });
443    }},
444
445    testSingleOrMultipleRows: function() {with(this) {
446      // Single-line value, rows <= 1 -> 1
447      $('newtbe').update('New to be edited');
448      var ipe = new Ajax.InPlaceEditor('newtbe',
449        '_ajax_inplaceeditor_result2.html');
450      Event.simulateMouse('newtbe', 'mouseover');
451      Event.simulateMouse('newtbe', 'click');
452      assertEqual('input', ipe._controls.editor.tagName.toLowerCase());
453      ipe.dispose();
454      // Single-line value, rows > 1 (2) -> 2
455      var ipe = new Ajax.InPlaceEditor('newtbe',
456        '_ajax_inplaceeditor_result2.html', { rows: 2 });
457      Event.simulateMouse('newtbe', 'mouseover');
458      Event.simulateMouse('newtbe', 'click');
459      assertEqual('textarea', ipe._controls.editor.tagName.toLowerCase());
460      assertEqual(2, ipe._controls.editor.rows);
461      ipe.dispose();
462      // Multiple-line value, rows <= 1, autoRows default (3) -> 3
463      $('newtbe').update('Line 1\nLine 2\nLine 3');
464      var ipe = new Ajax.InPlaceEditor('newtbe',
465        '_ajax_inplaceeditor_result2.html');
466      Event.simulateMouse('newtbe', 'mouseover');
467      Event.simulateMouse('newtbe', 'click');
468      assertEqual('textarea', ipe._controls.editor.tagName.toLowerCase());
469      assertEqual(Ajax.InPlaceEditor.DefaultOptions.autoRows, ipe._controls.editor.rows);
470      ipe.dispose();
471      // Multiple-line value, rows <= 1, autoRows custom (5) -> 5
472      var ipe = new Ajax.InPlaceEditor('newtbe',
473        '_ajax_inplaceeditor_result2.html', { autoRows: 5 });
474      Event.simulateMouse('newtbe', 'mouseover');
475      Event.simulateMouse('newtbe', 'click');
476      assertEqual('textarea', ipe._controls.editor.tagName.toLowerCase());
477      assertEqual(5, ipe._controls.editor.rows);
478      ipe.dispose();
479      // Multiple-line value, rows > 1 (2), autoRows default (3) -> 2
480      var ipe = new Ajax.InPlaceEditor('newtbe',
481        '_ajax_inplaceeditor_result2.html', { rows: 2 });
482      Event.simulateMouse('newtbe', 'mouseover');
483      Event.simulateMouse('newtbe', 'click');
484      assertEqual('textarea', ipe._controls.editor.tagName.toLowerCase());
485      assertEqual(2, ipe._controls.editor.rows);
486      ipe.dispose();
487      // Multiple-line value, rows > 1 (2), autoRows custom (5) -> 2
488      var ipe = new Ajax.InPlaceEditor('newtbe',
489        '_ajax_inplaceeditor_result2.html', { rows: 2, autoRows: 5 });
490      Event.simulateMouse('newtbe', 'mouseover');
491      Event.simulateMouse('newtbe', 'click');
492      assertEqual('textarea', ipe._controls.editor.tagName.toLowerCase());
493      assertEqual(2, ipe._controls.editor.rows);
494      ipe.dispose();
495    }},
496
497    testFormCustomizationCallback: function() {with(this) {
498      var ipe = new Ajax.InPlaceEditor('newtbe', '_ajax_inplaceeditor_result2.html', {
499        onFormCustomization: function(ipe, form) {
500          form.appendChild(new Element('input', { type: 'text', name: 'test', value: 'foobar' }));
501        }
502      });
503      Event.simulateMouse('newtbe', 'mouseover');
504      Event.simulateMouse('newtbe', 'click');
505      assertEqual('foobar', Form.serialize(ipe._form, true).test, 'Custom field not present');
506      ipe.dispose();
507    }},
508
509    testPostCreationBehavior: function() {with(this) {
510      var focused = false, activated = false;
511      function override(name, fx) {
512        arguments.callee.backups[name] = Field.Methods[name];
513        Field.Methods[name] = fx;
514      };
515      override.backups = {};
516      function restore() {
517        $A(arguments).each(function(n) {
518          Field.Methods[name] = override.backups[name];
519        });
520        Element.addMethods();
521      };
522      override('activate', function(elt) {
523        override.backups['activate'](elt);
524        activated = true;
525      });
526      override('focus', function(elt) { focused = true; });
527      Element.addMethods();
528      // fieldPostCreation default (activate)
529      var ipe = new Ajax.InPlaceEditor('newtbe',
530        '_ajax_inplaceeditor_result2.html');
531      Event.simulateMouse('newtbe', 'mouseover');
532      Event.simulateMouse('newtbe', 'click');
533      assert(focused && activated, "Should be focused and activated (resp. " + focused + " and " + activated + ')');
534      ipe.dispose();
535      // fieldPostCreation == 'focus'
536      focused = activated = false;
537      ipe = new Ajax.InPlaceEditor('newtbe',
538        '_ajax_inplaceeditor_result2.html', { fieldPostCreation: 'focus' });
539      Event.simulateMouse('newtbe', 'mouseover');
540      Event.simulateMouse('newtbe', 'click');
541      assert(focused && !activated, "Should be focused, not activated (resp. " + focused + " and " + activated + ')');
542      ipe.dispose();
543      // fieldPostCreation == false
544      focused = activated = false;
545      ipe = new Ajax.InPlaceEditor('newtbe',
546        '_ajax_inplaceeditor_result2.html', { fieldPostCreation: false });
547      Event.simulateMouse('newtbe', 'mouseover');
548      Event.simulateMouse('newtbe', 'click');
549      assert(!focused && !activated, "Should be neither focused nor activated (resp. " + focused + " and " + activated + ')');
550      ipe.dispose();
551      // fieldPostCreation == non-false yet neither activate nor focus -> default
552      focused = activated = false;
553      ipe = new Ajax.InPlaceEditor('newtbe',
554        '_ajax_inplaceeditor_result2.html', { fieldPostCreation: 'foobar' });
555      Event.simulateMouse('newtbe', 'mouseover');
556      Event.simulateMouse('newtbe', 'click');
557      assert(focused && activated, "Should be focused and activated (resp. " + focused + " and " + activated + ')');
558      ipe.dispose();
559      restore('activate', 'focus');
560    }},
561
562    testResponseTagStripping: function() {with(this) {
563      // stripLoadedTextTags default (false)
564      var ipe = new Ajax.InPlaceEditor('newtbe',
565        '_ajax_inplaceeditor_result2.html',
566        { loadTextURL: '_ajax_inplaceeditor_tagged.html' });
567      Event.simulateMouse('newtbe', 'mouseover');
568      Event.simulateMouse('newtbe', 'click');
569      wait(1000, function() {
570        assertEqual('<span>New to be edited - edited</span>', ipe._controls.editor.value.strip());
571        ipe.dispose();
572        // stripLoadedTextTags == true
573        ipe = new Ajax.InPlaceEditor('newtbe',
574          '_ajax_inplaceeditor_result2.html',
575          { loadTextURL: '_ajax_inplaceeditor_tagged.html',
576            stripLoadedTextTags: true });
577        Event.simulateMouse('newtbe', 'mouseover');
578        Event.simulateMouse('newtbe', 'click');
579        wait(1000, function() {
580          assertEqual('New to be edited - edited', ipe._controls.editor.value.strip());
581          ipe.dispose();
582        });
583      });
584    }},
585
586    testSubmitOnBlur: function() {with(this) {
587      // submitOnBlur default (false)
588      $('newtbe').update('To be edited');
589      var ipe = new Ajax.InPlaceEditor('newtbe',
590        '_ajax_inplaceeditor_result2.html');
591      Event.simulateMouse('newtbe', 'mouseover');
592      Event.simulateMouse('newtbe', 'click');
593      ipe._controls.editor.blur();
594      wait(1000, function() {
595        assertEqual('To be edited', ipe._controls.editor ?  ipe._controls.editor.value : '');
596        ipe.dispose();
597        // submitOnBlur == true
598        ipe = new Ajax.InPlaceEditor('newtbe',
599          '_ajax_inplaceeditor_result2.html', { submitOnBlur: true });
600        Event.simulateMouse('newtbe', 'mouseover');
601        Event.simulateMouse('newtbe', 'click');
602        ipe._controls.editor.blur();
603        wait(1200, function() {
604          assertEqual('New to be edited - edited', $('newtbe').innerHTML.strip());
605          ipe.dispose();
606        });
607      });
608    }},
609
610    testEscReturnKeys: function() {with(this) {
611      // No controls, Esc
612      var ipe = new Ajax.InPlaceEditor('newtbe',
613        '_ajax_inplaceeditor_result2.html', { okControl: false, cancelControl: false});
614      Event.simulateMouse('newtbe', 'mouseover');
615      Event.simulateMouse('newtbe', 'click');
616      Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_ESC });
617      assert(!ipe._editing, 'Esc should have disabled IPE');
618      ipe.dispose();
619      // Cancel control, Esc
620      var ipe = new Ajax.InPlaceEditor('newtbe',
621        '_ajax_inplaceeditor_result2.html', { okControl: false });
622      Event.simulateMouse('newtbe', 'mouseover');
623      Event.simulateMouse('newtbe', 'click');
624      Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_ESC });
625      assert(!ipe._editing, 'Esc should have disabled IPE');
626      ipe.dispose();
627      // OK control, Esc
628      var ipe = new Ajax.InPlaceEditor('newtbe',
629        '_ajax_inplaceeditor_result2.html', { cancelControl: false });
630      Event.simulateMouse('newtbe', 'mouseover');
631      Event.simulateMouse('newtbe', 'click');
632      Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_ESC });
633      assert(!ipe._editing, 'Esc should have disabled IPE');
634      ipe.dispose();
635      // Both controls, Esc
636      ipe = new Ajax.InPlaceEditor('newtbe',
637        '_ajax_inplaceeditor_result2.html');
638      Event.simulateMouse('newtbe', 'mouseover');
639      Event.simulateMouse('newtbe', 'click');
640      Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_ESC });
641      assert(!ipe._editing, 'Esc should have disabled IPE');
642      ipe.dispose();
643      // No controls, Return
644      $('newtbe').update('New to be edited');
645      ipe = new Ajax.InPlaceEditor('newtbe',
646        '_ajax_inplaceeditor_result2.html', { okControl: false, cancelControl: false });
647      Event.simulateMouse('newtbe', 'mouseover');
648      Event.simulateMouse('newtbe', 'click');
649      Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_RETURN });
650      wait(1000, function() {
651        assertEqual('New to be edited - edited', $('newtbe').innerHTML.strip());
652        ipe.dispose();
653        // Cancel control, Return
654        $('newtbe').update('New to be edited');
655        ipe = new Ajax.InPlaceEditor('newtbe',
656          '_ajax_inplaceeditor_result2.html', { okControl: false });
657        Event.simulateMouse('newtbe', 'mouseover');
658        Event.simulateMouse('newtbe', 'click');
659        Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_RETURN });
660        wait(1000, function() {
661          assertEqual('New to be edited - edited', $('newtbe').innerHTML.strip());
662          ipe.dispose();
663          // OK control, Return
664          $('newtbe').update('New to be edited');
665          ipe = new Ajax.InPlaceEditor('newtbe',
666            '_ajax_inplaceeditor_result2.html', { cancelControl: false });
667          Event.simulateMouse('newtbe', 'mouseover');
668          Event.simulateMouse('newtbe', 'click');
669          Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_RETURN });
670          wait(1000, function() {
671            assertEqual('New to be edited - edited', $('newtbe').innerHTML.strip());
672            ipe.dispose();
673            // Both controls, Return
674            $('newtbe').update('New to be edited');
675            ipe = new Ajax.InPlaceEditor('newtbe',
676              '_ajax_inplaceeditor_result2.html');
677            Event.simulateMouse('newtbe', 'mouseover');
678            Event.simulateMouse('newtbe', 'click');
679            Event.simulateKey('newtbe', 'keydown', { keyCode: Event.KEY_RETURN });
680            wait(1000, function() {
681              assertEqual('New to be edited - edited', $('newtbe').innerHTML.strip());
682              ipe.dispose();
683            });
684          });
685        });
686      });
687    }},
688
689    testIPCEBasic: function() {with(this) {
690      // Basic creation, population and choice.
691      $('newtbe').update('ntbe');
692      var fieldValue = '';
693      var ipe = new Ajax.InPlaceCollectionEditor('newtbe',
694        '_ajax_inplaceeditor_result2.html', { paramName: 'test',
695        collection: IPCE_COLLECTION, callback: function(f, value) {
696          fieldValue = value;
697        }, onComplete: Prototype.emptyFunction
698      });
699      Event.simulateMouse('newtbe', 'mouseover');
700      Event.simulateMouse('newtbe', 'click');
701      var editor = ipe._controls.editor;
702      assertEqual('test', editor.name);
703      assertEqual('select', editor.tagName.toLowerCase());
704      assertEqual(IPCE_COLLECTION.length, editor.options.length, 'Incorrect amount of options');
705      for (var index = 0; index < IPCE_COLLECTION.length; ++index) {
706        var ref = IPCE_COLLECTION[index];
707        var item = editor.options[index];
708        assertEqual(ref[0], item.value, 'Incorrect OPTION value');
709        assertEqual(ref[1], item.text.strip(), 'Incorrect OPTION text');
710      };
711      assertEqual(1, editor.selectedIndex, 'Did not properly select item');
712      editor.selectedIndex = 2;
713      Event.simulateMouse(ipe._controls.ok, 'click');
714      assertEqual('ntbe2', fieldValue);
715      ipe.dispose();
716      // Test the value option
717      $('newtbe').update('ntbe');
718      ipe = new Ajax.InPlaceCollectionEditor('newtbe',
719        '_ajax_inplaceeditor_result2.html', { paramName: 'test',
720        collection: IPCE_COLLECTION, onComplete: Prototype.emptyFunction,
721        value: 'ntbe2'
722      });
723      Event.simulateMouse('newtbe', 'mouseover');
724      Event.simulateMouse('newtbe', 'click');
725      editor = ipe._controls.editor;
726      assertEqual(2, editor.selectedIndex, 'Did not properly select item');
727      ipe.dispose();
728    }},
729
730    testIPCECollectionSyntaxes: function() {with(this) {
731      // Array of two-item arrays (0 = value, 1 = text)
732      $('newtbe').update('ntbe');
733      var ipe = new Ajax.InPlaceCollectionEditor('newtbe',
734        '_ajax_inplaceeditor_result2.html', { paramName: 'test',
735        collection: IPCE_COLLECTION, onComplete: Prototype.emptyFunction
736      });
737      Event.simulateMouse('newtbe', 'mouseover');
738      Event.simulateMouse('newtbe', 'click');
739      var editor = ipe._controls.editor;
740      assertEqual(1, editor.selectedIndex, 'Did not properly select item');
741      // (further contents testing already done in Basic)
742      ipe.dispose();
743      // Array of one-item arrays
744      ipe = new Ajax.InPlaceCollectionEditor('newtbe',
745        '_ajax_inplaceeditor_result2.html', { paramName: 'test',
746        collection: [['tbe'], ['ntbe'], ['ntbe2'], ['ntbe3']],
747        onComplete: Prototype.emptyFunction
748      });
749      Event.simulateMouse('newtbe', 'mouseover');
750      Event.simulateMouse('newtbe', 'click');
751      var editor = ipe._controls.editor;
752      assertEqual(1, editor.selectedIndex, 'Did not properly select item');
753      assertEqual('ntbe', $F(editor).strip(), 'Did not properly define text');
754      ipe.dispose();
755      // Array of items
756      ipe = new Ajax.InPlaceCollectionEditor('newtbe',
757        '_ajax_inplaceeditor_result2.html', { paramName: 'test',
758        collection: ['tbe', 'ntbe', 'ntbe2', 'ntbe3'],
759        onComplete: Prototype.emptyFunction
760      });
761      Event.simulateMouse('newtbe', 'mouseover');
762      Event.simulateMouse('newtbe', 'click');
763      var editor = ipe._controls.editor;
764      assertEqual(1, editor.selectedIndex, 'Did not properly select item');
765      assertEqual('ntbe', $F(editor).strip(), 'Did not properly define text');
766      ipe.dispose();
767    }},
768
769    testIPCEAlternateTextOptions: function() {with(this) {
770      // loadTextURL (check loading text, verify alternate text eventually)
771      $('newtbe').update('New to be edited');
772      var ipe = new Ajax.InPlaceCollectionEditor('newtbe',
773        '_ajax_inplaceeditor_result2.html', { paramName: 'test',
774        collection: IPCE_COLLECTION, loadTextURL: '_ajax_inplaceeditor_ipce_alt_text.html',
775        onComplete: Prototype.emptyFunction
776      });
777      Event.simulateMouse('newtbe', 'mouseover');
778      Event.simulateMouse('newtbe', 'click');
779      var editor = ipe._controls.editor;
780      var text = editor.options[editor.selectedIndex].text.strip();
781      assertEqual(Ajax.InPlaceEditor.DefaultOptions.loadingText, text);
782      wait(1200, function() {
783        assertEqual(1, editor.selectedIndex, 'Did not properly select item based on alternate text.');
784        ipe.dispose();
785      });
786    }},
787
788    testIPCEDynamicCollectionOptions: function() {with(this) {
789      // loadCollectionURL, default loadingCollectionText
790      $('newtbe').update('ntbe');
791      var ipe = new Ajax.InPlaceCollectionEditor('newtbe',
792        '_ajax_inplaceeditor_result2.html', { paramName: 'test',
793        loadCollectionURL: '_ajax_inplaceeditor_ipce_collection.js',
794        onComplete: Prototype.emptyFunction
795      });
796      Event.simulateMouse('newtbe', 'mouseover');
797      Event.simulateMouse('newtbe', 'click');
798      var editor = ipe._controls.editor;
799      var text = editor.options[editor.selectedIndex].text.strip();
800      assertEqual(Ajax.InPlaceCollectionEditor.DefaultOptions.loadingCollectionText, text);
801      wait(1000, function() {
802        assertEqual(5, ipe._collection.length);
803        assertEqual(2, editor.selectedIndex, 'Did not properly select item');
804        ipe.dispose();
805        // loadCollectionURL, custom loadingCollectionText
806        $('newtbe').update('bar');
807        ipe = new Ajax.InPlaceCollectionEditor('newtbe',
808          '_ajax_inplaceeditor_result2.html', { paramName: 'test',
809          loadCollectionURL: '_ajax_inplaceeditor_ipce_collection.js',
810          loadingCollectionText: 'There we go...',
811          onComplete: Prototype.emptyFunction
812        });
813        Event.simulateMouse('newtbe', 'mouseover');
814        Event.simulateMouse('newtbe', 'click');
815        editor = ipe._controls.editor;
816        text = editor.options[editor.selectedIndex].text.strip();
817        assertEqual('There we go...', text);
818        wait(1000, function() {
819          assertEqual(1, editor.selectedIndex, 'Did not properly select item');
820          ipe.dispose();
821        });
822      });
823    }},
824
825    testIPCEATPlusDC: function() {with(this) {
826      // loadCollectionURL, loadTextURL
827      $('newtbe').update('Like I care');
828      var ipe = new Ajax.InPlaceCollectionEditor('newtbe',
829        '_ajax_inplaceeditor_result2.html', { paramName: 'test',
830        loadCollectionURL: '_ajax_inplaceeditor_ipce_collection.js',
831        loadingCollectionText: 'There we go...',
832        loadTextURL: '_ajax_inplaceeditor_ipce_alt_text.html',
833        loadingText: 'OK, so, the text...',
834        onComplete: Prototype.emptyFunction
835      });
836      ipe._regularCFET = ipe.checkForExternalText;
837      ipe.checkForExternalText = function() {
838        assert(5, ipe._collection.length);
839        ipe._regularCFET();
840        var editor = ipe._controls.editor;
841        var text = editor.options[editor.selectedIndex].text.strip();
842        assertEqual('OK, so, the text...', text);
843      };
844      Event.simulateMouse('newtbe', 'mouseover');
845      Event.simulateMouse('newtbe', 'click');
846      var editor = ipe._controls.editor;
847      var text = editor.options[editor.selectedIndex].text.strip();
848      assertEqual('There we go...', text);
849      wait(2000, function() {
850        assertEqual(2, editor.selectedIndex, 'Did not properly select item');
851        ipe.dispose();
852      });
853    }},
854
855    testDeprecationLayer: function() {with(this) {
856      // FIXME: needs to be coded yet, doesn't it?
857      var ipe = new Ajax.InPlaceCollectionEditor('newtbe',
858        '_ajax_inplaceeditor_result2.html', { paramName: 'test',
859        okButton: false, cancelLink: false
860      });
861      assertIdentical(false, ipe.options.okControl, 'OK control should be disabled');
862      assertIdentical(false, ipe.options.cancelControl, 'Cancel control should be disabled');
863      ipe.dispose();
864      ipe = new Ajax.InPlaceCollectionEditor('newtbe',
865        '_ajax_inplaceeditor_result2.html', { paramName: 'test',
866        okLink: true, cancelButton: true
867      });
868      assertEqual('link', ipe.options.okControl, 'OK control should be a link');
869      assertEqual('button', ipe.options.cancelControl, 'Cancel control should be a button');
870      ipe.dispose();
871      ipe = new Ajax.InPlaceCollectionEditor('newtbe',
872        '_ajax_inplaceeditor_result2.html', { paramName: 'test',
873        highlightcolor: '#ff0000', highlightendcolor: '#00ff00'
874      });
875      assertEqual('#ff0000', ipe.options.highlightColor, 'Highlight color was not migrated');
876      assertEqual('#00ff00', ipe.options.highlightEndColor, 'Highlight end color was not migrated');
877      ipe.dispose();
878    }}
879    // FIXME: add AC w/o key conflicts?
880    // FIXME: doc w/ full details on what's new, what's changed, etc. + deprecation layer info.
881  });
882// ]]>
883</script>
884</body>
885</html>
Note: See TracBrowser for help on using the browser.