jquery.ui-contextmenu Test Suite

diff --git a/.gitignore b/.gitignore index ec3c21c..11101b4 100644 --- a/.gitignore +++ b/.gitignore @@ -4,3 +4,4 @@ npm-debug.log .sizecache.json sauce_connect.log +sc_*.log diff --git a/Gruntfile.coffee b/Gruntfile.coffee index 5d8d42a..9ef6494 100644 --- a/Gruntfile.coffee +++ b/Gruntfile.coffee @@ -40,18 +40,20 @@ module.exports = (grunt) -> jshintrc: ".jshintrc" qunit: - all: ["test/index.html"] + all: ["test/index.html", "test/index-jquery-ui-1-11.html"] "saucelabs-qunit": all: options: - urls: ["http://localhost:9999/test/index.html"] + urls: [ + "http://localhost:9999/test/index.html", + "http://localhost:9999/test/index-jquery-ui-1-11.html" + ] # username: process.env.SAUCE_USERNAME, # key: process.env.SAUCE_ACCESS_KEY, - tunnelTimeout: 5 build: process.env.TRAVIS_JOB_ID - concurrency: 3 + throttled: 10 browsers: [ { browserName: "chrome", platform: "Windows 7" } { browserName: "firefox", platform: "Windows 7" } diff --git a/README.md b/README.md index cf2738f..427fe5c 100644 --- a/README.md +++ b/README.md @@ -94,18 +94,19 @@ $(document).contextmenu({ }); ``` -We also have to provide some HTML markup that defines the context menu -structure (see [jQueryUI menu] for details): +We also have to provide some HTML markup that defines the context menu structure, see +[jQueryUI menu] for details. jQuery UI 1.11 removed the requirement to use anchors in menu +items, so the `` tags should be omitted: ```html

Copy -
Paste +
Copy +
Paste
----
More
- Sub 1 -
- Sub 2 +
- Sub 1 +
- Sub 2

