UNPKG

dijit

Version:

Dijit provides a complete collection of user interface controls based on Dojo, giving you the power to create web applications that are highly optimized for usability, performance, internationalization, accessibility, but above all deliver an incredible u

431 lines (406 loc) 15.8 kB
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>robot InlineEditBox Test</title> <style> @import "../../../util/doh/robot/robot.css"; </style> <!-- required: dojo.js --> <script type="text/javascript" src="../../../dojo/dojo.js" data-dojo-config="isDebug: true"></script> <script type="text/javascript"> require([ "doh/runner", "dojo/robotx", "dojo/_base/array", "dojo/aspect", "dojo/date/locale", "dojo/keys", "dojo/_base/lang", "dojo/query", "dijit/tests/helpers", "dojo/domReady!" ], function(doh, robot, array, aspect, datelocale, keys, lang, query, helpers){ robot.initRobot('../test_InlineEditBox.html'); function moveAndClick(node){ robot.mouseMoveAt(node, 500, 1); robot.mouseClick({left: true}, 500); } doh.register(function setup(){ // get pointer to registry in the iframe registry = robot.window.require("dijit/registry"); }); doh.register("dijit.InlineEditBox autosave tests", [ { name: "CurrencyTextBox invalid value: blur", timeout: 10000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId("dollar_as"); moveAndClick(inlineBox.domNode); robot.typeKeys("dollar", 1000, 1200); // invalid moveAndClick("predefined"); robot.sequence(d.getTestCallback(function(){ var currencyTextBox = inlineBox.wrapperWidget.editWidget; doh.is('dollar', currencyTextBox.get("displayedValue"), "displayedValue"); doh.f(currencyTextBox.isValid(), "!isValid"); inlineBox.cancel(false); doh.is('', inlineBox.get("value"), "value"); }), 1000); return d; } }, { name: "CurrencyTextBox invalid value: ENTER", timeout: 10000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId("dollar_as"); var displayedValue, isValid; moveAndClick(inlineBox.domNode); robot.typeKeys("dollar", 1000, 1200); // invalid robot.keyPress(keys.ENTER, 500, {}); robot.sequence(function(){ var currencyTextBox = inlineBox.wrapperWidget.editWidget; displayedValue = currencyTextBox.get("displayedValue"); isValid = currencyTextBox.isValid(); }, 1000); robot.keyPress(keys.ESCAPE, 500, {}); robot.sequence(d.getTestCallback(function(){ doh.is('dollar', displayedValue, "displayedValue"); doh.f(isValid, "!isValid"); doh.is('', inlineBox.get("value"), "value"); }), 1000); return d; } }, { name: "CurrencyTextBox valid value: blur", timeout: 10000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId("dollar_as"); moveAndClick(inlineBox.domNode); robot.typeKeys("123", 1000, 600); moveAndClick("predefined"); robot.sequence(d.getTestCallback(function(){ doh.is("$123.00", inlineBox.get("value"), "value"); }), 1000); return d; } }, { name: "CurrencyTextBox valid value: ENTER", timeout: 10000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId("dollar_as"); moveAndClick(inlineBox.domNode); robot.typeKeys("234", 1000, 600); robot.keyPress(keys.ENTER, 500, {}); robot.sequence(d.getTestCallback(function(){ doh.is('$234.00', inlineBox.get("value"), "value"); }), 1000); return d; } }, { name: "CurrencyTextBox valid value: ESCAPE", timeout: 10000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId("dollar_as"); moveAndClick(inlineBox.domNode); robot.typeKeys("345", 1000, 600); robot.keyPress(keys.ESCAPE, 500, {}); robot.sequence(d.getTestCallback(function(){ doh.is("$234.00", inlineBox.get("value"), "value"); }), 1000); return d; } }, { name: "CurrencyTextBox valid value: TAB", timeout: 10000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId("dollar_as"); moveAndClick(inlineBox.domNode); robot.typeKeys("456", 1000, 600); robot.keyPress(keys.TAB, 500, {}); robot.sequence(d.getTestCallback(function(){ doh.is('$456.00', inlineBox.get("value"), "value"); }), 1000); return d; } }, { name: "Focus test", timeout: 15000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId("editable"); var initialOnChange = inlineBox._onChangeValue; inlineBox.set("value", ""); inlineBox.edit(); robot.typeKeys("editable", 1000, 1600); robot.keyPress(keys.TAB, 500, {}); robot.keyPress(keys.TAB, 1500, {}); // wait more than 1 second to TAB robot.keyPress(keys.ENTER, 500, {}); robot.typeKeys("567", 500, 600); robot.keyPress(keys.ENTER, 500, {}); robot.keyPress(keys.TAB, 500, {shift:true}); // do this fast robot.keyPress(keys.TAB, 500, {shift:true}); // do this fast robot.keyPress(keys.ENTER, 500, {}); // quickly back to editable robot.keyPress(keys.RIGHT_ARROW, 500, {}); robot.typeKeys(" again", 1000, 1200); robot.keyPress(keys.TAB, 500, {}); robot.sequence(d.getTestCallback(function(){ doh.is(undefined, initialOnChange, "no onChange value"); doh.is('$567.00', registry.byId("dollar_as").get("value"), "value"); doh.is('editable again', inlineBox.get("value"), "value"); doh.is('editable again', inlineBox._onChangeValue, "onChange value"); }), 1000); return d; } }, { name: "Textarea test", timeout: 15000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId("textarea"); moveAndClick(inlineBox.domNode); robot.typeKeys("line 1", 1000, 1200); robot.keyPress(keys.ENTER, 500, {}); robot.typeKeys("line 2", 500, 1200); moveAndClick("predefined"); robot.sequence(d.getTestCallback(function(){ doh.is('line 1\\nline 2', inlineBox.get("value").replace(/\n/g, "\\n"), "textarea programmatic value was " + inlineBox.get("value").replace(/\n/g, "\\n")); doh.is('line 1<br>line 2', inlineBox.domNode.innerHTML.toLowerCase(), "textarea rendered value was " + inlineBox.domNode.innerHTML); }), 1000); return d; } } ]); // Testing that the initial display value of the InlineEditBox gets sent to the editor. // For example, in this markup: // <span dojoType="dijit.InlineEditBox" ...>01/05/2007</span> // When the editor is clicked the calendar should open to that date. array.forEach([ { widget: "CurrencyTextBox", id: "dollar", textValue: "$2,000", widgetValue: 2000 }, { widget: "NumberTextBox", id: "quantity", textValue: "3", widgetValue: 3 }, { widget: "ComboBox", id: "item", textValue: "refrigerators", widgetValue: "refrigerators" }, { widget: "DateTextBox", id: "purchase", textValue: "01/05/2007", widgetValue: datelocale.parse("01/05/2007", {datePattern: 'MM/dd/yyyy', selector:'date'}) }, { widget: "FilteringSelect", id: "state", textValue: "Pennsylvania", widgetValue: "PA" }, { widget: "Select", id: "country", textValue: "United States of America", widgetValue: "US" } ], function(test){ doh.register("preDefinedValue " + test.widget, { timeout: 8000, name: test.id, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId(test.id); var handler = aspect.after(inlineBox, 'edit', function(){ handler.remove(); var editWidget = inlineBox.wrapperWidget.editWidget; handler = aspect.after(editWidget, '_onFocus', function(){ handler.remove(); robot.sequence(function(){ var textValue = test.textValue, value = inlineBox.get("value"), visible = helpers.isVisible(editWidget), expected = test.widgetValue, actual = editWidget.get("value"), showHandler = aspect.after(inlineBox, 'save', d.getTestCallback(function(){ cancelHandler.remove(); showHandler.remove(); doh.t(false, "Save was clicked"); }), true), cancelHandler = aspect.after(inlineBox, 'onCancel', function(){ cancelHandler.remove(); showHandler.remove(); robot.sequence(d.getTestCallback(function(){ doh.is(textValue, value, "inline text value"); doh.t(visible, "editor widget should be visible"); doh.is(typeof expected, typeof actual, "editor value typeof"); doh.is(expected.toString(), actual.toString(), "editor widget value"); doh.t(helpers.isHidden(inlineBox.wrapperWidget), "editor widget should be hidden"); }), 500); }, true), buttons = query(".dijitButton", inlineBox.domNode.parentNode); moveAndClick(buttons[buttons.length-2]); // Save should be disabled so nothing happens moveAndClick(buttons[buttons.length-1]); }, 1500); }, true); }, true); moveAndClick(inlineBox.domNode); return d; } }) }); doh.register("renderAsHtml", [ // "plain text" mode, < > & have no special meaning { name: "false", timeout: 10000, runTest: function(){ var d = new doh.Deferred(); // confirm initial displayed value var inlineBox = registry.byId("renderAsHtml_false"); doh.is("&lt;B&gt;not bold&lt;/B&gt;&amp;lt;input&amp;gt;", lang.trim(inlineBox.domNode.innerHTML), "confirm initial value (with special chars) wasn't modified"); doh.is("<B>not bold</B>&lt;input&gt;", inlineBox.get("value"), "confirm initial get('value')"); // launch editor, and make sure that special characters aren't mangled moveAndClick(inlineBox.domNode); robot.sequence(d.getTestErrback(function(){ var editor = inlineBox.wrapperWidget.editWidget; doh.is("<B>not bold</B>&lt;input&gt;", editor.get("value"), "initial editor value"); }), 1000); // edit value and save robot.keyPress(keys.RIGHT_ARROW, 1000, {}); robot.typeKeys("end", 2000, 1000); robot.keyPress(keys.ENTER, 500, {}); // check that display value didn't mangle special characters robot.sequence(d.getTestCallback(function(){ doh.is("&lt;B&gt;not bold&lt;/B&gt;&amp;lt;input&amp;gt;end", lang.trim(inlineBox.domNode.innerHTML), "displayed value after edit"); doh.is("<B>not bold</B>&lt;input&gt;end", inlineBox.get("value"), "get('value') after edit"); }), 1000); return d; } }, // HTML mode, display mode has rich text, which is passed to editor { name: "true", timeout: 10000, runTest: function(){ var d = new doh.Deferred(); // confirm initial displayed value var inlineBox = registry.byId("renderAsHtml_true"); doh.is("&lt;b&gt;not bold&lt;/b&gt;<b>bold</b>&amp;lt;input&amp;gt;", lang.trim(inlineBox.domNode.innerHTML).toLowerCase(), "confirm initial value (with special chars) wasn't modified"); doh.is("&lt;b&gt;not bold&lt;/b&gt;<b>bold</b>&amp;lt;input&amp;gt;", inlineBox.get("value").toLowerCase(), "confirm initial get('value')"); // launch editor, and make sure that value was passed to editor as HTML moveAndClick(inlineBox.domNode); robot.sequence(d.getTestErrback(function(){ var editor = inlineBox.wrapperWidget.editWidget; doh.is("&lt;b&gt;not bold&lt;/b&gt;<b>bold</b>&amp;lt;input&amp;gt;", editor.get("value").toLowerCase(), "initial editor value"); }), 1000); // edit value and save robot.keyPress(keys.RIGHT_ARROW, 1000, {}); robot.typeKeys("end", 2000, 1000); robot.keyPress(keys.ENTER, 500, {}); // check that display value didn't mangle special characters robot.sequence(d.getTestCallback(function(){ doh.is("&lt;b&gt;not bold&lt;/b&gt;<b>bold</b>&amp;lt;input&amp;gt;end", lang.trim(inlineBox.domNode.innerHTML).toLowerCase(), "displayed value after edit"); doh.is("&lt;b&gt;not bold&lt;/b&gt;<b>bold</b>&amp;lt;input&amp;gt;end", inlineBox.get("value").toLowerCase(), "get('value') after edit"); }), 1000); return d; } } ]); doh.register("focus tests", [ { name: "RTE", timeout: 7000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId("inlineRTE"); var handler = aspect.after(inlineBox, 'edit', function(){ handler.remove(); handler = aspect.after(inlineBox, 'save', function(){ handler.remove(); setTimeout(d.getTestCallback(function(){ doh.t(helpers.isHidden(inlineBox.wrapperWidget), "editor widget should be visible"); doh.t(inlineBox.get("value").indexOf('!start!') >= 0, "value changed"); }), 1000); }); robot.typeKeys("!start!", 1, 1400); var buttons = query(".saveButton", inlineBox.domNode.parentNode); moveAndClick(buttons[buttons.length-1]); }); moveAndClick(inlineBox.domNode); return d; } } ]); doh.register("positioning", [ { name: "offscreen", timeout: 4000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId("areaEditable"); inlineBox.edit(); moveAndClick("disableAreaEditable"); robot.sequence(d.getTestCallback(function(){ doh.t(inlineBox.get("disabled"), "disabled"); inlineBox.set('disabled', false); inlineBox.cancel(); }), 1000); return d; } } ]); doh.register("programmatic", [ { name: "create", timeout: 4000, runTest: function(){ // Actually, it was already created by test_InlineEditBox numWidgetsBeforeProgCreate = registry.length; robot.window.programmaticCreate(); doh.t(!!robot.window.programmatic); } }, { name: "set()", timeout: 2000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = registry.byId("editable"); inlineBox.set("value", "programmatic value"); robot.sequence(d.getTestCallback(function(){ doh.is("programmatic value", inlineBox._onChangeValue, "programmatic set causes onChange"); }), 500); return d; } }, { name: "edit", timeout: 2000, runTest: function(){ var d = new doh.Deferred(); var inlineBox = robot.window.programmatic; inlineBox.edit(); inlineBox.wrapperWidget.editWidget.set('value', 'changed'); inlineBox.save(); robot.sequence(d.getTestCallback(function(){ doh.is("changed", inlineBox._onChangeValue, "editing causes onChange"); }), 500); return d; } }, { name: "destroy", timeout: 4000, runTest: function(){ robot.window.programmatic.destroy(); var numWidgetsAfterDestroy = registry.length; doh.is(numWidgetsBeforeProgCreate, numWidgetsAfterDestroy, "no orphaned widgets"); } } ]); doh.run(); }); </script> </head> </html>