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
190 lines (170 loc) • 6.41 kB
HTML
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8">
<title>Container</title>
<script src="boilerplate.js"></script>
<script type="text/javascript">
require([
"doh/runner",
"dojo/_base/declare", "dojo/dom", "dojo/parser",
"dijit/a11y", "dijit/focus", "dijit/registry", "dijit/_WidgetBase", "dijit/_Container", "dijit/_Contained",
"dijit/tests/helpers", "dojo/domReady!"
], function(doh, declare, dom, parser, a11y, focus, registry, _WidgetBase, _Container, _Contained, helpers){
declare("TestContainer",
[_WidgetBase, _Container], { }
);
declare("TestContained",
[_WidgetBase, _Contained], {}
);
doh.register("parse", function(){
parser.parse();
});
doh.register("basic tests", [
{
name: "getChildren",
runTest: function(t){
var c = registry.byId("container");
var children = c.getChildren();
t.is(4, children.length);
t.is("zero", children[0].id);
t.is("one", children[1].id);
t.is("two", children[2].id);
t.is("three", children[3].id);
}
},
{
name: "_getSiblingOfChild",
runTest: function(t){
var c = registry.byId("container");
var children = c.getChildren();
t.is("one", c._getSiblingOfChild(children[0], 1).id);
t.is("two", c._getSiblingOfChild(children[1], 1).id);
t.is("three", c._getSiblingOfChild(children[2], 1).id);
t.is(null, c._getSiblingOfChild(children[3], 1));
t.is(null, c._getSiblingOfChild(children[0], -1));
t.is("zero", c._getSiblingOfChild(children[1], -1).id);
t.is("one", c._getSiblingOfChild(children[2], -1).id);
t.is("two", c._getSiblingOfChild(children[3], -1).id);
}
},
{
name: "getIndexOfChild",
runTest: function(t){
var c = registry.byId("container");
t.is(0, c.getIndexOfChild(registry.byId("zero")));
t.is(1, c.getIndexOfChild(registry.byId("one")));
t.is(2, c.getIndexOfChild(registry.byId("two")));
t.is(3, c.getIndexOfChild(registry.byId("three")));
t.is(-1, c.getIndexOfChild(registry.byId("outside")));
t.is(-1, c.getIndexOfChild(registry.byId("outsideCont")));
}
},
{
name: "getIndexInParent",
runTest: function(t){
t.is(0, registry.byId("zero").getIndexInParent());
t.is(1, registry.byId("one").getIndexInParent());
t.is(2, registry.byId("two").getIndexInParent());
t.is(-1, registry.byId("outsideCont").getIndexInParent());
}
},
{
name: "removeChild",
runTest: function(t){
var c = registry.byId("container");
var children = c.getChildren();
t.is(4, children.length);
c.removeChild(registry.byId("zero"));
c.removeChild(1); // should remove "two" - because zero is already removed
children = c.getChildren();
t.is(2, children.length);
t.is("one", children[0].id);
t.is("three", children[1].id);
}
},
{
name: "addChild",
runTest: function(t){
var c = registry.byId("container");
// Add child at beginning
c.addChild(registry.byId("zero"), 0);
children = c.getChildren();
t.is(3, children.length);
t.is("zero", children[0].id, "after addChild(zero), zero");
t.is("one", children[1].id, "after addChild(zero), one");
t.is("three", children[2].id, "after addChild(zero), three");
// Add child in middle
c.addChild(registry.byId("two"), 2);
children = c.getChildren();
t.is(4, children.length);
t.is("zero", children[0].id, "after addChild(two), zero");
t.is("one", children[1].id, "after addChild(two), one");
t.is("two", children[2].id, "after addChild(two), two");
t.is("three", children[3].id, "after addChild(two), three");
// Add child at end
c.addChild(new TestContained({id: "four"}));
children = c.getChildren();
t.is(5, children.length);
t.is("zero", children[0].id, "after addChild(four), zero");
t.is("one", children[1].id, "after addChild(four), one");
t.is("two", children[2].id, "after addChild(four), two");
t.is("three", children[3].id, "after addChild(four), three");
t.is("four", children[4].id, "after addChild(four), four");
// Add child at end with explicit position specified
c.addChild(new TestContained({id: "five"}), 5);
children = c.getChildren();
t.is(6, children.length);
t.is("zero", children[0].id, "after addChild(five), zero");
t.is("one", children[1].id, "after addChild(five), one");
t.is("two", children[2].id, "after addChild(five), two");
t.is("three", children[3].id, "after addChild(five), three");
t.is("four", children[4].id, "after addChild(five), four");
t.is("five", children[5].id, "after addChild(five), five");
}
}
]);
// Test for StackContainer etc. where each child is wrapped inside a <div>
doh.register("wrapped children", [
{
name: "getChildren",
runTest: function(t){
var c = registry.byId("wrappedContainer");
var children = c.getChildren();
t.is(3, children.length);
t.is("wrappedOne", children[0].id);
t.is("wrappedTwo", children[1].id);
t.is("wrappedThree", children[2].id);
}
},
{
name: "getPreviousSibling / getNextSibling",
runTest: function(t){
var c = registry.byId("wrappedTwo");
t.is("wrappedOne", c.getPreviousSibling().id);
t.is("wrappedThree", c.getNextSibling().id);
}
}
]);
doh.run();
});
</script>
</head>
<body>
<label for="input">before:</label><input id="input"/>
<div id="container" data-dojo-type="TestContainer">
<!-- comment just to make sure that numbering isn't thrown off -->
<div id="zero" data-dojo-type="TestContained"></div>
<div id="one" data-dojo-type="TestContained"></div>
<div id="two" data-dojo-type="TestContained"></div>
<div id="three" data-dojo-type="dijit/_WidgetBase"></div>
</div>
<div id="outside" data-dojo-type="dijit/_WidgetBase"></div>
<div id="outsideCont" data-dojo-type="TestContained"></div>
<div id="wrappedContainer" data-dojo-type="TestContainer">
<div id="wrappedOne" data-dojo-type="TestContained"></div>
<div id="wrappedTwo" data-dojo-type="TestContained"></div>
<div id="wrappedThree" data-dojo-type="TestContained"></div>
</div>
</body>
</html>