Search code examples
extjsextjs4

Is it possible to have class or ids on the grid drop down filter?


Can you have HTML ids or classes for the drop down filter/sort widget in extjs Grids?

What I mean is this component :

enter image description here

It's needed for test automation purposes. However we can probably live with it if its not possible, using some fancy CSS selectors instead.


Solution

  • Grid column menu can be quite tricky to test. The main problem that I see is that its html markup does not exist before you click on the column menu button (down arrow). When you click it the main menu with sort, columns and optionally filters is rendered (html markup is created), however, columns submenu html still does not exist. It is created when you move mouse over Columns item of main menu when the submenu is rendered and shown.

    From that point on it exists for all columns because only one menu is use for all.

    Thus, for testing, you would either need to simulate mouse clicks/moves or manually render the menu/submenu.

    You can find out CSS classes involved (after the menu is rendered) by using developer tools to inspect the html markup.