Skip to content

Commit 77a7e84

Browse files
committed
Fixed tests
1 parent cfc27c0 commit 77a7e84

File tree

6 files changed

+113
-70
lines changed

6 files changed

+113
-70
lines changed

CHANGELOG.md

Lines changed: 2 additions & 2 deletions
Original file line numberDiff line numberDiff line change
@@ -1,8 +1,8 @@
1-
# 0.6.0 / Unreleased
1+
# 1.0.0 / Unreleased
22

33
* [CHANGE] Removed `init` event, added `createMenu` event.
44
* [CHANGE] Added unit tests.
5-
* [FEATURE] Added `getMenu` method.
5+
* [FEATURE] Added `getMenu()` and `isOpen()` methods.
66
* [BUGFIX] Fixed custom position sample.
77

88
# 0.5.0 / 2013-06-02

README.md

Lines changed: 4 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -180,6 +180,10 @@ structure (see [jQueryUI menu] for details):
180180
<dd>
181181
Return the jQuery object for the menu's <code>UL</code> element.
182182
</dd>
183+
<dt>isOpen()</dt>
184+
<dd>
185+
Return true if popup is visible.
186+
</dd>
183187
<dt>open(target)</dt>
184188
<dd>
185189
Open context menu on a specific target (target must match the options.delegate filter).<br>

jquery.ui-contextmenu.js

Lines changed: 46 additions & 39 deletions
Original file line numberDiff line numberDiff line change
@@ -48,7 +48,6 @@
4848
this.$menu = null;
4949
this.menuIsTemp = false;
5050
this.currentTarget = null;
51-
this.ns = "." + this.widgetName;
5251

