slickgrid - npm Package Compare versions

Comparing version 2.4.15 to 2.4.16

.vscode/tasks.json

@@ -7,3 +7,3 @@ {
       "type": "shell",
-      "command": "yarn run cypress:open",
+      "command": "npm run cypress:open",
       "problemMatcher": []
@@ -14,6 +14,6 @@ },
       "type": "shell",
-      "command": "yarn run cypress:ci",
+      "command": "npm run cypress:ci",
       "problemMatcher": []
     }
   ]
-}
+}

controls/slick.columnpicker.js

@@ -98,11 +98,12 @@ /***
 
-      var $li, $input;
+      var $li, $input, columnId;
       var columnLabel, excludeCssClass;
       for (var i = 0; i < columns.length; i++) {
+        columnId = columns[i].id;
         excludeCssClass = columns[i].excludeFromColumnPicker ? "hidden" : "";
         $li = $('<li class="' + excludeCssClass + '" />').appendTo($list);
-        $input = $("<input type='checkbox' />").data("column-id", columns[i].id);
+        $input = $("<input type='checkbox' id='colpicker-" + columnId + "' />").data("column-id", columnId).appendTo($li);
         columnCheckboxes.push($input);
 
-        if (_grid.getColumnIndex(columns[i].id) != null) {
+        if (_grid.getColumnIndex(columnId) != null) {
           $input.attr("checked", "checked");
@@ -117,5 +118,4 @@ }
 
-        $("<label />")
+        $("<label for='colpicker-" + columnId + "' />")
           .html(columnLabel)
-          .prepend($input)
           .appendTo($li);
@@ -131,7 +131,4 @@ }
         $li = $("<li />").appendTo($list);
-        $input = $("<input type='checkbox' />").data("option", "autoresize");
-        $("<label />")
-          .text(forceFitTitle)
-          .prepend($input)
-          .appendTo($li);
+        $input = $("<input type='checkbox' id='colpicker-forcefit' />").data("option", "autoresize").appendTo($li);
+        $("<label for='colpicker-forcefit' />").text(forceFitTitle).appendTo($li);
         if (_grid.getOptions().forceFitColumns) {
@@ -145,7 +142,4 @@ $input.attr("checked", "checked");
         $li = $("<li />").appendTo($list);
-        $input = $("<input type='checkbox' />").data("option", "syncresize");
-        $("<label />")
-          .text(syncResizeTitle)
-          .prepend($input)
-          .appendTo($li);
+        $input = $("<input type='checkbox' id='colpicker-syncresize' />").data("option", "syncresize").appendTo($li);
+        $("<label for='colpicker-syncresize' />").text(syncResizeTitle).appendTo($li);
         if (_grid.getOptions().syncColumnCellResize) {
@@ -216,3 +210,3 @@ $input.attr("checked", "checked");
         var visibleColumns = [];
-        $.each(columnCheckboxes, function (i, e) {
+        $.each(columnCheckboxes, function (i) {
           if ($(this).is(":checked")) {
@@ -219,0 +213,0 @@ visibleColumns.push(columns[i]);

controls/slick.gridmenu.js

@@ -42,10 +42,24 @@ /***
  *
+ * Available menu options:
+ *     hideForceFitButton:        Hide the "Force fit columns" button (defaults to false)
+ *     hideSyncResizeButton:      Hide the "Synchronous resize" button (defaults to false)
+ *     forceFitTitle:             Text of the title "Force fit columns"
+ *     menuWidth:                 Grid menu button width (defaults to 18)
+ *     resizeOnShowHeaderRow:     Do we want to resize on the show header row event
+ *     syncResizeTitle:           Text of the title "Synchronous resize"
+ *     menuUsabilityOverride:     Callback method that user can override the default behavior of enabling/disabling the menu from being usable (must be combined with a custom formatter)
+ *
  * Available custom menu item options:
- *    title:        Menu item text.
- *    divider:      Whether the current item is a divider, not an actual command.
- *    disabled:     Whether the item is disabled.
- *    tooltip:      Item tooltip.
- *    command:      A command identifier to be passed to the onCommand event handlers.
- *    iconCssClass: A CSS class to be added to the menu item icon.
- *    iconImage:    A url to the icon image.
+ *    action:                     Optionally define a callback function that gets executed when item is chosen (and/or use the onCommand event)
+ *    title:                      Menu item text.
+ *    divider:                    Whether the current item is a divider, not an actual command.
+ *    disabled:                   Whether the item is disabled.
+ *    tooltip:                    Item tooltip.
+ *    command:                    A command identifier to be passed to the onCommand event handlers.
+ *    cssClass:                   A CSS class to be added to the menu item container.
+ *    iconCssClass:               A CSS class to be added to the menu item icon.
+ *    iconImage:                  A url to the icon image.
+ *    textCssClass:               A CSS class to be added to the menu item text.
+ *    itemVisibilityOverride:     Callback method that user can override the default behavior of showing/hiding an item from the list
+ *    itemUsabilityOverride:      Callback method that user can override the default behavior of enabling/disabling an item from the list
  *
@@ -104,4 +118,6 @@ *
     var _self = this;
+    var _visibleColumns = columns;
     var $customTitleElm;
     var $columnTitleElm;
+    var $customMenu;
     var $list;
@@ -114,3 +130,2 @@ var $button;
       hideSyncResizeButton: false,
-      fadeSpeed: 250,
       forceFitTitle: "Force fit columns",
@@ -124,2 +139,13 @@ menuWidth: 18,
       _gridOptions = grid.getOptions();
+      createGridMenu();
+
+      // subscribe to the grid, when it's destroyed, we should also destroy the Grid Menu
+      grid.onBeforeDestroy.subscribe(destroy);
+    }
+
+    function setOptions(newOptions) {
+      options = $.extend({}, options, newOptions);
+    }
+
+    function createGridMenu() {
       var gridMenuWidth = (_options.gridMenu && _options.gridMenu.menuWidth) || _defaults.menuWidth;
@@ -134,5 +160,2 @@ var $header;
 
-      // subscribe to the grid, when it's destroyed, we should also destroy the Grid Menu
-      grid.onBeforeDestroy.subscribe(destroy);
-
       // if header row is enabled, we need to resize it's width also
@@ -158,11 +181,5 @@ var enableResizeHeaderRow = (_options.gridMenu && _options.gridMenu.resizeOnShowHeaderRow != undefined) ? _options.gridMenu.resizeOnShowHeaderRow : _defaults.resizeOnShowHeaderRow;
 
-      var $customMenu = $('<div class="slick-gridmenu-custom" />');
+      $customMenu = $('<div class="slick-gridmenu-custom" />');
       $customMenu.appendTo($menu);
 
-      // user could pass a title on top of the custom section
-      if (_options.gridMenu && _options.gridMenu.customTitle) {
-        $customTitleElm = $('<div class="title"/>').append(_options.gridMenu.customTitle);
-        $customTitleElm.appendTo($customMenu);
-      }
-
       populateCustomMenus(_options, $customMenu);
@@ -189,3 +206,3 @@ populateColumnPicker();
       $(document.body).off("mousedown." + _gridUid, handleBodyMouseDown);
-      $("div.slick-gridmenu." + _gridUid).hide(_options.fadeSpeed);
+      $("div.slick-gridmenu." + _gridUid).hide();
       $menu.remove();
@@ -200,5 +217,33 @@ $button.remove();
       }
+
+      // user could pass a title on top of the custom section
+      if (_options.gridMenu && _options.gridMenu.customTitle) {
+        $customTitleElm = $('<div class="title"/>').append(_options.gridMenu.customTitle);
+        $customTitleElm.appendTo($customMenu);
+      }
+
       for (var i = 0, ln = options.gridMenu.customItems.length; i < ln; i++) {
         var item = options.gridMenu.customItems[i];
+        var callbackArgs = {
+          "grid": _grid,
+          "menu": $menu,
+          "columns": columns,
+          "visibleColumns": _visibleColumns
+        };
 
+        // run each override functions to know if the item is visible and usable
+        var isItemVisible = runOverrideFunctionWhenExists(item.itemVisibilityOverride, callbackArgs);
+        var isItemUsable = runOverrideFunctionWhenExists(item.itemUsabilityOverride, callbackArgs);
+
+        // if the result is not visible then there's no need to go further
+        if (!isItemVisible) {
+          continue;
+        }
+
+        // when the override is defined, we need to use its result to update the disabled property
+        // so that "handleMenuItemCommandClick" has the correct flag and won't trigger a command clicked event
+        if (Object.prototype.hasOwnProperty.call(item, "itemUsabilityOverride")) {
+          item.disabled = isItemUsable ? false : true;
+        }
+
         var $li = $("<div class='slick-gridmenu-item'></div>")
@@ -210,2 +255,6 @@ .data("command", item.command || '')
 
+        if (item.divider || item === "divider") {
+          $li.addClass("slick-gridmenu-item-divider");
+          continue;
+        }
         if (item.disabled) {
@@ -215,5 +264,4 @@ $li.addClass("slick-gridmenu-item-disabled");
 
-        if (item.divider) {
-          $li.addClass("slick-gridmenu-item-divider");
-          continue;
+        if (item.cssClass) {
+          $li.addClass(item.cssClass);
         }
@@ -236,5 +284,9 @@
 
-        var $content = $("<span class='slick-gridmenu-content'></span>")
+        var $text = $("<span class='slick-gridmenu-content'></span>")
           .text(item.title)
           .appendTo($li);
+
+        if (item.textCssClass) {
+          $text.addClass(item.textCssClass);
+        }
       }
@@ -260,14 +312,28 @@ }
       e.preventDefault();
+
+      // empty both the picker list & the command list
       $list.empty();
+      $customMenu.empty();
 
+      populateCustomMenus(_options, $customMenu);
       updateColumnOrder();
       columnCheckboxes = [];
 
+      var callbackArgs = {
+        "grid": _grid,
+        "menu": $menu,
+        "allColumns": columns,
+        "visibleColumns": _visibleColumns
+      };
+
+      // run the override function (when defined), if the result is false it won't go further
+      if (!runOverrideFunctionWhenExists(_options.gridMenu.menuUsabilityOverride, callbackArgs)) {
+        return;
+      }
+
       // notify of the onBeforeMenuShow only works when it's a jQuery event (as per slick.core code)
       // this mean that we cannot notify when the grid menu is attach to a button event
       if (typeof e.isPropagationStopped === "function") {
-        if (_self.onBeforeMenuShow.notify({
-          "grid": _grid,
-          "menu": $menu
-        }, e, _self) == false) {
+
+        if (_self.onBeforeMenuShow.notify(callbackArgs, e, _self) == false) {
           return;
@@ -277,8 +343,9 @@ }
 
-      var $li, $input, excludeCssClass;
+      var $li, $input, columnId, excludeCssClass;
       for (var i = 0; i < columns.length; i++) {
+        columnId = columns[i].id;
         excludeCssClass = columns[i].excludeFromGridMenu ? "hidden" : "";
         $li = $('<li class="' + excludeCssClass + '" />').appendTo($list);
 
-        $input = $("<input type='checkbox' />").data("column-id", columns[i].id);
+        $input = $("<input type='checkbox' id='gridmenu-colpicker-" + columnId + "' />").data("column-id", columns[i].id).appendTo($li);
         columnCheckboxes.push($input);
@@ -290,5 +357,4 @@
 
-        $("<label />")
+        $("<label for='gridmenu-colpicker-" + columnId + "' />")
           .html(columns[i].name)
-          .prepend($input)
           .appendTo($li);
@@ -304,7 +370,5 @@ }
         $li = $("<li />").appendTo($list);
-        $input = $("<input type='checkbox' />").data("option", "autoresize");
-        $("<label />")
-          .text(forceFitTitle)
-          .prepend($input)
-          .appendTo($li);
+        $input = $("<input type='checkbox' id='gridmenu-colpicker-forcefit' />").data("option", "autoresize").appendTo($li);
+        $("<label for='gridmenu-colpicker-forcefit' />").text(forceFitTitle).appendTo($li);
+
         if (_grid.getOptions().forceFitColumns) {
@@ -318,7 +382,4 @@ $input.attr("checked", "checked");
         $li = $("<li />").appendTo($list);
-        $input = $("<input type='checkbox' />").data("option", "syncresize");
-        $("<label />")
-          .text(syncResizeTitle)
-          .prepend($input)
-          .appendTo($li);
+        $input = $("<input type='checkbox' id='gridmenu-colpicker-syncresize' />").data("option", "syncresize").appendTo($li);
+        $("<label for='gridmenu-colpicker-syncresize' />").text(syncResizeTitle).appendTo($li);
 
@@ -334,3 +395,3 @@ if (_grid.getOptions().syncColumnCellResize) {
         .css("max-height", $(window).height() - e.pageY - 10)
-        .fadeIn(_options.fadeSpeed);
+        .show();
 
@@ -351,3 +412,3 @@ $list.appendTo($menu);
 
-      if (item.disabled || item.divider) {
+      if (item.disabled || item.divider || item === "divider") {
         return;
@@ -363,7 +424,15 @@ }
       if (command != null && command != '') {
-        _self.onCommand.notify({
+        var callbackArgs = {
           "grid": _grid,
           "command": command,
-          "item": item
-        }, e, _self);
+          "item": item,
+          "allColumns": columns,
+          "visibleColumns": _visibleColumns
+        };
+        _self.onCommand.notify(callbackArgs, e, _self);
+
+        // execute action callback when defined
+        if (typeof item.action === "function") {
+          item.action.call(this, e, callbackArgs);
+        }
       }
@@ -378,9 +447,12 @@
       if ($menu) {
-        $menu.hide(_options.fadeSpeed);
+        $menu.hide();
         _isMenuOpen = false;
 
-        if (_self.onMenuClose.notify({
+        var callbackArgs = {
           "grid": _grid,
-          "menu": $menu
-        }, e, _self) == false) {
+          "menu": $menu,
+          "allColumns": columns,
+          "visibleColumns": _visibleColumns
+        };
+        if (_self.onMenuClose.notify(callbackArgs, e, _self) == false) {
           return;
@@ -445,3 +517,3 @@ }
         var visibleColumns = [];
-        $.each(columnCheckboxes, function (i, e) {
+        $.each(columnCheckboxes, function (i) {
           if ($(this).is(":checked")) {
@@ -457,7 +529,10 @@ visibleColumns.push(columns[i]);
 
-        _grid.setColumns(visibleColumns);
-        _self.onColumnsChanged.notify({
+        var callbackArgs = {
           "grid": _grid,
+          "allColumns": columns,
           "columns": visibleColumns
-        }, e, _self);
+        };
+        _visibleColumns = visibleColumns;
+        _grid.setColumns(visibleColumns);
+        _self.onColumnsChanged.notify(callbackArgs, e, _self);
       }
@@ -472,8 +547,28 @@ }
 
+    function getVisibleColumns() {
+      return _visibleColumns;
+    }
+
+    /**
+     * Method that user can pass to override the default behavior.
+     * In order word, user can choose or an item is (usable/visible/enable) by providing his own logic.
+     * @param overrideFn: override function callback
+     * @param args: multiple arguments provided to the override (cell, row, columnDef, dataContext, grid)
+     */
+    function runOverrideFunctionWhenExists(overrideFn, args) {
+      if (typeof overrideFn === 'function') {
+        return overrideFn.call(this, args);
+      }
+      return true;
+    }
+
     $.extend(this, {
       "init": init,
       "getAllColumns": getAllColumns,
+      "getVisibleColumns": getVisibleColumns,
       "destroy": destroy,
       "showGridMenu": showGridMenu,
+      "setOptions": setOptions,
       "updateAllTitles": updateAllTitles,
+
       "onBeforeMenuShow": new Slick.Event(),
@@ -480,0 +575,0 @@ "onMenuClose": new Slick.Event(),

cypress.json

 {
-    "baseUrl": "https://6pac.github.io/SlickGrid",
-    "baseExampleUrl": "https://6pac.github.io/SlickGrid/examples",
-    "video": false,
-    "viewportWidth": 1200,
-    "viewportHeight": 800
-  }
+  "baseUrl": "http://localhost:8080",
+  "baseExampleUrl": "http://localhost:8080/examples",
+  "video": false,
+  "viewportWidth": 1200,
+  "viewportHeight": 800
+}

package.json

 {
   "name": "slickgrid",
-  "version": "2.4.15",
+  "version": "2.4.16",
   "description": "A lightning fast JavaScript grid/spreadsheet",
@@ -29,3 +29,4 @@ "main": "slick.core.js",
     "cypress:ci": "node node_modules/cypress/bin/cypress run --reporter xunit --reporter-options output=testresult.xml",
-    "cypress:open": "node node_modules/cypress/bin/cypress open"
+    "cypress:open": "node node_modules/cypress/bin/cypress open",
+    "serve": "http-server ./ -p 8080 -a localhost -s"
   },
@@ -37,4 +38,6 @@ "dependencies": {
   "devDependencies": {
-    "cypress": "^3.4.1"
+    "cypress": "^3.8.0",
+    "eslint": "^6.7.2",
+    "http-server": "^0.12.0"
   }
 }

plugins/slick.headerbuttons.js

@@ -43,2 +43,3 @@ (function ($) {
    *    image:        Relative button image path.
+   *    disabled:     Whether the item is disabled.
    *    tooltip:      Button tooltip.
@@ -49,2 +50,13 @@ *    showOnHover:  Only show the button on hover.
    *
+   * Available menu item options:
+   *    action:                   Optionally define a callback function that gets executed when item is chosen (and/or use the onCommand event)
+   *    command:                  A command identifier to be passed to the onCommand event handlers.
+   *    cssClass:                 CSS class to add to the button.
+   *    handler:                  Button click handler.
+   *    image:                    Relative button image path.
+   *    showOnHover:              Only show the button on hover.
+   *    tooltip:                  Button tooltip.
+   *    itemVisibilityOverride:   Callback method that user can override the default behavior of showing/hiding an item from the list
+   *    itemUsabilityOverride:    Callback method that user can override the default behavior of enabling/disabling an item from the list
+   *
    * The plugin exposes the following events:
@@ -101,2 +113,18 @@ *    onCommand:    Fired on button click for buttons with 'command' specified.
           var button = column.header.buttons[i];
+
+          // run each override functions to know if the item is visible and usable
+          var isItemVisible = runOverrideFunctionWhenExists(button.itemVisibilityOverride, args);
+          var isItemUsable = runOverrideFunctionWhenExists(button.itemUsabilityOverride, args);
+
+          // if the result is not visible then there's no need to go further
+          if (!isItemVisible) {
+            continue;
+          }
+
+          // when the override is defined, we need to use its result to update the disabled property
+          // so that "handleMenuItemCommandClick" has the correct flag and won't trigger a command clicked event
+          if (Object.prototype.hasOwnProperty.call(button, "itemUsabilityOverride")) {
+            button.disabled = isItemUsable ? false : true;
+          }
+
           var btn = $("<div></div>")
@@ -107,2 +135,6 @@ .addClass(options.buttonCssClass)
 
+          if (button.disabled) {
+            btn.addClass("slick-header-button-disabled");
+          }
+
           if (button.showOnHover) {
@@ -157,10 +189,20 @@ btn.addClass("slick-header-button-hidden");
 
+      var callbackArgs = {
+        "grid": _grid,
+        "column": columnDef,
+        "button": button
+      };
+
       if (command != null) {
-        _self.onCommand.notify({
-            "grid": _grid,
-            "column": columnDef,
-            "command": command,
-            "button": button
-          }, e, _self);
+        callbackArgs.command = command;
+      }
 
+      // execute action callback when defined
+      if (typeof button.action === "function") {
+        button.action.call(this, e, callbackArgs);
+      }
+
+      if (command != null && !button.disabled) {
+        _self.onCommand.notify(callbackArgs, e, _self);
+
         // Update the header in case the user updated the button definition in the handler.
@@ -175,2 +217,15 @@ _grid.updateColumnHeader(columnDef.id);
 
+    /**
+     * Method that user can pass to override the default behavior.
+     * In order word, user can choose or an item is (usable/visible/enable) by providing his own logic.
+     * @param overrideFn: override function callback
+     * @param args: multiple arguments provided to the override (cell, row, columnDef, dataContext, grid)
+     */
+    function runOverrideFunctionWhenExists(overrideFn, args) {
+      if (typeof overrideFn === 'function') {
+        return overrideFn.call(this, args);
+      }
+      return true;
+    }
+
     $.extend(this, {
@@ -177,0 +232,0 @@ "init": init,

plugins/slick.headermenu.js

@@ -43,16 +43,23 @@ (function ($) {
    * Available menu options:
-   *    tooltip:      Menu button tooltip.
+   *    autoAlign:              Auto-align drop menu to the left when not enough viewport space to show on the right
+   *    autoAlignOffset:        When drop menu is aligned to the left, it might not be perfectly aligned with the header menu icon, if that is the case you can add an offset (positive/negative number to move right/left)
+   *    buttonCssClass:         an extra CSS class to add to the menu button
+   *    buttonImage:            a url to the menu button image (default '../images/down.gif')
+   *    menuUsabilityOverride:  Callback method that user can override the default behavior of enabling/disabling the menu from being usable (must be combined with a custom formatter)
+   *    minWidth:               Minimum width that the drop menu will have
    *
    *
    * Available menu item options:
-   *    title:            Menu item text.
-   *    divider:          Whether the current item is a divider, not an actual command.
-   *    disabled:         Whether the item is disabled.
-   *    tooltip:          Item tooltip.
-   *    command:          A command identifier to be passed to the onCommand event handlers.
-   *    iconCssClass:     A CSS class to be added to the menu item icon.
-   *    iconImage:        A url to the icon image.
-   *    minWidth:         Minimum width that the drop menu will have
-   *    autoAlign:        Auto-align drop menu to the left when not enough viewport space to show on the right
-   *    autoAlignOffset:  When drop menu is aligned to the left, it might not be perfectly aligned with the header menu icon, if that is the case you can add an offset (positive/negative number to move right/left)
+   *    action:                   Optionally define a callback function that gets executed when item is chosen (and/or use the onCommand event)
+   *    title:                    Menu item text.
+   *    divider:                  Whether the current item is a divider, not an actual command.
+   *    disabled:                 Whether the item is disabled.
+   *    tooltip:                  Item tooltip.
+   *    command:                  A command identifier to be passed to the onCommand event handlers.
+   *    cssClass:                 A CSS class to be added to the menu item container.
+   *    iconCssClass:             A CSS class to be added to the menu item icon.
+   *    iconImage:                A url to the icon image.
+   *    textCssClass:             A CSS class to be added to the menu item text.
+   *    itemVisibilityOverride:   Callback method that user can override the default behavior of showing/hiding an item from the list
+   *    itemUsabilityOverride:    Callback method that user can override the default behavior of enabling/disabling an item from the list
    *
@@ -145,2 +152,7 @@ *
       if (menu) {
+        // run the override function (when defined), if the result is false it won't go further
+        if (!runOverrideFunctionWhenExists(options.menuUsabilityOverride, args)) {
+          return;
+        }
+
         var $el = $("<div></div>")
@@ -186,7 +198,8 @@ .addClass("slick-header-menubutton")
       // or provide alternative menu implementation.
-      if (_self.onBeforeMenuShow.notify({
-          "grid": _grid,
-          "column": columnDef,
-          "menu": menu
-        }, e, _self) == false) {
+      var callbackArgs = {
+        "grid": _grid,
+        "column": columnDef,
+        "menu": menu
+      };
+      if (_self.onBeforeMenuShow.notify(callbackArgs, e, _self) == false) {
         return;
@@ -207,2 +220,17 @@ }
 
+        // run each override functions to know if the item is visible and usable
+        var isItemVisible = runOverrideFunctionWhenExists(item.itemVisibilityOverride, callbackArgs);
+        var isItemUsable = runOverrideFunctionWhenExists(item.itemUsabilityOverride, callbackArgs);
+
+        // if the result is not visible then there's no need to go further
+        if (!isItemVisible) {
+          continue;
+        }
+
+        // when the override is defined, we need to use its result to update the disabled property
+        // so that "handleMenuItemCommandClick" has the correct flag and won't trigger a command clicked event
+        if (Object.prototype.hasOwnProperty.call(item, "itemUsabilityOverride")) {
+          item.disabled = isItemUsable ? false : true;
+        }
+
         var $li = $("<div class='slick-header-menuitem'></div>")
@@ -215,2 +243,7 @@ .data("command", item.command || '')
 
+        if (item.divider || item === "divider") {
+          $li.addClass("slick-header-menuitem-divider");
+          continue;
+        }
+
         if (item.disabled) {
@@ -220,5 +253,4 @@ $li.addClass("slick-header-menuitem-disabled");
 
-        if (item.divider) {
-          $li.addClass("slick-header-menuitem-divider");
-          continue;
+        if (item.cssClass) {
+          $li.addClass(item.cssClass);
         }
@@ -241,5 +273,9 @@
 
-        $("<span class='slick-header-menucontent'></span>")
+        var $text = $("<span class='slick-header-menucontent'></span>")
           .text(item.title)
           .appendTo($li);
+
+        if (item.textCssClass) {
+          $text.addClass(item.textCssClass);
+        }
       }
@@ -279,3 +315,3 @@
 
-      if (item.disabled || item.divider) {
+      if (item.disabled || item.divider || item === "divider") {
         return;
@@ -287,8 +323,14 @@ }
       if (command != null && command !== '') {
-        _self.onCommand.notify({
-            "grid": _grid,
-            "column": columnDef,
-            "command": command,
-            "item": item
-          }, e, _self);
+        var callbackArgs = {
+          "grid": _grid,
+          "column": columnDef,
+          "command": command,
+          "item": item
+        };
+        _self.onCommand.notify(callbackArgs, e, _self);
+
+        // execute action callback when defined
+        if (typeof item.action === "function") {
+          item.action.call(this, e, callbackArgs);
+        }
       }
@@ -301,2 +343,15 @@
 
+    /**
+     * Method that user can pass to override the default behavior.
+     * In order word, user can choose or an item is (usable/visible/enable) by providing his own logic.
+     * @param overrideFn: override function callback
+     * @param args: multiple arguments provided to the override (cell, row, columnDef, dataContext, grid)
+     */
+    function runOverrideFunctionWhenExists(overrideFn, args) {
+      if (typeof overrideFn === 'function') {
+        return overrideFn.call(this, args);
+      }
+      return true;
+    }
+
     $.extend(this, {
@@ -303,0 +358,0 @@ "init": init,

README.md

@@ -12,1 +12,12 @@ ## This is the 6pac SlickGrid repo
 Also check out the [wiki](https://github.com/6pac/SlickGrid/wiki) for news and documentation.
+
+#### Cypress E2E Tests
+We are now starting to add E2E (end to end) tests with [Cypress](https://www.cypress.io/). You can see [here](https://github.com/6pac/SlickGrid/tree/master/cypress/integration) the list of Examples that now have Cypress test. We also added these Cypress tests to the GitHub Actions Workflow, basically the tests will run every time someone pushes a commit or a PR. 
+
+We also welcome any contributions and if you wish to add Cypress test, all you need to do is to clone the repo and then run the following commands
+```bash
+npm install # install all npm packages
+npm run server # run a local http server
+npm run cypress:open # open Cypress tool
+```
+Once Cypress tool is open, you can click on "Run all Specs" to start the tests.

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

4401516

increased by1.62%

Number of package files

141

increased by4.44%

Lines of code

97024

increased by1.61%

Number of lines in readme file

23

increased by91.67%

Worsened metrics

Dev dependency count

3

increased by200%

No dependency changes