Как написать тестовые примеры e2e для highcharts-angular

Question

Я пытаюсь написать тестовые примеры e2e, используя транспортир для диаграмм, построенных с использованием highcharts-angular в нашем приложении.Я запрашиваю ряд, нанесенный на график, и значения всплывающей подсказки для точки в ряду при наведении курсора мыши.Локаторы для них показаны ниже

getPlottedSeriesNames() {
    return element.all(by.css('.highcharts-legend-item>text>tspan')).getText();
}

hoverOverASeries() {
    return  browser.actions().mouseMove(element(by.css('.highcharts-series-1>.highcharts-point'))).perform();
}

getTooltip() {
    return  element(by.css('.highcharts-tooltip-box>text>tspan')).getText();
}

И в файле спецификации есть следующие вещи:

it('should have the all the series plotted in the chart', async () => {
    const desiredCount = 4;
    const plottedSeries = await occurrenceChart.getPlottedSeriesNames();
    expect(plottedSeries.length).toEqual(desiredCount);
});

it('should have desired tooltip properties', async () => {
    await occurrenceChart.hoverOverASeries();
    const tooltip = await occurrenceChart.getTooltip();// just trying to log the data of tooltip
    console.log('tooltip', tooltip);
});

Я могу получить построенный ряд на графике, но получаю подсказкина mouser hover не работает должным образом (возможно, я делаю это неправильно), и я обнаружил следующую ошибку:

Failed: No element found using locator: By(css selector, .highcharts-tooltip-box&gt;text&gt;tspan)"><![CDATA[NoSuchElementError: No element found using locator: By(css selector, .highcharts-tooltip-box>text>tspan)

Действие наведения мыши не работает, поэтому всплывающая подсказка недоступна.

Есть ли лучший подход для написания тестов e2e для старших диаграмм в угловых приложениях.

Answer 1

Вам нужно mouseMove дважды для всплывающей подсказки.

Я не знаю точно, почему происходит такое поведение, но на скриншоте видно, что с одним mouseMove у вас выделена жирная рамка, но подсказка не появляется

Таким образом, у вас будет hoverOverASeries

return browser.actions().mouseMove(webElement).mouseMove(webElement).perform();

Также локатор getTooltip должен быть (">" изменен на "+")

return element(by.css('.highcharts-tooltip-box+text>tspan')).getText();

PSСпасибо за ссылку на GitHub, я создал запрос на удаление.