Test Highcharts с Watir Webdriver

Question

Я пишу Ruby в веб-браузере Watir, и мне бы хотелось проверить точность данных в высоком чарте данных, представленных в сравнении CSV-файла (который я уже прочитал). Как я могу читать высокоприоритетные данные с веб-сайта? График высокой четкости, созданный с большим количеством точек данных при наведении указателя мыши на точку, данные будут отображаться в поле. Я не могу найти элемент, используя watir webdriver, как я вижу из источника, что каждая точка является тегами пути. Я думаю, возможно, автоматизировать курсор, чтобы перейти в местоположение x y, но не уверен, как это сделать. Любая помощь? спасибо

Answer 1

Предположения

Поскольку у нас есть только образ вашей карты, а не конкретный HTML, я буду считать, график аналогичен по конструкции к "Basic Line" highcharts demo. Ниже, мы надеемся, будет концептуально работать для вашего графика (т. Е. Подход, вероятно, будет работать, но, скорее всего, потребует некоторых настроек).

получить путь Элементы

В графе существует путь элемента, чтобы нарисовать каждую точку, а также пути элемент, чтобы нарисовать линию.

<g class="highcharts-markers" visibility="visible" zIndex="0.1" transform="translate(62,55) scale(1 1)" clip-path="none"> 
    <path fill="#2f7ed8" d="M 638.25 182.5 C 643.578 182.5 643.578 190.5 638.25 190.5 C 632.922 190.5 632.922 182.5 638.25 182.5 Z"></path> 

G- и элементы путей не поддерживается напрямую Watir, так что вам нужно будет использовать общий тип элемента с помощью CSS или XPath локатора.

#Get the first line (as there are 4 in the demo) 
series1 = browser.element(:css => 'g.highcharts-markers') 

#Get the data points (the last point is ignored since it is the line) 
all_path_elements = series1.elements(:css => 'path') 
points = all_path_elements[0..-2] 

Simulate MouseOver

Вы можете имитировать наведении курсора на элемент, используя hover метод:

browser.element(:css => 'g.highcharts-markers path').hover 

Читать Popup

HTML, из всплывающего меню выглядит :

<g opacity="0" transform="translate(146,222)" visibility="hidden" style="cursor:default;padding:0;white-space:nowrap;" zIndex="8" class="highcharts-tooltip"> 
    <text zIndex="1" style="font-family:&quot;Lucida Grande&quot;, &quot;Lucida Sans Unicode&quot;, Verdana, Arial, Helvetica, sans-serif;font-size:12px;color:#333333;fill:#333333;" y="21" x="8"> 
    <tspan x="8" style="font-size: 10px">Apr</tspan> 
    <tspan dy="16" x="8" style="fill:#8bbc21">Berlin</tspan> 
    <tspan dx="0">: </tspan> 
    <tspan dx="0" style="font-weight:bold">8.4°C</tspan> 
    </text> 

Мы можем получить текст всплывающего окна, используя одно из следующих действий:

#All text together 
puts browser.element(:css => 'g.highcharts-tooltip').text 
#=> "DecTokyo: 9.6°C" 

#Each line of the popup 
browser.elements(:css => 'g.highcharts-tooltip tspan').each{ |x| puts x.text } 
#=> "Dec" 
#=> "Tokyo" 
#=> ":" 
#=> "9.6°C" 

Обратите внимание, что метод text отображает только видимый текст, поэтому вы должны убедиться, что всплывающее окно отображается до получения текст. В качестве альтернативы вы можете проанализировать html элементов.

Поиск Данных Очки

Чтобы найти значение (температура ех) для конкретной даты, мы должны перебрать элементы пути, пока мы не найдем тот, который соответствует желаемой даты. С помощью переменной points, начиная с предыдущей, получим значение для июля.

point = points.find do |p| 
    #Hover over a point 
    p.hover 

    #Get the month from the popup 
    month = browser.elements(:css => 'g.highcharts-tooltip tspan')[0].text 

    #Keep going until the month is "Jul" 
    month == 'Jul' 
end 

#Get the value of the point 
point.hover 
puts browser.elements(:css => 'g.highcharts-tooltip tspan')[3].text 
#=> "25.2°C" 

Это значение затем можно сравнить с таблицей ожидаемых значений.

Запуск сценария

Собирает все точки вместе, дает окончательный пример работает.

require 'watir' 
browser = Watir::Browser.new :chrome 
browser.goto 'http://www.highcharts.com/demo/' 
series1 = browser.element(:css => 'g.highcharts-markers') 
all_path_elements = series1.elements(:css => 'path') 
points = all_path_elements[0..-2] 
point = points.find do |p| 
    p.hover 
    month = browser.elements(:css => 'g.highcharts-tooltip tspan')[0].text 
    month == 'Jul' 
end 
point.hover 
puts browser.elements(:css => 'g.highcharts-tooltip tspan')[3].text 
#=> "25.2°C"