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.
148 lines (136 loc) • 5.5 kB
HTML
<html>
<head>
<title>PlaceholderMenuItem Test</title>
<style type="text/css">
@import "../../../dojo/resources/dojo.css";
@import "../../../dijit/tests/css/dijitTests.css";
</style>
<!-- required: a default dijit theme: -->
<link id="themeStyles" rel="stylesheet" href="../../../dijit/themes/tundra/tundra.css">
<!-- required: dojo.js -->
<script type="text/javascript" src="../../../dojo/dojo.js"
data-dojo-config="parseOnLoad: true, isDebug: true"></script>
<!-- not needed, for testing alternate themes -->
<script type="text/javascript" src="../../../dijit/tests/_testCommon.js"></script>
<script language="JavaScript" type="text/javascript">
dojo.require("doh.runner");
dojo.require("dojox.widget.PlaceholderMenuItem");
dojo.require("dijit.ColorPalette");
dojo.require("dijit.Calendar");
dojo.require("dojo.parser"); // scan page for widgets and instantiate them
</script>
<script language="Javascript" type="text/javascript">
dojo.addOnLoad(function(){
doh.register("tests",
[
function test_getPlaceholder(t){
var m = dijit.byId("submenu1");
t.is(3, m.getPlaceholders().length);
t.is(2, m.getPlaceholders("PHCopyPaste").length);
t.is(1, m.getPlaceholders("PH2").length);
t.is(0, m.getPlaceholders("None").length);
},
function test_replace(t){
var m = dijit.byId("submenu1"), m3 = dijit.byId("submenu3");
t.is(6, m.getChildren().length); // Placeholder counts as one
t.is(1, m3.getChildren().length); // Placeholder counts as one
dojo.forEach(m.getPlaceholders("PHCopyPaste"), function(ph){
ph.replace([
new dijit.MenuItem({iconClass: "dijitEditorIcon dijitEditorIconCut",
onClick: function(){alert('not actually cutting')},
label: "Cut"}),
new dijit.MenuItem({iconClass: "dijitEditorIcon dijitEditorIconCopy",
onClick: function(){alert('not actually copying')},
label: "Copy"}),
new dijit.MenuItem({iconClass: "dijitEditorIcon dijitEditorIconPaste",
onClick: function(){alert('not actually pasting')},
label: "Paste"})
]);
});
t.is(9, m.getChildren().length); // Placeholder is still there
t.is(4, m3.getChildren().length); // Placeholder is still there
},
function test_unReplace(t){
var m = dijit.byId("submenu1"), m2 = dijit.byId("submenu2");
t.is(3, m2.getChildren().length); // Placeholder counts as one
var ph = m.getPlaceholders("PH2")[0];
t.f(ph._replaced);
ph.replace([
new dijit.MenuItem({label: "Added 1"}),
new dijit.MenuItem({label: "Added 2"})
]);
t.t(ph._replaced);
t.is(5, m2.getChildren().length); // Placeholder is still there
t.is(2, ph.unReplace(true).length);
t.f(ph._replaced);
t.is(3, m2.getChildren().length);
ph = m.getPlaceholders("PH2")[0];
ph.replace([
new dijit.MenuItem({label: "Added Submenu Item"})
]);
t.t(ph._replaced);
t.is(4, m2.getChildren().length);
},
function test_destroyRecursive(t){
var menu = new dijit.Menu(),
ph = new dojox.widget.PlaceholderMenuItem(),
subMenu = new dijit.Menu();
menu.addChild(ph);
t.f(ph._replaced, "ph._replaced 1");
ph.replace([
new dijit.PopupMenuItem({label: "Popup 1", popup: subMenu})
]);
t.t(ph._replaced, "ph._replaced 2");
ph.unReplace(true);
t.f(ph._replaced, "ph._replaced 3");
// subMenu is destroyed iff the Placeholder called
// destroyRecursive on the PopupMenuItem instead of just
// destroy.
t.t(subMenu._destroyed, "subMenu._destroyed");
}
]
);
doh.run();
});
</script>
</head>
<body class="tundra">
<div dojoType="dijit.Menu" id="submenu1" contextMenuForWindow="true" style="display: none;">
<div dojoType="dijit.MenuItem">First Item</div>
<div dojoType="dijit.MenuItem" disabled="true">Disabled Item</div>
<div dojoType="dijit.MenuSeparator"></div>
<div dojoType="dojox.widget.PlaceholderMenuItem">PHCopyPaste</div>
<!--
<div dojoType="dijit.MenuItem" iconClass="dijitEditorIcon dijitEditorIconCut"
onClick="alert('not actually cutting anything, just a test!')">Cut</div>
<div dojoType="dijit.MenuItem" iconClass="dijitEditorIcon dijitEditorIconCopy"
onClick="alert('not actually copying anything, just a test!')">Copy</div>
<div dojoType="dijit.MenuItem" iconClass="dijitEditorIcon dijitEditorIconPaste"
onClick="alert('not actually pasting anything, just a test!')">Paste</div>
-->
<div dojoType="dijit.MenuSeparator"></div>
<div dojoType="dijit.PopupMenuItem">
<span>Enabled Submenu</span>
<div dojoType="dijit.Menu" id="submenu2">
<div dojoType="dijit.MenuItem" onClick="alert('Submenu 1!')">Submenu Item One</div>
<div dojoType="dojox.widget.PlaceholderMenuItem">PH2</div>
<!--
<div dojoType="dijit.MenuItem" onClick="alert('Submenu 2!')">Submenu Item Two</div>
-->
<div dojoType="dijit.PopupMenuItem">
<span>Deeper Submenu</span>
<div dojoType="dijit.Menu" id="submenu3"">
<div dojoType="dojox.widget.PlaceholderMenuItem">PHCopyPaste</div>
</div>
</div>
</div>
</div>
</div>
<div style="padding: 1em">
<h1 class="testTitle">PlaceholderMenuItem Test</h1>
left click to open the menu
</div>
</body>
</html>