``` diff --git a/demo/index.html b/demo/index.html index 24ad609..e309c75 100644 --- a/demo/index.html +++ b/demo/index.html @@ -8,10 +8,9 @@ - --> + --> - @@ -217,20 +216,20 @@

Sample 2

Action 2 -
Action 3 +
Action 2 +
Action 3

Sample 3

diff --git a/jquery.ui-contextmenu.js b/jquery.ui-contextmenu.js index bd162e7..ac942d5 100644 --- a/jquery.ui-contextmenu.js +++ b/jquery.ui-contextmenu.js @@ -9,13 +9,8 @@ */ ;(function($, window, document, undefined) { "use strict"; - var supportSelectstart = "onselectstart" in document.createElement("div"); - - /** Return command without leading '#' (default to ""). */ - function normCommand(cmd){ - return (cmd && cmd.match(/^#/)) ? cmd.substring(1) : (cmd || ""); - } - + var supportSelectstart = "onselectstart" in document.createElement("div"), + match, uiVersion; $.widget("moogle.contextmenu", { version: "1.4.0-1", @@ -141,10 +136,9 @@ select: $.proxy(function(event, ui){ // User selected a menu entry var retval, - isParent = (ui.item.has(">a[aria-haspopup='true']").length > 0), - $a = ui.item.find(">a"), - actionHandler = $a.data("actionHandler"); - ui.cmd = normCommand($a.attr("href")); + isParent = $.moogle.contextmenu.isMenu(ui.item), + actionHandler = ui.item.data("actionHandler"); + ui.cmd = ui.item.attr("data-command"); ui.target = $(this.currentTarget); // ignore clicks, if they only open a sub-menu if( !isParent || !this.options.ignoreParentSelect){ @@ -252,10 +246,9 @@ } $.Widget.prototype._setOption.apply(this, arguments); }, - /** Return ui-menu entry ( or

tag). */ - _getMenuEntry: function(cmd, wantLi){ - var $entry = this.$menu.find("li a[href=#" + normCommand(cmd) + "]"); - return wantLi ? $entry.closest("li") : $entry; + /** Return ui-menu entry (

tag). */ + _getMenuEntry: function(cmd){ + return this.$menu.find("li[data-command=" + cmd + "]"); }, /** Close context menu. */ close: function(){ @@ -265,7 +258,7 @@ }, /** Enable or disable the menu command. */ enableEntry: function(cmd, flag){ - this._getMenuEntry(cmd, true).toggleClass("ui-state-disabled", (flag === false)); + this._getMenuEntry(cmd).toggleClass("ui-state-disabled", (flag === false)); }, /** Return Menu element (UL). */ getMenu: function(){ @@ -291,30 +284,19 @@ }, /** Redefine menu entry (title or all of it). */ setEntry: function(cmd, titleOrData){ - var $parent, - $entry = this._getMenuEntry(cmd, false); + var $entry = this._getMenuEntry(cmd); if(typeof titleOrData === "string"){ - if( $entry.children("span").length){ - // Replace text without removing child - $entry - .contents() - .filter(function(){ return this.nodeType === 3; }) - .first() - .replaceWith(titleOrData); - }else{ - // tag only contains text (above code doesn't work here) - $entry.text(titleOrData); - } + $.moogle.contextmenu.updateTitle($entry, titleOrData); }else{ - $parent = $entry.closest("li").empty(); + $entry.empty(); titleOrData.cmd = titleOrData.cmd || cmd; - $.moogle.contextmenu.createEntryMarkup(titleOrData, $parent); + $.moogle.contextmenu.createEntryMarkup(titleOrData, $entry); } }, /** Show or hide the menu command. */ showEntry: function(cmd, flag){ - this._getMenuEntry(cmd, true).toggle(flag !== false); + this._getMenuEntry(cmd).toggle(flag !== false); } }); @@ -322,35 +304,6 @@ * Global functions */ $.extend($.moogle.contextmenu, { - /** Convert a menu description into a into a

content. */ - createEntryMarkup: function(entry, $parentLi){ - var $a = null; - - // if(entry.title.match(/^---/)){ - if( !/[^\-\u2014\u2013\s]/.test( entry.title ) ){ - // hyphen, em dash, en dash: separator as defined by UI Menu 1.10 - $parentLi.text(entry.title); - }else{ - $a = $("", { -// text: "" + entry.title, - html: "" + entry.title, // allow to pass HTML markup - href: "#" + normCommand(entry.cmd) - }).appendTo($parentLi); - if( $.isFunction(entry.action) ){ - $a.data("actionHandler", entry.action); - } - if(entry.uiIcon){ - $a.append($("").addClass(entry.uiIcon)); - } - if(entry.disabled){ - $parentLi.addClass("ui-state-disabled"); - } - if($.isPlainObject(entry.data)){ - $a.data(entry.data); - } - } - return $a; - }, /** Convert a nested array of command objects into a

structure. */ createMenuMarkup: function(options, $parentUl){ var i, menu, $ul, $li; @@ -369,7 +322,98 @@ $.extend($.moogle.contextmenu, { } } return $parentUl; + }, + /** Replaces the value of elem's first text node child*/ + replaceFirstTextNodeChild: function(elem, text) { + elem + .contents() + .filter(function(){ return this.nodeType === 3; }) + .first() + .replaceWith(text); } }); + match = $.ui.menu.version.match(/^(\d)\.(\d+)/); + + uiVersion = { + major: parseInt(match[1], 10), + minor: parseInt(match[2], 10) + }; + + if ( uiVersion.major < 2 && uiVersion.minor < 11 ) { + $.extend($.moogle.contextmenu, { + /** Convert a menu description into a into a

content. */ + createEntryMarkup: function(entry, $parentLi){ + var $a = null; + + // if(entry.title.match(/^---/)){ + if( !/[^\-\u2014\u2013\s]/.test( entry.title ) ){ + // hyphen, em dash, en dash: separator as defined by UI Menu 1.10 + $parentLi.text(entry.title); + }else{ + $parentLi.attr("data-command", entry.cmd); + $a = $("", { + html: "" + entry.title, // allow to pass HTML markup + href: "#" + }).appendTo($parentLi); + if( $.isFunction(entry.action) ){ + $parentLi.data("actionHandler", entry.action); + } + if(entry.uiIcon){ + $a.append($("").addClass(entry.uiIcon)); + } + if(entry.disabled){ + $parentLi.addClass("ui-state-disabled"); + } + if($.isPlainObject(entry.data)){ + $a.data(entry.data); + } + } + }, + /** Returns true if the menu item has child menu items */ + isMenu: function(item) { + return item.has(">a[aria-haspopup='true']").length > 0; + }, + /** Updates the menu item's title */ + updateTitle: function(item, title) { + $.moogle.contextmenu.replaceFirstTextNodeChild($("a", item), title); + } + }); + } else { + $.extend($.moogle.contextmenu, { + /** Convert a menu description into a into a
content. */ + createEntryMarkup: function(entry, $parentLi){ + if( !/[^\-\u2014\u2013\s]/.test( entry.title ) ){ + $parentLi.text(entry.title); + } else { + $parentLi + .attr("data-command", entry.cmd) + .html("" + entry.title); + if( $.isFunction(entry.action) ) { + $parentLi.data("actionHandler", entry.action); + } + if( entry.uiIcon ) { + $parentLi + .append($("
") + .addClass(entry.uiIcon)); + } + if( entry.disabled ) { + $parentLi.addClass("ui-state-disabled"); + } + if( $.isPlainObject(entry.data) ) { + $parentLi.data(entry.data); + } + } + }, + /** Returns true if the menu item has child menu items */ + isMenu: function(item) { + return item.is("[aria-haspopup='true']"); + }, + /** Updates the menu item's title */ + updateTitle: function(item, title) { + $.moogle.contextmenu.replaceFirstTextNodeChild(item, title); + } + }); + } + }(jQuery, window, document)); diff --git a/package.json b/package.json index 6bafcc0..71cd9d4 100644 --- a/package.json +++ b/package.json @@ -44,7 +44,7 @@ "grunt-contrib-qunit": "~0.2.0", "grunt-contrib-uglify": "~0.2.0", "grunt-exec": "~0.4.0", - "grunt-saucelabs": "~4.1.2", + "grunt-saucelabs": "~8.1.0", "grunt-contrib-watch": "~0.5.3", "grunt-yabs": "0.0.6" }, diff --git a/test/index-jquery-ui-1-11.html b/test/index-jquery-ui-1-11.html new file mode 100644 index 0000000..7adb31d --- /dev/null +++ b/test/index-jquery-ui-1-11.html @@ -0,0 +1,41 @@ + + + + + jquery.ui-contextmenu Test Suite + + + + + + + + +
jquery.ui-contextmenu Test Suite for jQuery UI >= 1.11.0
+
+
+
+
+
+
Sample Markup
+
+ AAA + BBB + CCC +
+ + + +
- Cut +
- Copy +
- Paste +
- ---- +
- More +
  - Sub Item 1 +
  - Sub Item 2 +
  +
+ + diff --git a/test/index.html b/test/index.html index ef48ae8..24a6122 100644 --- a/test/index.html +++ b/test/index.html @@ -4,7 +4,7 @@ jquery.ui-contextmenu Test Suite - + @@ -30,14 +30,14 @@
Sample Markup
- Cut -
- Copy -
- Paste +
- Cut +
- Copy +
- Paste
- ----
- More
  - Sub Item 1 -
  - Sub Item 2 +
  - Sub Item 1 +
  - Sub Item 2
diff --git a/test/issue-33.html b/test/issue-33.html index ef9c1cc..6b24fe3 100644 --- a/test/issue-33.html +++ b/test/issue-33.html @@ -1,5 +1,5 @@ - + diff --git a/test/tests.js b/test/tests.js index 983eaa6..371ea86 100644 --- a/test/tests.js +++ b/test/tests.js @@ -10,7 +10,12 @@ function TestHelpers() { var lastItem = "", log = [], - $ = jQuery; + $ = jQuery, + match = $.ui.menu.version.match(/^(\d)\.(\d+)/), + uiVersion = { + major: parseInt(match[1], 10), + minor: parseInt(match[2], 10) + }; return { log: function( message, clear ) { @@ -32,12 +37,20 @@ function TestHelpers() { entryEvent: function( menu, item, type ) { lastItem = item; // window.console.log(type + ": ", menu.children( ":eq(" + item + ")" ).find( "a:first" ).length); - menu.children( ":eq(" + item + ")" ).find( "a:first" ).trigger( type ); + if ( uiVersion.major < 2 && uiVersion.minor < 11 ) { + menu.children( ":eq(" + item + ")" ).find( "a:first" ).trigger( type ); + } else { + menu.children( ":eq(" + item + ")" ).trigger( type ); + } }, click: function( menu, item ) { lastItem = item; // window.console.log("clck: ", menu.children( ":eq(" + item + ")" ).find( "a:first" ).length); - menu.children( ":eq(" + item + ")" ).find( "a:first" ).trigger( "click" ); + if ( uiVersion.major < 2 && uiVersion.minor < 11 ) { + menu.children( ":eq(" + item + ")" ).find( "a:first" ).trigger( "click" ); + } else { + menu.children( ":eq(" + item + ")" ).trigger( "click" ); + } }, entry: function( menu, item ) { return menu.children( ":eq(" + item + ")" ); @@ -54,11 +67,6 @@ jQuery(document).ready(function(){ /******************************************************************************* * QUnit setup */ -QUnit.log(function(data) { - if (window.console && window.console.log) { -// window.console.log(data.result + " :: " + data.message); - } -}); QUnit.config.requireExpects = true; @@ -90,10 +98,38 @@ var th = new TestHelpers(), {title: "Sub Item 2", cmd: "sub2" } ]} ], - $ = jQuery; - + $ = jQuery, + sauceLabsLog = []; + +// SauceLabs integration +QUnit.testStart(function (testDetails) { + QUnit.log = function (details) { + if (!details.result) { + details.name = testDetails.name; + sauceLabsLog.push(details); + } + }; +}); +QUnit.done(function (testResults) { + var tests = [], + i, len, details; + for (i = 0, len = sauceLabsLog.length; i < len; i++) { + details = sauceLabsLog[i]; + tests.push({ + name: details.name, + result: details.result, + expected: details.expected, + actual: details.actual, + source: details.source + }); + } + testResults.tests = tests; + /*jshint camelcase:false*/ + window.global_test_results = testResults; + /*jshint camelcase:true*/ +}); //--------------------------------------------------------------------------- @@ -275,7 +311,7 @@ function _clickTest(menu){ // }, select: function(event, ui){ // window.console.log("select"); - var t = ui.item ? $(ui.item).find("a:first").attr("href") : ui.item; + var t = ui.item ? $(ui.item).attr("data-command") : ui.item; log("select(" + t + ")"); equal( ui.cmd, "cut", "select: ui.cmd is set" ); equal( ui.target.text(), "AAA", "select: ui.target is set" ); @@ -301,7 +337,7 @@ function _clickTest(menu){ setTimeout(function(){ // TODO: why is focus() called twice? - equal(logOutput(), "createMenu,create,open(),beforeOpen(AAA),after open(),open,select(#cut),close", + equal(logOutput(), "createMenu,create,open(),beforeOpen(AAA),after open(),open,select(cut),close", "Event sequence OK."); start(); }, 1000); @@ -349,7 +385,7 @@ asyncTest("Array menu", function(){ }, 10); }, select: function(event, ui){ - var t = ui.item ? $(ui.item).find("a:first").attr("href") : ui.item; + var t = ui.item ? $(ui.item).attr("data-command") : ui.item; log("select(" + t + ")"); equal( ui.cmd, "cut", "select: ui.cmd is set" ); equal( ui.target.text(), "AAA", "select: ui.target is set" ); @@ -367,7 +403,7 @@ asyncTest("Array menu", function(){ log("after open()"); setTimeout(function(){ - equal(logOutput(), "open(),after open(),open,select(#cut),cut action,close", + equal(logOutput(), "open(),after open(),open,select(cut),cut action,close", "Event sequence OK."); start(); }, 500);

Sample 2

Sample 3

jquery.ui-contextmenu Test Suite for jQuery UI >= 1.11.0

Sample Markup

Sample Markup