Kendo-ui-core: Cannot set filter in grid column menu (disappears on hover)

Created on 4 Jan 2017  路  8Comments  路  Source: telerik/kendo-ui-core

Bug report

Reproduction of the problem

Steps to reproduce:

  1. Open Google Chrome (latest)
  2. Navigate to the Kendo UI Grid / Column menu demo:
    http://demos.telerik.com/kendo-ui/grid/column-menu
  3. Try to set a filter on any column, through the column menu's "Filter" dropdown menu

... or watch this 10sec. animated gif demo:

cannot-set-focus

You see the menu disappearing completely.

Current behavior

The entire menu disappears before the user can actually enter a value to filter on. Rendering the entire grid column menu useless for filtering.

Expected/desired behavior

Expected behaviour is the user can set focus to an entry field - and add a filter.

Environment

  • Kendo UI version: Kendo latest, see demo's in url above
  • jQuery version: Kendo default, see demo's in url above
  • Browser: Occurs only with Google Chrome (version 55.0.2883.95 64-bit), not with Firefox
  • OS: macOS 10.12.2
Bug Grid High

Most helpful comment

This is now fixed and will be included in the next internal build - versions 2016.3.13105 and later. The next upload is scheduled for tomorrow.

All 8 comments

There is a current workaround for this glitch: using the animated example above, when the menu opens select the "contains" criteria (making sure you don't hover over the text field). Next, you can [tab] into the input text field to actually set the filter.

This seems like a bug in handling PointerEvents in Kendo UI. Chrome 55 recently turned on PointerEvents by default which exposed the bug.

More precisely, Kendo UI seems not handling "pointerout" events correctly. For example, when filtering by "Order ID", suppressing "pointerout" events for targets with class "k-numeric-wrap" fixes the problem. Note that the input box for "Order ID" filter has this class.

This, however, doesn't happen in Edge which also support PointerEvents.

Kendo team: please check Chrome-specific codepath in "pointerout" handlers. Could also try the same codepath as Edge.

@mustaqahmed on it

We'll likely ignore PointerEvents entirely in Chrome as the implementation seems to be buggy.

This is now fixed and will be included in the next internal build - versions 2016.3.13105 and later. The next upload is scheduled for tomorrow.

@tsvetomir great news, thanks for the quick follow-up and actions on this.

@tsvetomir Because of this one line in kendo.menu.js, it's been made impossible to patch this fix in safely without modifying the kendo files. The variable is needlessly cached inside a closure.

This pattern is widespread in our codebase and I can't make a commitment to change it everywhere. Still, you can get around this by loading individual scripts. You'll need to overwrite the kendo.supports.pointers variable after loading kendo.core, but before loading the menu.

@tsvetomir That's what I would have done, if the contents and load order of kendo.all.min.js had been documented anywhere. Instead I'm stuck with a mystery bundle that probably starts with kendo.core but is otherwise full of unknowns.

Was this page helpful?
0 / 5 - 0 ratings

Related issues

ipeshev picture ipeshev  路  4Comments

CSP
aersamkull picture aersamkull  路  4Comments

zdravkov picture zdravkov  路  4Comments

ipeshev picture ipeshev  路  4Comments

PreslavKozovski picture PreslavKozovski  路  3Comments