5352
if(opts.preventSelect){
5453
// Create a global style for all potential menu targets
@@ -67,31 +66,27 @@
6766
.appendTo("head");
6867
// TODO: the selectstart is not supported by FF?
6968
if(supportSelectstart){
70-
this.element.delegate(opts.delegate, "selectstart" + this.ns, function(event){
69+
this.element.delegate(opts.delegate, "selectstart" + this.eventNamespace, function(event){
7170
event.preventDefault();
7271
});
7372
}
7473
}
7574
this._createUiMenu(opts.menu);
7675

77-
eventNames = "contextmenu" + this.ns;
76+
eventNames = "contextmenu" + this.eventNamespace;
7877
if(opts.taphold){
79-
eventNames += " taphold" + this.ns;
78+
eventNames += " taphold" + this.eventNamespace;
8079
}
80+
console.log("_create() - element.delegate('" + this.eventNamespace + "')");
8181
this.element.delegate(opts.delegate, eventNames, $.proxy(this._openMenu, this));
82-
83-
console.log("_create() - delegate");
84-
85-
// this._trigger("init");
8682
},
8783
/** Destructor, called on $().contextmenu("destroy"). */
8884
_destroy: function(){
89-
console.log("_destroy() undelegate NS menu=", this.$menu);
90-
this.element.undelegate(this.ns);
91-
if(this.isOpen()){
92-
this._closeMenu();
93-
}
85+
console.log("_destroy() element.undelegate('" + this.eventNamespace + "'), menu=", this.$menu);
86+
this.element.undelegate(this.eventNamespace);
87+
9488
this._createUiMenu(null);
89+
9590
if(this.$headStyle){
9691
this.$headStyle.remove();
9792
this.$headStyle = null;
@@ -100,19 +95,25 @@
10095
/** (Re)Create jQuery UI Menu. */
10196
_createUiMenu: function(menuDef){
10297
// Remove temporary <ul> if any
103-
console.log("_createUiMenu()", menuDef);
98+
console.log("_createUiMenu("+ menuDef + ")");
99+
100+
if(this.isOpen()){
101+
// close without animation, to force async mode
102+
this._closeMenu(true);
103+
}
104+
104105
if(this.menuIsTemp){
105-
console.log("_createUiMenu - remove ", this.$menu);
106+
console.log("_createUiMenu - remove $menu", this.$menu);
106107
this.$menu.remove(); // this will also destroy ui.menu
107-
this.menuIsTemp = false;
108108
} else if(this.$menu){
109-
console.log("_createUiMenu - destroy ", this.$menu);
109+
console.log("_createUiMenu - destroy $menu", this.$menu);
110110
this.$menu.menu("destroy").hide();
111111
}
112+
this.$menu = null;
113+
this.menuIsTemp = false;
112114
// If a menu definition array was passed, create a hidden <ul>
113115
// and generate the structure now
114116
if( ! menuDef ){
115-
this.$menu = null;
116117
return;
117118
} else if($.isArray(menuDef)){
118119
this.$menu = $.moogle.contextmenu.createMenuMarkup(menuDef);
@@ -123,6 +124,7 @@
123124
this.$menu = menuDef;
124125
}
125126
// Create - but hide - the jQuery UI Menu widget
127+
console.log("_createUiMenu - create $menu", this.$menu);
126128
this.$menu
127129
.hide()
128130
// .addClass("moogle-contextmenu")
@@ -132,7 +134,6 @@
132134
create: $.proxy(this.options.createMenu, this),
133135
focus: $.proxy(this.options.focus, this),
134136
select: $.proxy(function(event, ui){
135-
// window.console.log("select proxy");
136137
var isParent = (ui.item.has(">a[aria-haspopup='true']").length > 0);
137138
ui.cmd = normCommand(ui.item.find(">a").attr("href"));
138139
ui.target = $(this.currentTarget);
@@ -158,16 +159,17 @@
158159
event.preventDefault();
159160

160161
if( this._trigger("beforeOpen", event, ui) === false ){
162+
this.currentTarget = null;
161163
return false;
162164
}
163165
ui.menu = this.$menu; // Might have changed in beforeOpen
164166
// Register global event handlers that close the dropdown-menu
165-
console.log("_openMenu() - document.bind: " + this.ns, this.menuIsTemp, this.$menu);
166-
$(document).bind("keydown" + this.ns, function(event){
167+
console.log("_openMenu() - document.bind('" + this.eventNamespace + "')", this.menuIsTemp, this.$menu);
168+
$(document).bind("keydown" + this.eventNamespace, function(event){
167169
if( event.which === $.ui.keyCode.ESCAPE ){
168170
self._closeMenu();
169171
}
170-
}).bind("mousedown" + this.ns + " touchstart" + this.ns, function(event){
172+
}).bind("mousedown" + this.eventNamespace + " touchstart" + this.eventNamespace, function(event){
171173
// Close menu when clicked outside menu
172174
if( !$(event.target).closest(".ui-menu-item").length ){
173175
self._closeMenu();
@@ -198,21 +200,24 @@
198200

199201
this._show(this.$menu, this.options.show, function(){
200202
self._trigger.call(self, "open", event, ui);
203+
console.log("_openMenu() - done");
201204
});
202205
},
203206
/** Close popup. */
204-
_closeMenu: function(){
205-
var self = this;
207+
_closeMenu: function(immediately){
208+
var self = this,
209+
hideOpts = immediately ? false : this.options.hide;
206210

207-
console.log("_closeMenu() - document.unbind: " + this.ns, this.menuIsTemp, this.$menu);
211+
console.log("_closeMenu() - document.unbind('" + this.eventNamespace + "')", this.menuIsTemp, this.$menu);
208212
$(document)
209-
.unbind("mousedown" + this.ns)
210-
.unbind("touchstart" + this.ns)
211-
.unbind("keydown" + this.ns);
212-
213-
this._hide(this.$menu, this.options.hide, function() {
213+
.unbind("mousedown" + this.eventNamespace)
214+
.unbind("touchstart" + this.eventNamespace)
215+
.unbind("keydown" + this.eventNamespace);
216+
217+
this._hide(this.$menu, hideOpts, function() {
214218
self._trigger("close");
215219
self.currentTarget = null;
220+
console.log("_closeMenu() - done");
216221
});
217222
},
218223
/** Handle $().contextmenu("option", key, value) calls. */
@@ -229,6 +234,17 @@
229234
var $entry = this.$menu.find("li a[href=#" + normCommand(cmd) + "]");
230235
return wantLi ? $entry.closest("li") : $entry;
231236
},
237+
/** Close context menu. */
238+
close: function(){
239+
if(this.isOpen()){
240+
this._closeMenu();
241+
}
242+
},
243+
/** Enable or disable the menu command. */
244+
enableEntry: function(cmd, flag){
245+
this._getMenuEntry(cmd, true).toggleClass("ui-state-disabled", (flag === false));
246+
},
247+
/** Redefine the whole menu. */
232248
/** Return Menu element (UL). */
233249
getMenu: function(){
234250
return this.$menu;
@@ -244,15 +260,6 @@
244260
var e = jQuery.Event("contextmenu", {target: target.get(0)});
245261
return this.element.trigger(e);
246262
},
247-
/** Close context menu. */
248-
close: function(){
249-
return this._closeMenu.call(this);
250-
},
251-
/** Enable or disable the menu command. */
252-
enableEntry: function(cmd, flag){
253-
this._getMenuEntry(cmd, true).toggleClass("ui-state-disabled", (flag === false));
254-
},
255-
/** Redefine the whole menu. */
256263
replaceMenu: function(data){
257264
this._createUiMenu(data);
258265
},

test/index.html

Lines changed: 10 additions & 4 deletions
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,13 @@
55
<title>jquery.ui-contextmenu Test Suite</title>
66
<link rel="stylesheet" href="http://code.jquery.com/qunit/qunit-1.10.0.css">
77
<script src="http://code.jquery.com/jquery-1.9.0.min.js"></script>
8-
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
9-
<script src="http://code.jquery.com/qunit/qunit-1.10.0.js"></script>
8+
<!--
9+
<script src="jquery-ui.js"></script>
10+
-->
11+
<script src="http://code.jquery.com/ui/1.10.2/jquery-ui.js"></script>
12+
<script src="http://code.jquery.com/qunit/qunit-1.10.0.js"></script>
1013
<script src="../jquery.ui-contextmenu.js"></script>
11-
<script src="tests2.js"></script>
14+
<script src="tests.js"></script>
1215
</head>
1316
<body>
1417
<h1 id="qunit-header">jquery.ui-contextmenu Test Suite</h1>
@@ -23,7 +26,10 @@ <h3>Sample Markup</h3>
2326
<span class="hasmenu">BBB</span>
2427
<span class="hasmenu">CCC</span>
2528
</div>
26-
<ul id="sampleMenu1" style="display: none;">
29+
30+
<!-- This element will be copied as #sampleMenu for every test: -->
31+
32+
<ul id="sampleMenuTemplate" style="display: none;">
2733
<li><a href="#cut"><span class="ui-icon ui-icon-scissors"></span>Cut</a>
2834
<li><a href="#copy"><span class="ui-icon ui-icon-copy"></span>Copy</a>
2935
<li class="ui-state-disabled ui-icon-clipboard"><a href="#paste">Paste</a>

test/tests.js

Lines changed: 18 additions & 8 deletions
Original file line numberDiff line numberDiff line change
@@ -29,6 +29,11 @@ function TestHelpers() {
2929
clearLog: function() {
3030
log.length = 0;
3131
},
32+
entryEvent: function( menu, item, type ) {
33+
lastItem = item;
34+
window.console.log(type + ": ", menu.children( ":eq(" + item + ")" ).find( "a:first" ).length);
35+
menu.children( ":eq(" + item + ")" ).find( "a:first" ).trigger( type );
36+
},
3237
click: function( menu, item ) {
3338
lastItem = item;
3439
window.console.log("clck: ", menu.children( ":eq(" + item + ")" ).find( "a:first" ).length);
@@ -101,13 +106,17 @@ var th = new TestHelpers(),
101106
log = th.log,
102107
logOutput = th.logOutput,
103108
click = th.click,
109+
entryEvent = th.entryEvent,
104110
entry = th.entry,
105111
lifecycle = {
106112
setup: function () {
107113
th.clearLog();
114+
// Always create a fresh copy of the menu <UL> definition
115+
$("#sampleMenuTemplate").clone().attr("id", "sampleMenu").appendTo("body");
108116
},
109117
teardown: function () {
110118
$(":moogle-contextmenu").contextmenu("destroy");
119+
$("#sampleMenu").remove();
111120
}
112121
},
113122
SAMPLE_MENU = [
@@ -160,21 +169,21 @@ function _createTest(menu){
160169
log( "afterConstructor");
161170
$ctx = $(":moogle-contextmenu");
162171
equal( $ctx.length, 1, "widget created");
163-
// ok($("#sampleMenu1").hasClass( "moogle-contextmenu" ), "Class set to menu definition");
172+
// ok($("#sampleMenu").hasClass( "moogle-contextmenu" ), "Class set to menu definition");
164173
equal( $("head style.moogle-contextmenu-style").length, 1, "global stylesheet created");
165174

166175
$ctx.contextmenu("destroy");
167176

168177
equal( $(":moogle-contextmenu").length, 0, "widget destroyed");
169-
// ok( ! $("#sampleMenu1").hasClass( "moogle-contextmenu" ), "Class removed from menu definition");
178+
// ok( ! $("#sampleMenu").hasClass( "moogle-contextmenu" ), "Class removed from menu definition");
170179
equal( $("head style.moogle-contextmenu-style").length, 0, "global stylesheet removed");
171180

172181
equal(logOutput(), "constructor,createMenu,create,afterConstructor",
173182
"Event sequence OK." );
174183
}
175184

176185
test("create from UL", function(){
177-
_createTest("ul#sampleMenu1");
186+
_createTest("ul#sampleMenu");
178187
});
179188

180189

@@ -237,7 +246,7 @@ function _openTest(menu){
237246

238247

239248
asyncTest("UL menu", function(){
240-
_openTest("ul#sampleMenu1");
249+
_openTest("ul#sampleMenu");
241250
});
242251

243252

@@ -276,7 +285,7 @@ function _clickTest(menu){
276285
//// equal( ui.cmd, "cut", "focus: ui.cmd is set" );
277286
//// ok( !ui.target || ui.target.text() === "AAA", "focus: ui.target is set" );
278287
// },
279-
/* blur seems always to have ui.item === null. Also called twice in Safari? */
288+
// /* blur seems always to have ui.item === null. Also called twice in Safari? */
280289
// blur: function(event, ui){
281290
// var t = ui.item ? $(ui.item).find("a:first").attr("href") : ui.item;
282291
// log("blur(" + t + ")");
@@ -293,7 +302,8 @@ function _clickTest(menu){
293302
open: function(event){
294303
log("open");
295304
setTimeout(function(){
296-
click($popup, 0);
305+
entryEvent($popup, 0, "mouseenter");
306+
click($popup, 0);
297307
}, 10);
298308
},
299309
close: function(event){
@@ -313,7 +323,7 @@ function _clickTest(menu){
313323
equal(logOutput(), "createMenu,create,open(),beforeOpen(AAA),after open(),open,select(#cut),close",
314324
"Event sequence OK.");
315325
start();
316-
}, 4000);
326+
}, 500);
317327
}
318328

319329

@@ -323,7 +333,7 @@ asyncTest("Array menu", function(){
323333

324334

325335
asyncTest("UL menu", function(){
326-
_clickTest("ul#sampleMenu1");
336+
_clickTest("ul#sampleMenu");
327337
});
328338

329339

0 commit comments

Comments
 (0)