gridTest - clickHeaderCell doesn't work with a header that includes a filter box
#5,455 opened on 2016年6月6日
説明
The clickHeaderCell() function of the gridTestUtils does not work on a header that includes a filter box. To reproduce, write a protractor test that includes this functionality (ideally with sorting enabled on the column you want to click) and you can see that when the event is called nothing happens to the column. After researching, it looks like the issue is that the call to this.headerCell() returns the entire column header element, which in and of itself is fine. However, the docs for Selenium state that if an element is provided for mouseMove or mouseDown, then the event fires with the middle of the element as the target. [http://seleniumhq.github.io/selenium/docs/api/javascript/module/selenium-webdriver/lib/actions_exports_ActionSequence.html#mouseDown] In this case, the middle of the element actually falls within the boundaries of the filter box and does not trigger a sort event on the column. My assumption is that the clickHeaderCell() function should still trigger a sort in this case. I was able to correct the issue by adding an additional by.css locator to the result of this.headerCell() inside of the clickHeaderCell definition to target specifically the clickable portion of the header. The class I targeted was '.ui-grid-header-cell-primary-focus'.
Here is my working code for the clickHeaderCell function:
clickHeaderCell: function (gridId, colNumber) {
var headerCell = this.headerCell(gridId, colNumber).element(by.css('.ui-grid-header-cell-primary-focus'));
// NOTE: Can't do .click() as it doesn't work when webdriving Firefox
return browser.actions()
.mouseMove(headerCell)
.mouseDown(headerCell)
.mouseUp()
.perform();
// return headerCell.click();
},