Нажав на Google Maps с Selenium IDE

Question

Я не могу создать тестовый пример Selenium для автоматизации нажатия на Google Maps (в частности, создания маркеров одним щелчком мыши на карте).

1. Функция записи в IDE

   Функция «Запись» записывает мой щелчок мыши как

   <tr>
       <td>click</td>
       <td>//div[@id='map_canvas']/div[3]/div/div/div[4]/div/div/div[5]</td>
       <td></td>
   </tr>
   

   При выполнении команды это не только помещает маркер далеко за пределы видимого вида карты, но и не надежно на страницеобновить, потому что вложенная структура div GMap меняется каждый раз.

2. clickAt

   Здесь было предложено использовать clickAt с внешним div-элементом, напримеритак:

   <tr>
       <td>clickAt</td>
       <td>//div[@id='map_canvas']/div/div[1]</td>
       <td>(400,300)</td>
   </tr>
   

   Это не работает вообще.Я перепробовал все варианты click, clickAt и mouseDown / mouseUp, о которых могу только подумать, но, похоже, ничего не регистрируется.

Я знаю, что Google выпустил их Seleniumнаборы тестов , но я не могу понять, как использовать его в своих интересах.Буду признателен за любую помощь!

Редактировать: Похоже, что причина подхода Google (и всех других подходов, которые я нашел) не работает, потому что я использую v3 Google Maps API.Судя по всему, собственные тесты Selenium от Google используют версию 2.

Answer 1

После долгих сует, думаю, я нашел решение, которое в меру элегантное и достаточно надежное, чтобы хотя бы обрабатывать обновления страниц.

Во-первых, я решил, что, поскольку я могу запускать произвольный JS с помощью команды storeEval, возможно, я смогу использовать возможности JS, чтобы найти элемент, на который нужно нажать. Моей первой мыслью был поиск фактического изображения и нажатие на него:

var imgs = window.document.getElementsByTagName("img");
str = "";
for (var i = 0; i<imgs.length; i++) {
    if (imgs[i].src.match("GetMapImage")) {
        str = imgs[i].src;
        break;
    }
}
str;

Приведенный выше код ищет во всех изображениях источник изображения, содержащий «GetMapImage», который является особенным для поиска изображений Google. Затем я бы сохранил это в переменной Selenium и использовал бы точный src для нажатия на Att. К сожалению, это было ударом или промахом, потому что одно и то же изображение повторяется в трех отдельных делениях, и неясно, какой из них будет на самом деле сверху.

Тогда Я нашел этот пост: Как смоделировать щелчок, используя координаты x, y в JavaScript?

Поскольку я могу определить смещение X и Y моей карты, используя функции Selenium, я мог бы просто запустить document.elementFromPoint (), чтобы получить (я полагаю) любой элемент, на который вы бы естественным образом щелкнули, если бы вы щелкнули по этому x и у местоположения. Мои шаги сейчас:

1. Получить левую и верхнюю позиции моей карты div.
2. Получить элемент, по которому щелкают по этим координатам.
3. Установите для идентификатора этого элемента нечто уникальное.
4. Используйте функцию clickAt с этим идентификатором.

Мой успешный код селена выглядит так:

<tr>
    <td>storeElementPositionLeft</td>
    <td>id=map</td>
    <td>left</td>
</tr>
<tr>
    <td>storeElementPositionTop</td>
    <td>id=map</td>
    <td>top</td>
</tr>
<tr>
    <td>storeEval</td>
    <td>window.document.elementFromPoint(${left}, ${top}).id = &quot;selenium-gmap&quot;</td>
    <td>dummy</td>
</tr>
<tr>
    <td>clickAt</td>
    <td>id=selenium-gmap</td>
    <td>200,100</td>
</tr>

Это, по крайней мере, работает в Firefox 9.0.1, что достаточно для меня. Обратите внимание, что это решение зависит от доступности функции document.elementFromPoint.

Answer 2

Предложение использовать elementFromPoint для id = map у меня не работает (Maps API 3 и FireFox 15), поскольку возвращаемый элемент map_canvas не реагирует на события нажатия.

Наилучшим приближением, которое я нашел, было использование записи клика в IDE, чтобы получить очень специфический элемент canvas и затем расположить его внутри. Использование расширение clickAt также упростило получение позиции.

Очищенный xpath с жестко запрограммированной ссылкой на мозаичный элемент div / canvas, который успешно запускает искомые действия, которые я ищу:

<tr>
 <td>clickAt</td>
 <td>//div[@id='map_canvas']//div[8]/canvas</td>
 <td>150,131</td>
   </tr>
<tr>
  <td>clickAt</td>
  <td>//div[@id='map_canvas']//div[4]/canvas</td>
  <td>90,42</td>
</tr>
<tr>
  <td>clickAt</td>
  <td>//div[@id='map_canvas']//div[16]/canvas</td>
  <td>108,53</td>
</tr>

Answer 3

Для вашей тестовой среды (или небольшого количества маркеров) вы можете установить опцию маркера, оптимизированную на «ложь».Тогда вы можете использовать селектор Xpath.Производительность снижается.

См. Ответы на этот вопрос: Селеновые тесты для карт Google