dojox
Version:
Dojo eXtensions, a rollup of many useful sub-projects and varying states of maturity – from very stable and robust, to alpha and experimental. See individual projects contain README files for details.
166 lines (160 loc) • 8.44 kB
HTML
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8"/>
<meta name="viewport" content="width=device-width,initial-scale=1,maximum-scale=1,minimum-scale=1,user-scalable=no" />
<meta name="apple-mobile-web-app-capable" content="yes" />
<title>ExpandingTextArea Tests</title>
<script type="text/javascript" src="../../../deviceTheme.js"></script>
<script type="text/javascript" src="../../../../../dojo/dojo.js" data-dojo-config="async: true, parseOnLoad: true"></script>
<script language="JavaScript" type="text/javascript">
var TEXTAREA_ROWS = 3;
var TEXTAREA_COLS = 20;
var TEXTAREA_INNERHTML = "ExpandingTextArea";
var TEXTAREA_NEW_VALUE = "This is mobile ExpandingTextArea.\nThis text area is automaticaly Expanding.\nHello dojox.mobile";
var WIDGET_CLASSNAME1 = "mblTextArea";
var WIDGET_CLASSNAME2 = "mblExpandingTextArea";
var WIDGET_HEIGHT1 = "15px";
var WIDGET_HEIGHT1_FF = "30px";
var WIDGET_HEIGHT1_FF19 = "30px";
// var WIDGET_HEIGHT1_IE6 = "24px";
var WIDGET_HEIGHT1_IE10 = "16px"; // IE10+ and WP8
// var WIDGET_HEIGHT1_IE8 = "26px";
var WIDGET_HEIGHT1_IE = "25px"; // IE9
var WIDGET_OFFSETHEIGHT1 = 25;
var WIDGET_OFFSETHEIGHT1_FF = 40;
var WIDGET_OFFSETHEIGHT1_FF19 = 40;
var WIDGET_OFFSETHEIGHT1_IE = 35; // IE9
var WIDGET_OFFSETHEIGHT1_IE10 = 20; // IE10+ and WP8
var WIDGET_OFFSETHEIGHT2 = 85;
// var WIDGET_OFFSETHEIGHT2_IE8 = "133";
var WIDGET_OFFSETHEIGHT2_IE = "125"; // IE9
var WIDGET_OFFSETHEIGHT2_IE10 = "52";
require([
"dojo/_base/connect",
"dojo/sniff",
"dojo/dom-construct", // dojo.place
"dojo/dom-class", // dojo.hasClass
"dojo/ready", // dojo.ready
"dijit/registry", // dijit.byId
"doh/runner", //doh functions
"dojox/mobile/ExpandingTextArea",
"dojox/mobile", // This is a mobile app.
"dojox/mobile/View", // This mobile app uses mobile view
"dojox/mobile/compat", // This mobile app supports running on desktop browsers
"dojox/mobile/parser" // This mobile app uses declarative programming with fast mobile parser
], function(connect, has, domConst, domClass, ready, registry, runner, ExpandingTextArea){
function _createExpandingTextAreaDeclaratively(widgetId) {
return registry.byId(widgetId);
}
function _createExpandingTextAreaProgrammatically(placeHolderId, widgetId, rows, cols, innerHTML){
var r = new ExpandingTextArea({id:widgetId, rows:rows, cols:cols, innerHTML:innerHTML});
runner.assertNotEqual(null, r);
domConst.place(r.domNode, placeHolderId, "replace");
r.startup();
return r;
}
function _createExpandingTextAreaProgrammaticallyWithSourceNodeReference(widgetId){
// Create IconContainer
var r = new ExpandingTextArea({}, widgetId);
r.startup();
return r;
}
function _assertCorrectExpandingTextArea(widget, styleHeight, offsetHeight1, offsetHeight2){
if(styleHeight < 0){
return; // Skip for IE<9 (a negative styleHeight is the convention we use for skipping)
}
runner.assertNotEqual(null, widget, "IconItem: Did not instantiate.");
runner.assertTrue(domClass.contains(widget.domNode, WIDGET_CLASSNAME1), WIDGET_CLASSNAME1 + " id=" + widget.domNode.id);
runner.assertTrue(domClass.contains(widget.domNode, WIDGET_CLASSNAME2), WIDGET_CLASSNAME2 + " id=" + widget.domNode.id);
runner.assertTrue(widget.domNode.style.height.slice(0,2) >= styleHeight.slice(0,2), "domNode height [" + widget.domNode.style.height + "] >= expected min height[" + styleHeight + "]? style.height id=" + widget.domNode.id);
runner.assertTrue(widget.domNode.offsetHeight >= offsetHeight1,
"domNode offsetHeight[" + widget.domNode.offsetHeight + "] >= expected min offsetHeight1[" + offsetHeight1 + "]? " +
"offsetHeight1 id=" + widget.domNode.id);
runner.assertEqual(TEXTAREA_INNERHTML, widget.textbox.value, 'textbox value');
runner.assertEqual(TEXTAREA_INNERHTML, widget.get('value'), 'widget value');
widget.set('value', TEXTAREA_NEW_VALUE);
runner.assertTrue(widget.domNode.offsetHeight >= offsetHeight2,
"domNode offsetHeight[" + widget.domNode.offsetHeight + "] >= expected min offsetHeight2[" + offsetHeight2 + "]? " +
"offsetHeight2 id=" + widget.domNode.id);
runner.assertEqual(TEXTAREA_NEW_VALUE, widget.textbox.value.replace(/\r\n/g, "\n"), 'textbox new value');
runner.assertEqual(TEXTAREA_NEW_VALUE, widget.get('value').replace(/\r\n/g, "\n"), 'widget new value');
}
function _showView2(){
var view1 = registry.byId("view1");
view1.performTransition("view2", 1, "none");
}
ready(function(){
var styleHeight = has("ie") ? (has("ie") === 10 ? WIDGET_HEIGHT1_IE10 : WIDGET_HEIGHT1_IE) : has("ff") ?
(has("ff") >= 19 ? WIDGET_HEIGHT1_FF19 : WIDGET_HEIGHT1_FF) :
(has("trident") > 6) ? WIDGET_HEIGHT1_IE10 : WIDGET_HEIGHT1;
var offsetHeight1 = has("ie") ? (has("ie") === 10 ? WIDGET_OFFSETHEIGHT1_IE10 : WIDGET_OFFSETHEIGHT1_IE) : has("ff") ?
(has("ff") >= 19 ? WIDGET_OFFSETHEIGHT1_FF19 : WIDGET_OFFSETHEIGHT1_FF) :
(has("trident") > 6) ? WIDGET_OFFSETHEIGHT1_IE10 : WIDGET_OFFSETHEIGHT1;
var offsetHeight2 = has("ie") ? (has("ie") === 10 ? WIDGET_OFFSETHEIGHT2_IE10 : WIDGET_OFFSETHEIGHT2_IE) :
(has("trident") > 6) ? WIDGET_OFFSETHEIGHT2_IE10 : WIDGET_OFFSETHEIGHT2;
// Skip the checks for IE<9
if(has("ie") < 9){
styleHeight = -1; // negative value as convention for skipping tests
}
runner.register("dojox.mobile.test.doh.ExpandingTextArea", [
{
name: "ExpandingTextArea Verification1",
timeout: 4000,
runTest: function(){
var widget1 = _createExpandingTextAreaDeclaratively("dojox_mobile_ExpandingTextArea_0");
var widget2 = _createExpandingTextAreaProgrammatically("view1-ExpandingTextArea2place", "view1-ExpandingTextArea2", TEXTAREA_ROWS, TEXTAREA_COLS, TEXTAREA_INNERHTML);
var widget3 = _createExpandingTextAreaProgrammaticallyWithSourceNodeReference("view1-ExpandingTextArea3");
var d = new runner.Deferred();
setTimeout(d.getTestCallback(function(){
var widget1 = registry.byId("dojox_mobile_ExpandingTextArea_0");
var widget2 = registry.byId("view1-ExpandingTextArea2");
var widget3 = registry.byId("view1-ExpandingTextArea3");
_assertCorrectExpandingTextArea(widget1, styleHeight, offsetHeight1, offsetHeight2);
_assertCorrectExpandingTextArea(widget2, styleHeight, offsetHeight1, offsetHeight2);
_assertCorrectExpandingTextArea(widget3, styleHeight, offsetHeight1, offsetHeight2);
}), 2000);
return d;
}
},
{
name: "ExpandingTextArea Verification2",
timeout: 4000,
runTest: function(){
var widget1 = _createExpandingTextAreaDeclaratively("dojox_mobile_ExpandingTextArea_1");
var widget2 = _createExpandingTextAreaProgrammatically("view2-ExpandingTextArea2place", "view2-ExpandingTextArea2", TEXTAREA_ROWS, TEXTAREA_COLS, TEXTAREA_INNERHTML);
var widget3 = _createExpandingTextAreaProgrammaticallyWithSourceNodeReference("view2-ExpandingTextArea3");
_showView2();
var d = new runner.Deferred();
setTimeout(d.getTestCallback(function(){
var widget1 = registry.byId("dojox_mobile_ExpandingTextArea_1");
var widget2 = registry.byId("view2-ExpandingTextArea2");
var widget3 = registry.byId("view2-ExpandingTextArea3");
_assertCorrectExpandingTextArea(widget1, styleHeight, offsetHeight1, offsetHeight2);
_assertCorrectExpandingTextArea(widget2, styleHeight, offsetHeight1, offsetHeight2);
_assertCorrectExpandingTextArea(widget3, styleHeight, offsetHeight1, offsetHeight2);
}), 2000);
return d;
}
}
]);
runner.run();
});
})
</script>
</head>
<body style="visibility:hidden;">
<div id="view1" data-dojo-type="dojox.mobile.View" selected="true">
<h1>View 1</h1>
<textarea data-dojo-type="dojox.mobile.ExpandingTextArea" rows="3" cols="20">ExpandingTextArea</textarea><br>
<div id="view1-ExpandingTextArea2place"></div><br>
<textarea id="view1-ExpandingTextArea3" rows="3" cols="20">ExpandingTextArea</textarea><br>
</div>
<div id="view2" data-dojo-type="dojox.mobile.View">
<h1>View 2</h1>
<textarea data-dojo-type="dojox.mobile.ExpandingTextArea" rows="3" cols="20">ExpandingTextArea</textarea><br>
<div id="view2-ExpandingTextArea2place"></div><br>
<textarea id="view2-ExpandingTextArea3" rows="3" cols="20">ExpandingTextArea</textarea><br>
</div>
</body>
</html>