You can not select more than 25 topics
Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
189 lines
8.3 KiB
189 lines
8.3 KiB
<!DOCTYPE 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>TextArea 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 type="text/javascript"> |
|
var TEXTAREA_ROWS = 3; |
|
var TEXTAREA_COLS = 20; |
|
var TEXTAREA_INNERHTML = "TextArea"; |
|
var TEXTAREA_NEW_VALUE = "This is mobile TextArea.\nThis is fixed text area.\nScroll bar comes up automatically.\nHello dojox.mobile"; |
|
var WIDGET_CLASSNAME1 = "mblTextArea"; |
|
var WIDGET_OFFSETHEIGHT1 = 55; |
|
var WIDGET_OFFSETHEIGHT1_FF = 75; |
|
var WIDGET_OFFSETHEIGHT1_FF19 = 74; |
|
var WIDGET_OFFSETHEIGHT1_IE = 55; // IE9 |
|
var WIDGET_OFFSETHEIGHT1_IE10 = 52; // IE10+ and WP8 |
|
var WIDGET_OFFSETHEIGHT2 = 58; |
|
var WIDGET_OFFSETHEIGHT2_IE = "34"; // IE9 |
|
var WIDGET_SCROLLHEIGHT1 = 53; |
|
var WIDGET_SCROLLHEIGHT1_IE = 23; // IE9 |
|
var WIDGET_SCROLLHEIGHT1_IE10 = 16; // IE10+ ans WP8 |
|
var WIDGET_SCROLLHEIGHT1_FF = 65; |
|
var WIDGET_SCROLLHEIGHT1_FF19 = 64; |
|
var WIDGET_SCROLLHEIGHT2 = 83; |
|
var WIDGET_SCROLLHEIGHT2_IE = 113; // IE9 |
|
var WIDGET_SCROLLHEIGHT2_IE10 = 64; // IE10+ and WP8 |
|
var WIDGET_SCROLLHEIGHT2_FF = 80; |
|
var OFFSET2_TOLERANCE_THRESHOLD = 3; |
|
|
|
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/TextArea", |
|
"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, TextArea){ |
|
|
|
function _createTextAreaDeclaratively(widgetId) { |
|
return registry.byId(widgetId); |
|
} |
|
|
|
function _createTextAreaProgrammatically(placeHolderId, widgetId, rows, cols, innerHTML){ |
|
// Create SwapView |
|
var r = new TextArea({id:widgetId, rows:rows, cols:cols, innerHTML:innerHTML}); |
|
runner.assertNotEqual(null, r); |
|
domConst.place(r.domNode, placeHolderId, "replace"); |
|
r.startup(); |
|
|
|
return r; |
|
} |
|
|
|
function _createTextAreaProgrammaticallyWithSourceNodeReference(widgetId){ |
|
// Create IconContainer |
|
var r = new TextArea({}, widgetId); |
|
|
|
r.startup(); |
|
return r; |
|
} |
|
|
|
function _assertCorrectTextArea(widget, offsetHeight1, offsetHeight2, scrollHeight1, scrollHeight2){ |
|
if(offsetHeight1 < 0){ |
|
return; // Skip for IE<9 (a negative offsetHeight1 is the convention we use for skipping) |
|
} |
|
runner.assertNotEqual(null, widget, "TextArea: Did not instantiate."); |
|
runner.assertTrue(domClass.contains(widget.domNode, WIDGET_CLASSNAME1), WIDGET_CLASSNAME1 + " 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.assertTrue(widget.domNode.scrollHeight >= scrollHeight1, |
|
"domNode scrollHeight1[" + widget.domNode.scrollHeight + "] >= expected min scrollHeight1[" + scrollHeight1 + "]? " + |
|
"scrollHeight1 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); |
|
|
|
// The actual value changes a little bit after some browser updates. Hence, |
|
// allow a tolerance threshold. |
|
runner.assertTrue( |
|
Math.abs(offsetHeight2 - widget.domNode.offsetHeight) <= OFFSET2_TOLERANCE_THRESHOLD, |
|
"offsetHeight2 id=" + widget.domNode.id + |
|
"; expected: " + offsetHeight2 + " got: " + widget.domNode.offsetHeight); |
|
|
|
runner.assertTrue(widget.domNode.scrollHeight >= scrollHeight2, |
|
"domNode scrollHeight2[" + widget.domNode.scrollHeight + "] >= expected min scrollHeight2[" + scrollHeight2 + "]? " + |
|
"scrollHeight2 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, ""); |
|
} |
|
|
|
ready(function(){ |
|
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 = offsetHeight1; |
|
var scrollHeight1 = has("ie") ? (has("ie") === 10 ? WIDGET_SCROLLHEIGHT1_IE10 : WIDGET_SCROLLHEIGHT1_IE) : |
|
has("ff") ? |
|
(has("ff") >= 19 ? WIDGET_SCROLLHEIGHT1_FF19 : WIDGET_SCROLLHEIGHT1_FF) : |
|
(has("trident") > 6) ? WIDGET_SCROLLHEIGHT1_IE10 : WIDGET_SCROLLHEIGHT1; |
|
var scrollHeight2 = has("ie") ? (has("ie") === 10 ? WIDGET_SCROLLHEIGHT2_IE10 : WIDGET_SCROLLHEIGHT2_IE) : |
|
has("ff") ? WIDGET_SCROLLHEIGHT2_FF: |
|
(has("trident") > 6) ? WIDGET_SCROLLHEIGHT2_IE10 : WIDGET_SCROLLHEIGHT2; |
|
// Skip the checks for IE<9 |
|
if(has("ie") < 9){ |
|
offsetHeight1 = -1; // negative value as convention for skipping tests |
|
} |
|
runner.register("dojox.mobile.test.doh.TextArea", [ |
|
{ |
|
name: "TextArea Verification1", |
|
timeout: 10000, |
|
runTest: function(){ |
|
_createTextAreaDeclaratively("view1-TextArea1"); |
|
_createTextAreaProgrammatically("view1-TextArea2place", "view1-TextArea2", |
|
TEXTAREA_ROWS, TEXTAREA_COLS, TEXTAREA_INNERHTML); |
|
_createTextAreaProgrammaticallyWithSourceNodeReference("view1-TextArea3"); |
|
|
|
var d = new runner.Deferred(); |
|
setTimeout(d.getTestCallback(function(){ |
|
var widget1 = registry.byId("view1-TextArea1"); |
|
var widget2 = registry.byId("view1-TextArea2"); |
|
var widget3 = registry.byId("view1-TextArea3"); |
|
_assertCorrectTextArea(widget1, offsetHeight1, offsetHeight2, scrollHeight1, scrollHeight2); |
|
_assertCorrectTextArea(widget2, offsetHeight1, offsetHeight2, scrollHeight1, scrollHeight2); |
|
_assertCorrectTextArea(widget3, offsetHeight1, offsetHeight2, scrollHeight1, scrollHeight2); |
|
}), 2000); |
|
return d; |
|
} |
|
}, |
|
{ |
|
name: "TextArea Verification2", |
|
timeout: 10000, |
|
runTest: function(){ |
|
_createTextAreaDeclaratively("view2-TextArea1"); |
|
_createTextAreaProgrammatically("view2-TextArea2place", "view2-TextArea2", |
|
TEXTAREA_ROWS, TEXTAREA_COLS, TEXTAREA_INNERHTML); |
|
_createTextAreaProgrammaticallyWithSourceNodeReference("view2-TextArea3"); |
|
|
|
_showView2(); |
|
var d = new runner.Deferred(); |
|
setTimeout(d.getTestCallback(function(){ |
|
var widget1 = registry.byId("view2-TextArea1"); |
|
var widget2 = registry.byId("view2-TextArea2"); |
|
var widget3 = registry.byId("view2-TextArea3"); |
|
_assertCorrectTextArea(widget1, offsetHeight1, offsetHeight2, scrollHeight1, scrollHeight2); |
|
_assertCorrectTextArea(widget2, offsetHeight1, offsetHeight2, scrollHeight1, scrollHeight2); |
|
_assertCorrectTextArea(widget3, offsetHeight1, offsetHeight2, scrollHeight1, scrollHeight2); |
|
}), 2000); |
|
return d; |
|
} |
|
} |
|
]); |
|
runner.run(); |
|
}); |
|
}); |
|
</script> |
|
</head> |
|
<body style="visibility:hidden;"> |
|
<div id="view2" data-dojo-type="dojox.mobile.View"> |
|
<h1>View 2</h1> |
|
<textarea id="view2-TextArea1" data-dojo-type="dojox.mobile.TextArea" rows="3" cols="20">TextArea</textarea><br> |
|
<div id="view2-TextArea2place"></div><br> |
|
<textarea id="view2-TextArea3" rows="3" cols="20">TextArea</textarea><br> |
|
</div> |
|
<div id="view1" data-dojo-type="dojox.mobile.View" selected="true"> |
|
<h1>View 1</h1> |
|
<textarea id="view1-TextArea1" data-dojo-type="dojox.mobile.TextArea" rows="3" cols="20">TextArea</textarea><br> |
|
<div id="view1-TextArea2place"></div><br> |
|
<textarea id="view1-TextArea3" rows="3" cols="20">TextArea</textarea><br> |
|
</div> |
|
</body> |
|
</html>
|
|
|