Clicking on YesNoSelectEditor behavior has changed since 5.4.1

tabuchik commented 9 months ago

Behavior of before version 5.4.0

The select element shows options when clicked.

Behavior of after version 5.4.1

The select element doesn't show options when clicked. (It shows options only when the space key is pressed.)

Reproduction code

When we replace versions from 5.5.5 to 5.4.0, the behavior seems to change.

<!DOCTYPE HTML>
<html>

<head>
  <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/slickgrid@5.5.5/dist/styles/css/slick-alpine-theme.css" type="text/css" />
</head>

<body>
  <div style="position:relative">
    <div style="width:80px;">
      <div id="myGrid" class="slick-container" style="width:100%;height:500px;"></div>
    </div>
  </div>

  <script src="https://cdn.jsdelivr.net/npm/sortablejs/Sortable.min.js"></script>

  <script src="https://cdn.jsdelivr.net/npm/slickgrid@5.5.5/dist/browser/slick.core.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/slickgrid@5.5.5/dist/browser/slick.interactions.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/slickgrid@5.5.5/dist/browser/slick.grid.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/slickgrid@5.5.5/dist/browser/plugins/slick.cellrangedecorator.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/slickgrid@5.5.5/dist/browser/plugins/slick.cellrangeselector.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/slickgrid@5.5.5/dist/browser/plugins/slick.cellselectionmodel.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/slickgrid@5.5.5/dist/browser/slick.formatters.js"></script>
  <script src="https://cdn.jsdelivr.net/npm/slickgrid@5.5.5/dist/browser/slick.editors.js"></script>

  <script>
    var grid;
    var data = [];
    var columns = [
      { id: "desc", name: "yesno", field: "yesno", formatter: Slick.Formatters.YesNo, editor: Slick.Editors.YesNoSelect },
    ];
    var options = {
      editable: true,
      enableCellNavigation: true,
    };

    document.addEventListener("DOMContentLoaded", function () {
      for (var i = 0; i < 10; i++) {
        data[i] = { "yesno": true };
      }

      grid = new Slick.Grid("#myGrid", data, columns, options);
      grid.setSelectionModel(new Slick.CellSelectionModel());
    });
  </script>
</body>

</html>

ghiscoding commented 9 months ago

It's working fine on the example-frozen-columns, with autoEdit enabled or disabled, it works fine (live demo is shown below, no issue).

oh actually, I had to read your issue multiple time to understand your problem. It wasn't clear that the issue is not to open it but instead happens when trying to click the select dropdown itself.

EDIT

Actually I found that the regression was introduced in v5.4.1 by PR #897, when the cell was clicked it went into the new code thinking the user wanted to start a dragging and it cancelled event bubbling so clicking the dropdown had no effect

tabuchik commented 9 months ago

@ghiscoding Thank you!

ghiscoding commented 9 months ago

fixed in v5.5.6

6pac / SlickGrid