使用playwriter和typescript将光标悬停在highcharts图表中的点上

4ioopgfo  于 2022-11-11  发布在  Highcharts
关注(0)|答案(2)|浏览(222)

我尝试在highcharts中自动化悬停在图形点上。我使用SVG xpath和以下代码成功地在Web控制台中隔离了点元素-

await page.hover(
    "//*[local-name()='svg']//*[name()='g' and @class='highcharts-markers highcharts-series-1 highcharts-spline-series highcharts-tracker']//*[name()='path'][4])[2]"
     );

但收到此错误-

page.hover: DOMException: Failed to execute 'evaluate' on 'Document': The string './/*[local-name()='svg']//*[name()='g' and @class='highcharts-markers highcharts-series-1 highcharts-spline-series highcharts-tracker']//*[name()='path'][4])[2]' is not a valid XPath expression.

与剧作家和打字员一起工作。也会很高兴听到其他可能的解决方案。下面你可以找到元素的html信息。谢谢!
element's html

kgsdhlau

kgsdhlau1#

当然,您需要使用Playwright的page.locator(),因为这种方法对于这样的任务非常有用。
我不喜欢使用XPath方法,因为它的语法格式很难看,而且不可靠。

const pathLocator = page.locator('svg > g[class="highcharts-markers highcharts-series-1 highcharts-spline-series highcharts-tracker"] > path')
await pathLocator.nth(4).hover()

如果您认为此解决方案有帮助且正确,请不要忘记选择此解决方案作为正确答案。

chhkpiq4

chhkpiq42#

在网上挖掘了更多之后,我成功了...这里是社区的解决方案-

import { test, expect } from '@playwright/test';
import helper from "../../../shared/helper";
import { LoginPage } from '../../pages/login.pages';

test('click on each column in highcarts', async ({ page }) => {
    test.setTimeout(180000);
    const {url, emailInput, passwordInput, loginButton} = helper.loginPage;
    await page.goto(url);
    await page.fill(emailInput, helper.users.automationUser.email);
    await page.fill(passwordInput, helper.users.automationUser.password);
    await page.click(loginButton);
    await page.waitForNavigation({ url: helper.companiesPage.url });
    await page.goto("https://dview2-dev.3dsignals.io/Samson/reports/idle_classification_report");
    await page.waitForTimeout(2000);
    await page.setViewportSize({ width: 1920, height: 1080 })

    const elementsCount = await page.$$eval("(//*[local-name()='svg']//*[name()='g' and @class='highcharts-series-group'])[3]//*[name()='rect']", (el) => el.length);
    for (var index= 0; index < elementsCount ; index++) {
            await page.locator("(//*[local-name()='svg']//*[name()='g' and @class='highcharts-series-group'])[3]//*[name()='rect'] >> nth=" + index).hover();
            await page.waitForTimeout(2000);

    }        
});

祝大家好运!

相关问题