source: Dev/trunk/src/client/dijit/tests/_HasDropDown.html @ 483

Last change on this file since 483 was 483, checked in by hendrikvanantwerpen, 11 years ago

Added Dojo 1.9.3 release.
File size: 5.9 KB
Line 
1<!DOCTYPE HTML>
2<html>
3<head>
4<title>_HasDropDown unit test</title>
5
6<script type="text/javascript" src="boilerplate.js"></script>
7
8<script type="text/javascript">
9require([
10        "doh/runner",
11        "dojo/_base/declare", "dojo/dom-geometry", "dojo/keys", "dojo/on", "dojo/_base/window",
12        "dijit/_HasDropDown", "dijit/_WidgetBase", "dijit/_TemplatedMixin",
13        "dijit/tests/helpers", "dojo/domReady!"
14], function(doh, declare, domGeom, keys, on, win,
15                        _HasDropDown, _WidgetBase, _TemplatedMixin, helpers){
16
17
18        var SimplePopup = declare([_WidgetBase, _TemplatedMixin], {
19                // summary:
20                //              A trivial popup widget
21
22                label: "i'm a popup",
23                templateString: "<div>${label}</div>"
24        });
25
26        var SimpleDropDownButton = declare([_WidgetBase, _TemplatedMixin, _HasDropDown], {
27                // summary:
28                //              A button that shows a popup.
29
30                label: "show dropdown",
31                popupLabel: "i'm a popup",
32                orient: ["below"],
33
34                templateString: "<button>${label}</button>",
35
36                postCreate: function(){
37                        this.inherited(arguments);
38                        this.dropDown = new SimplePopup({
39                                id: this.id + "_popup",
40                                label: this.popupLabel
41                        });
42                }
43        });
44
45        var NonFocusableDropDownButton = declare([_WidgetBase, _TemplatedMixin, _HasDropDown], {
46                // summary:
47                //              A non-focusable "button" that shows a popup.   Should work for mouse, although not for keyboard.
48
49                label: "show popup (non-focusable)",
50                orient: ["below"],
51
52                templateString: "<span>${label}</span>",
53
54                postCreate: function(){
55                        this.inherited(arguments);
56                        this.dropDown = new SimplePopup({
57                                id: this.id + "_popup",
58                                label: "popup from non-focusable"
59                        });
60                }
61        });
62
63        // Synthetic events.   Could alternately use robot.
64        function key(node, key){
65                on.emit(node, "keydown", {
66                        keyCode: key,
67                        bubbles: true
68                });
69                on.emit(node, "keyup", {
70                        keyCode: key,
71                        bubbles: true
72                });
73        }
74        function click(node){
75                on.emit(node, navigator.pointerEnabled ? "pointerdown" : navigator.msPointerEnabled ? "MSPointerDown" : "mousedown", {
76                        button: 0,      // left button (except on IE quirks mode, when it's 1)
77                        bubbles: true
78                });
79                on.emit(node, navigator.pointerEnabled ? "pointerup" : navigator.msPointerEnabled ? "MSPointerUp" : "mouseup", {
80                        button: 0,      // left button (except on IE quirks mode, when it's 1)
81                        bubbles: true
82                });
83                on.emit(node, "click", {
84                        bubbles: true
85                });
86        }
87
88        doh.register("basic", [
89                function setup(){
90                        dd = new SimpleDropDownButton({
91                                id: "dd",
92                                label: "show dropdown - ltr"
93                        }).placeAt(win.body());
94                        popup = dd.dropDown;
95                        doh.t(!!popup, "popup exists");
96                },
97                function open(){
98                        var d = new doh.Deferred();
99                        click(dd.domNode);
100                        setTimeout(d.getTestCallback(function(){
101                                doh.t(helpers.isVisible(popup), "popup visible");
102                                var anchorPos = domGeom.position(dd.domNode),
103                                        dropDownPos = domGeom.position(popup.domNode);
104                                doh.t(Math.abs(anchorPos.x - dropDownPos.x) < 1, "drop down and anchor left aligned");
105                                doh.t(Math.abs(anchorPos.w - dropDownPos.w) < 1, "drop down same width as anchor");
106                        }), 10);
107                        return d;
108                },
109                function close(){
110                        dd.closeDropDown();
111                        doh.t(helpers.isHidden(popup), "popup hidden");
112                },
113                function openBySpace(){
114                        var d = new doh.Deferred();
115                        key(dd.domNode, keys.SPACE);
116                        setTimeout(d.getTestCallback(function(){
117                                doh.t(!!popup, "popup exists");
118                                doh.t(helpers.isVisible(popup), "popup visible again");
119                        }), 10);
120                        return d;
121                },
122                function close2(){
123                        dd.closeDropDown();
124                        doh.t(helpers.isHidden(popup), "popup hidden again");
125                }
126                // TODO: open by down arrow
127        ]);
128
129        doh.register("rtl", [
130                function setup(){
131                        dd = new SimpleDropDownButton({
132                                id: "rdd",
133                                dir: "rtl",
134                                label: "show dropdown - rtl"
135                        }).placeAt(win.body());
136                        popup = dd.dropDown;
137                        doh.t(!!popup, "popup exists");
138                },
139                function open(){
140                        var d = new doh.Deferred();
141                        click(dd.domNode);
142                        setTimeout(d.getTestCallback(function(){
143                                doh.t(helpers.isVisible(popup), "popup visible");
144                                var anchorPos = domGeom.position(dd.domNode),
145                                        dropDownPos = domGeom.position(popup.domNode);
146                                doh.t(Math.abs(anchorPos.x - dropDownPos.x) < 1, "drop down and anchor left aligned");
147                                doh.t(Math.abs(anchorPos.w - dropDownPos.w) < 1, "drop down same width as anchor");
148                        }), 10);
149                        return d;
150                }
151        ]);
152
153        doh.register("non focusable", [
154                function setup(){
155                        ndd = new NonFocusableDropDownButton({id: "ndd"}).placeAt(win.body());
156                        popup = ndd.dropDown;
157                        doh.t(!!popup, "popup exists");
158                },
159                function open(){
160                        var d = new doh.Deferred();
161                        click(ndd.domNode);
162                        setTimeout(d.getTestCallback(function(){
163                                doh.t(helpers.isVisible(popup), "popup visible");
164                        }), 10);
165                        return d;
166                },
167                function close(){
168                        ndd.closeDropDown();
169                }
170        ]);
171
172        doh.register("alignment", [
173                function left(){
174                        var d = new doh.Deferred();
175                        var ltr = new SimpleDropDownButton({
176                                id: "ltr",
177                                label: "show non-auto-width dropdown - ltr",
178                                autoWidth: false
179                        }).placeAt(win.body());
180                        click(ltr.domNode);
181                        setTimeout(d.getTestCallback(function(){
182                                var anchorPos = domGeom.position(ltr.domNode),
183                                        dropDownPos = domGeom.position(ltr.dropDown.domNode);
184                                doh.t(Math.abs(anchorPos.x - dropDownPos.x) < 1, "drop down and anchor left aligned");
185                                doh.t(anchorPos.w > dropDownPos.w, "anchor wider than drop down");
186                        }), 10);
187                        return d;
188                },
189                function right(){
190                        var d = new doh.Deferred();
191                        var rtl = new SimpleDropDownButton({
192                                id: "rtl",
193                                dir: "rtl",
194                                label: "show non-auto-width dropdown - rtl",
195                                autoWidth: false
196                        }).placeAt(win.body());
197                        click(rtl.domNode);
198                        setTimeout(d.getTestCallback(function(){
199                                var anchorPos = domGeom.position(rtl.domNode),
200                                        dropDownPos = domGeom.position(rtl.dropDown.domNode);
201                                doh.t(Math.abs((anchorPos.x + anchorPos.w) - (dropDownPos.x + dropDownPos.w)) < 1,
202                                                "drop down and anchor right aligned");
203                                doh.t(anchorPos.w > dropDownPos.w, "anchor wider than drop down");
204                        }), 10);
205                        return d;
206                }
207        ]);
208
209        doh.run();
210});
211</script>
212</head>
213<body class="claro">
214<h1>_HasDropDown Unit Test</h1>
215</body>
216</html>
Note: See TracBrowser for help on using the repository browser.