1

I'm from WebDriver+Java background and new to Protractor, WebDriverJS and Jasmine. I have a page object and there I'm trying to define a function that will hover over a pie chart on a given X Y coordinates and get the tool tip value and return it back to the calling function. But so far no luck. Can anyone please help me to find a better solution for this?

this.getDisCount = function() {
    var dis = element(by
            .css('#piecontainer .highcharts-series>path[fill="#434348"]'));
    return dis.getSize().then(function(size) {
        return (size['height'] / 2).then(function(value) {
            return browser.actions().mouseMove(dis, {
                x : value,
                y : 0
            }).perform().then(function() {
                return element(by.css('#piecontainer g.highcharts-tooltip tspan:nth-of-type(6)')).getText().then(function(text) {
                    return text;
                });
            });
        });
    });
} 

Getting the following exception with the above code.

  • Failed: (size.height / 2).then is not a function at D:\workspace\eclipse\IotTester\page\UseCase1\HomePage.js:85:32 at D:\workspace\eclipse\IotTester\node_modules\protractor\built\element.js :697:28
Umesh_IoT
  • 59
  • 1
  • 11
  • well, you need to use then on something which returns a promise. When promise is successfully resolved, it goes in to 'then' section. You can create a function which calculates size['height']/2 for you and then can call that function here. this way you can use then. – TypeScripter Sep 10 '16 at 16:20

2 Answers2

1

The main problematic part is on this line:

return (size['height'] / 2).then(function(value) {

The size is an already resolved size object, it is not a promise, the then() part is not needed.

Also, let the getDisCount() function return the getText() promise:

this.getDisCount = function() {
    var dis = element(by.css('#piecontainer .highcharts-series>path[fill="#434348"]'));
    dis.getSize().then(function(size) {
        return browser.actions().mouseMove(dis, {
            x : size['height'] / 2,
            y : 0
        }).perform();
    });

    return element(by.css('#piecontainer g.highcharts-tooltip tspan:nth-of-type(6)')).getText();
} 

Then, once you need the value, resolve the result of the function:

myPageObject.getDisCount().then(function (discountValue) {
    console.log(discountValue);
});
alecxe
  • 462,703
  • 120
  • 1,088
  • 1,195
  • However still the x : size['height'] / 2 seems not working. If I put a logger it returns 83. If I hard code the value x : 83 it works. Cant figure why x : size['height'] / 2, is not working – Umesh_IoT Sep 13 '16 at 03:59
  • It finally worked. I used the following to resolve it x : parseInt((size['width'] / 2).toFixed(0)) – Umesh_IoT Sep 13 '16 at 05:29
  • I am not able to find the element for this SVG - https://gist.github.com/rohitkadam19/452c96d9c2bd9538e2f0111de8b93953 Could you please help? @alecxe – rohitkadam19 Mar 02 '17 at 10:11
  • @alecxe XPath I am trying is - `element(by.xpath("//donut-chart/svg/g/path[@fill='#CE4B99']"))` – rohitkadam19 Mar 02 '17 at 10:56
0

There is an issue with protractor instance, so try the selenium instance of web driver that can be obtained using browser.driver and use the dragAndDrop method for the element which you want to hover.

await browser.driver.actions()
    .dragAndDrop(elementToHover, elementToHover)
    .perform();
oliverbj
  • 5,771
  • 27
  • 83
  • 178